Este projeto foi desenvolvido como parte de um desafio para replicar com fidelidade um layout disponibilizado no Figma, utilizando HTML, CSS e JavaScript puro (sem bibliotecas ou frameworks).
O foco principal foi adotar uma abordagem mobile-first, garantindo uma experiência fluida e responsiva em diferentes tamanhos de tela.
Reproduzir o layout proposto no Figma e implementar funcionalidades interativas usando apenas tecnologias nativas da web.
🔗 Layout no Figma:
Visualizar o layout original
🔗 Projeto no ar:
Acesse aqui o site publicado
- Estruturação completa do layout com HTML semântico
- Estilização com CSS puro e abordagem mobile-first
- Layout totalmente responsivo (mobile, tablet e desktop)
- Campo de busca funcional com JavaScript:
- Ao clicar no botão de busca, aparece:
Você buscou por: 'assunto buscado'
- Ao clicar no botão de busca, aparece:
- Carrosséis interativos com JavaScript
- HTML5
- CSS3
- JavaScript (Vanilla JS)
- Biblioteca Swiper API
💡 Nenhum framework CSS ou JS foi utilizado.
- Prática com desenvolvimento responsivo mobile-first
- Manipulação do DOM e eventos com JavaScript puro
- Controle de layout dinâmico via JavaScript conforme o
resize - Organização de estrutura de arquivos e código limpo
