Esse é o projeto final do módulo 1 do Curso Vai Na Web. O objetivo era criar, a partir de um arquivo do Figma, uma página inicial da L'Oréal Paris para desktop e para mobile.
As especificações do projeto foram:
- Uso de HTML Semântico;
- SCSS organizado;
- Nomenclatura Coerente;
- Design Responsivo.
O principal objetivo do projeto foi aplicar todo o conteúdo aprendido no módulo 1, que englobou HTML e SASS, respectivamente focando em marcação e estilização.
Alguns dos tópicos aplicados foram:
- Boas práticas de SEO (como a tag
meta description
); - Boas práticas de acessibilidade;
- Escrita compatível com a semântica da linguagem;
- O uso de links externos, como o do
.css
, Google Fonts, etc.)
- Reset (
*
); - Flexbox;
- Box Model;
- Position;
- Uso da função
clamp()
; - Nesting;
- Media queries;
- Medidas relativas;
- Pseudo-classes;
- Tipografia;
- O conceito de "Everything in CSS is a box 📦".
- Iniciar e criar repósitorios locais e remotos;
- Fazer commits de alterações;
- Enviar alterações para o repositório remoto com push;
- Criar e atualizar o arquivo README.md.
-
ChatGPT
- O conceito de Mobile First é mais fácil de implementar do que parece;
- Use bordas para visualizar melhor a estrutura CSS/SCSS;
- Se você ainda está se familiarizando com Media Queries, pode começar criando arquivos diferentes para cada dispositivo e depois mesclar;
- Tudo bem errar, tudo bem dar um tempo, mas nunca desista!;
- Dica de ouro: Leia sempre!! É tudo linguagem, e você precisa ler e entender!