Formações Front-end CSS avançado: implementando designs com Grid, Flexbox e Sass

Formação CSS avançado: implementando designs com Grid, Flexbox e Sass

Domine o CSS avançado e crie designs que se destacam, com menos código e mais eficiência

* Esta formação faz parte dos nossos cursos de Front-end

Quero Estudar na Alura

52h

Para conclusão

Cursos

Vídeo extra

Artigos

CSS: cursos para transformar designs com Grid, Flexbox e Sass

Se você já conhece HTML e acha que seu CSS tá no ponto, é hora de dar aquele próximo passo e mergulhar fundo no universo do CSS avançado. A gente sabe que criar layouts bonitos e funcionais é uma das maiores alegrias de trabalhar com frontend, mas aplicar o CSS de maneira avançada te permite criar layouts complexos e adaptáveis. E o melhor de tudo: você vai perceber que não precisa de toneladas de código pra fazer isso, só precisa conhecer e saber usar as ferramentas certas.

Nessa formação, a gente vai te mostrar como o CSS pode ir muito além de uma simples lista de regras, se transformando em uma verdadeira linguagem para expressar suas ideias. Vamos começar explorando o poder do Grid e do Flexbox, que vão te dar uma flexibilidade incrível para criar layouts responsivos e sofisticados. Depois, vamos nos aprofundar nos seletores complexos e aninhados, além de boas práticas que vão te ajudar a estilizar exatamente o que você precisa de forma precisa e eficiente.

E, pra fechar com chave de ouro, vamos mergulhar no Sass, uma ferramenta que vai revolucionar a forma como você escreve e organiza seu CSS, economizando tempo e facilitando a manutenção dos seus estilos.

Então, se você quer levar seu conhecimento de CSS pra um novo nível e fazer seus projetos brilharem de verdade, essa formação é pra você. Vem com a gente e vamos transformar o jeito que você escreve CSS!

Por que estudar esta formação?

Guia de aprendizado
Conteúdos pensados para facilitar seu estudo
Do básico ao avançado
Formação completa para o mercado
Você dentro do mercado
Do zero ao sonhado emprego em sua área de interesse

Comece essa formação agora mesmo e capacite-se para seu próximo projeto!

Conheça os planos

Com quem você vai aprender?

Mônica Mazzochi Hillman
Bacharela em Tecnologias Digitais, especialista em User Experience e pós graduanda em Docência e Performance na Educação a Distância com experiência em suporte técnico de T.I e com tecnologias front-end. Atualmente é Tech Community Manager na Magalu Cloud e instrutora na Alura. Nas horas vagas gosta de assistir animes e produções da marvel, ouvir kpop e post-hardcore, jogar Valorant e TFT.
Mônica Mazzochi Hillman
Bacharela em Tecnologias Digitais, especialista em User Experience e pós graduanda em Docência e Performance na Educação a Distância com experiência em suporte técnico de T.I e com tecnologias front-end. Atualmente é Tech Community Manager na Magalu Cloud e instrutora na Alura. Nas horas vagas gosta de assistir animes e produções da marvel, ouvir kpop e post-hardcore, jogar Valorant e TFT.
Neilton Seguins
Sou graduado como Bacharel em Ciência e Tecnologia e em Engenharia Mecânica. Atuo como Instrutor de Desenvolvedor de Software na Alura e possuo experiência com desenvolvimento usando JavaScript/TypeScript, React js, Next js e Node.js. Amo compartilhar conhecimento, pois acredito que a educação é transformadora e quero mudar a vida de pessoas através da educação assim como consegui mudar de vida. Também amo ouvir e tocar música, ler livros e mangás e assistir séries.
Neilton Seguins
Sou graduado como Bacharel em Ciência e Tecnologia e em Engenharia Mecânica. Atuo como Instrutor de Desenvolvedor de Software na Alura e possuo experiência com desenvolvimento usando JavaScript/TypeScript, React js, Next js e Node.js. Amo compartilhar conhecimento, pois acredito que a educação é transformadora e quero mudar a vida de pessoas através da educação assim como consegui mudar de vida. Também amo ouvir e tocar música, ler livros e mangás e assistir séries.
Nayanne Batista
Nayanne (Nay) é uma paraibana arretada que fez transição de carreira para a TI depois de concluir um doutorado na área da saúde e ser professora no ensino superior. Graduada em Análise e Desenvolvimento de Sistemas, já atuou como Dev Frontend em projetos e hoje é Instrutora na Alura. Acredita completamente no poder transformador da educação e da tecnologia na vida das pessoas. Ama livros e café! :)
Nayanne Batista
Nayanne (Nay) é uma paraibana arretada que fez transição de carreira para a TI depois de concluir um doutorado na área da saúde e ser professora no ensino superior. Graduada em Análise e Desenvolvimento de Sistemas, já atuou como Dev Frontend em projetos e hoje é Instrutora na Alura. Acredita completamente no poder transformador da educação e da tecnologia na vida das pessoas. Ama livros e café! :)
RODRIGO SILVA HARDER
Sou estudante de pós-graduação na área de Frontend Engineering na FIAP e monitor na escola de Frontend e Mobile da Alura. Minhas maiores paixões são React e Next.JS, mas adoro me aventurar em outros frameworks e tecnologias do Front-end e de outras áreas para conseguir cada vez mais expandir meus conhecimentos e continuar aprendendo.
RODRIGO SILVA HARDER
Sou estudante de pós-graduação na área de Frontend Engineering na FIAP e monitor na escola de Frontend e Mobile da Alura. Minhas maiores paixões são React e Next.JS, mas adoro me aventurar em outros frameworks e tecnologias do Front-end e de outras áreas para conseguir cada vez mais expandir meus conhecimentos e continuar aprendendo.

