O Zingen é uma landing page de alta performance desenvolvida para apresentar um aplicativo de Karaokê baseado em Inteligência Artificial. O foco principal do desenvolvimento foi a aplicação de conceitos avançados de CSS Modular, garantindo que a manutenção do código seja escalável e organizada através de múltiplos arquivos importados.
- Arquitetura CSS: Uso de @import para separar responsabilidades (buttons, cards, layout, etc).
- SEO & Social: Implementação completa de Meta Tags Open Graph e Twitter Cards para previews otimizados.
- Responsividade: Design Mobile-First com transições suaves para Desktop via Media Queries.
- Performance: Uso de preconnect para recursos externos e carregamento otimizado de fontes.
Para clonar e executar esta aplicação, você precisará do Git instalado em seu computador. No seu terminal:
[git clone https://](https://github.com/VictorMartinsD/zingen)github.com/VictorMartinsD/zingen.gitcd zingenDesenvolvido por Victor Martins como parte do programa de formação Rocketseat.
See images in the section above.
Zingen is a high-performance landing page developed to showcase an AI-powered Karaoke application. The main focus of development was the application of advanced Modular CSS concepts, ensuring that code maintenance is scalable and organized through multiple imported files.
- CSS Architecture: Use of @import to separate responsibilities (buttons, cards, layout, etc).
- SEO & Social: Full implementation of Open Graph Meta Tags and Twitter Cards for optimized previews.
- Responsiveness: Mobile-First design with smooth transitions to Desktop via Media Queries.
- Performance: Use of preconnect for external resources and optimized font loading.
To clone and run this application, you will need Git installed on your computer. In your terminal:
git clone https://github.com/VictorMartinsD/zingen.gitcd zingenDeveloped by Victor Martins as part of the Rocketseat training program.