Projetos
Explore meus projetos de desenvolvimento web e habilidades.
Carrossel de imagens em HTML e CSS Puro
Uma página web simples com um carrossel em imagens feito em HTML e CSS (sem javascript) e com uso sofisticado de propriedades em CSS conseguimos esse efeito de transição entre um bloco de imagem e outro. Foi utilizado para layout o display flex e imagens incorporadas da internet (fictícias de um jogo) para compor as ilustrações deste carrossel.
O projeto foi uma inspiração do canal no YouTube da Além do Código.
Disponível em: https://www.youtube.com/@AlemDoCodigo.
Vídeo do YouTube: https://www.youtube.com/watch?v=zxqGOgsgUtk&t=2s.
Portfólio Azul e Branco
Site pessoal com portfólio e informações de contato. Website criado a partir de tecnologias web como HTML, CSS e javascript para a estrutura dos componentes e seções home, about-me, education, experience, skills e contact-me e interação dos elementos que compõe a página com os cliques dos usuários que a visitarem. Efeitos visual, criados em javascript, como transições de efeito sutis da barra de navegação ao movê-la para baixo e ao se deslocar entre as seções do portfólio web. Com um formulário de contato que dispara um e-mail para mim com as solicitações dos visitantes da minha página.
O projeto foi uma inspiração do canal no YouTube do Codehal.
Disponível em: https://www.youtube.com/@codehal.
Vídeo do YouTube: https://www.youtube.com/watch?v=sQoiM7i5Nqc&t=2s.
Relógio Digital em HTML, CSS e Javascript
Página simples na web para um relógio digital feito com HTML, CSS e javascript para a lógica de transição e simulação do tempo, fidelizando um comportamento inerente de todo relógio que é mostrar as horas, minutos e segundos e, como um extra, ainda incorporei a função calendário, apontando o dia, o mês e o ano em que o visitante da página acessou-a.
O projeto foi uma inspiração do canal no YouTube da Larissa Kich.
Disponível em: https://www.youtube.com/@larissakich.
Vídeo do YouTube: https://www.youtube.com/watch?v=GK0ok3ZCXwM.
Calculadora de Idade em HTML, CSS e Javascript
Sistema web para calcular a sua idade, informe a sua data de nascimento no campo de entrada e clique em calcular e, em poucos segundos, o aplicativo revelará a sua idade. O aplicativo web funciona com javascript para o cálculo da idade, com base na data de nascimento do usuário informada pela input do tipo date em HTML e em javascript a data é processada e comparada com a data atual e feito o cálculo entre o ano data atual (ex.:2025) e o ano da data informada pelo usuário (ex.:1970), e, com isso, a função em javascript CalcularIdade(date AnoFromDataUser) irá calcular e retornar um número inteiro que, portanto, será a diferença entre o ano da data atual (extraído da data atual = new Date()) e o ano passado pela data de nascimento do usuário (new Date(DataUser).getYearFull()). Foi criador um validador para saber se a data é válida ou não, sendo o critério se a data informada ser superior ao ano atual.
O projeto foi uma inspiração do canal no YouTube do GreatStack.
Disponível em: https://www.youtube.com/@GreatStackDev.
Vídeo do YouTube (How To Build Age Calculator App Using HTML CSS And JavaScript): https://www.youtube.com/watch?v=_pw8vk1tAhs&t=1289s
→
→
→
→
Projetos
Explore meus projetos de desenvolvimento web e habilidades.
Portfólio Roxo e Branco
Site pessoal com portfólio e informações de contato. Website criado a partir de tecnologias web como HTML, CSS e javascript para a estrutura dos componentes e seções home, about-me, education, experience, skills e contact-me e interação dos elementos que compõe a página com os cliques dos usuários que a visitarem. Efeitos visual, criados em javascript, como transições de efeito sutis da barra de navegação ao movê-la para baixo e ao se deslocar entre as seções do portfólio web. Com um formulário de contato que dispara um e-mail para mim com as solicitações dos visitantes da minha página.
O projeto foi uma inspiração do canal no YouTube do Codehal.
Disponível em: https://www.youtube.com/@codehal.
Vídeo do YouTube: https://www.youtube.com/watch?v=h5I8LB4N5UA&t=1s.
Portfólio React SASS
Site pessoal com portfólio e informações de contato. Website criado a partir de tecnologias web como React e SASS. Portfólio pessoal para expor meus trabalhos em desenvolvimento web, minhas habilidades, meus canais de contato, meu perfil no GitHub e principalmente os meus projetos.
O projeto foi uma inspiração do canal no YouTube do Matheus Battisti - Hora de Codar.
Disponível em: https://www.youtube.com/@MatheusBattisti.
Vídeo do YouTube: https://www.youtube.com/watch?v=5h4vMtBlQQU.
Aplicativo ToDo-List em HTML, CSS e Javascript
Sistema de gerenciamento de tarefas simples criado a partir de tecnologias web HTML, CSS e javascript para o usuário cadastrar suas tarefas diárias e, à medida que for executando-as, concluí-las e deletando as que já foram cumpridas. Aplicação feita com a lógica de programação em javascript para armazenar valores do campo de entrada em um Array e, em cima desse Array, realizar uma série de manipulações em Arrays (como adição - array.push(), remoção Array.splice(0,0,0)) e técnicas sofisticadas de armazenamento de dados no navegador cliente de modo temporária via viés da tecnologia localStorage, que permite armazenar dados em formato JSON na memória do navegador (cookies) de internet. E, para conclusão de tarefas, classes em CSS e manipuladores de DOM em javascript para alterar entre um classe simples e uma classe concluded.
O projeto foi uma inspiração do canal no YouTube do GreatStack.
Disponível em: https://www.youtube.com/@GreatStackDev.
Vídeo do YouTube: https://www.youtube.com/watch?v=G0jO8kUrg-I.
Protótipo de carrinho de compras de uma loja online em HTML, CSS e Javascript
Sistema web para simular um carrinho de compras para uma possível implementação em uma loja online. O aplicativo web funciona com javascript para adicionar, remover e quantificar produtos no carrinho, com base na seleção de produtos disponíveis, o usuário informa qual produto deseja adicionar ao carrinho e por intermédio de um Array ou lista em javascript é incrementado ao Array o item selecionado, e, com isso, a função em javascript AdicionarProduto() irá chamar o Array list (inicializado vazio) e adicionará a ele um novo item, retornando uma lista de itens.E uma função RemoverProduto(), que irá chamar o Array list e removerá um item previamente selecionado pelo usuário. E criada a função QuantidadeItem(), que retornará a quantidade do item selecionado no carrinho - Array list (operações de incremento e decremento foram muito utilizadas para manipular os dados no Array list).
O projeto foi uma inspiração do canal no YouTube do Code With Mete.
Disponível em: https://www.youtube.com/@codeWithMete
Vídeo do YouTube: https://www.youtube.com/watch?v=e6NYBQ6NU74&t=1924s.
→
→
→
→
Projetos
Explore meus projetos de desenvolvimento web.
GitHub
Meus projetos acadêmicos - google Drive
Meus projetos acadêmicos - google Drive
Créditos para a construção desses projetos:
Canais do YouTube:
Larissa Kich - https://www.youtube.com/@larissakich.
Code With Mete - https://www.youtube.com/@codeWithMete