Passo a passo

1 Dominando layout com flexbox e grid
Nesse primeiro passo vamos mergulhar nas técnicas avançadas de layout, onde você vai dominar flexbox e grid. Saber isso vai te deixar preparado para resolver desafios de layouts que se ajustam de acordo com a quantidade de elementos e tamanho da tela - ferramentas essenciais para qualquer pessoa front-end.
- Artigo CSS: o que é, como usar no HTML e um Guia para iniciar | Alura
- Curso CSS: construindo layouts responsivos com grid
  08h
- Curso CSS: posicionando elementos com Flexbox
  08h
- Site CSS: Estado Moderno – Hipsters Ponto Tech #427 - Hipsters Ponto TechHipsters Ponto Tech
- Artigo CSS, SASS e SCSS: escolhendo a ferramenta para estilizar sua aplicação web | Alura
- Curso Praticando CSS Flexbox
  06h
2 Utilizando seletores, variáveis, media queries
Nesse próximo passo, vamos nos aprofundar em seletores e variáveis, te dando o controle total sobre como e quando aplicar estilos de maneira precisa e dinâmica. Além disso, você vai dominar o uso de media queries para garantir que seus layouts sejam perfeitamente responsivos em qualquer dispositivo. E, também vamos explorar o CSS Houdini, uma ferramenta inovadora que permite criar efeitos e animações personalizadas diretamente no CSS, expandindo ainda mais o que é possível fazer no front-end.
- Curso CSS: explorando seletores e utilizando variáveis
  10h
- Curso CSS: aplique responsividade usando media queries
  08h
- Artigo Houdini CSS: um jeito mágico de criar estilos personalizados | Alura
- Artigo Container queries: responsividade além das media queries | Alura
3 Implementando animações, SASS e integração com Vite
Nesse passo você vai as animações com CSS, aprendendo a criar transições suaves e interações que dão vida aos seus designs. Além disso, vamos mergulhar no uso de SASS, começando pela integração com Vite, uma ferramenta moderna que vai otimizar seu fluxo de trabalho. Por fim, exploraremos como o SASS se encaixa no universo dos frameworks, permitindo que você escreva código mais organizado e eficiente, facilitando a manutenção e escalabilidade dos seus projetos.
- Artigo Como criar animações incríveis com CSS | Alura
- Curso SASS com Vite: otimizando e modularizando seu CSS
  08h
- Artigo SASS e Frameworks: estilize seu projeto front-end | Alura
- Vídeo Transição de carreira e dicas para começar no front-end - YouTube