O que você aprenderá_

Diferencie a estilização global da local em aplicações React.
Utilize CSS Modules para evitar conflitos de estilos.
Empregue a metodologia Utility-first com Tailwind CSS.
Organize e componha componentes React visando a reutilização e formatação adequada dos dados.

Público alvo_

Este curso é direcionado para profissionais e estudantes de tecnologia que desejam aprofundar seus conhecimentos em estilização de interfaces em React. Ao final do curso, será possível aplicar técnicas avançadas que garantem consistência visual, segurança de escopo e eficiência no desenvolvimento, integrando métodos modernos e ferramentas de design para aprimorar a experiência do usuário.

Vinicios Neves

Vinicios Neves, Tech Lead e Educador, mistura código e didática há mais de uma década. Especialista em TypeScript, lidera equipes full-stack em Portugal e inspira futuros desenvolvedores na FIAP e Alura. Com um pé no código e outro no ensino, ele prova que a verdadeira engenharia de software vai além das linhas de código. Além de, claro, ser senior em falar que depende.

Curso atualizado em 08/09/2025

Já estuda na Alura?

Comece o curso agora

Ementa

Conhecendo estilos CSS no React
- Estlizando apps React
Utilizando o CSS Modules
- Entendendo o CSS Modules
- Iniciando o projeto
- Inserindo variáveis de cores, logo e limpeza do projeto
- Importando a fonte
- Criando o container principal
- Construindo a barra lateral
- Implementando o input de texto e Main
- Desenvolvendo o componente de tipografia
- Estruturando card, card.header e card.body
- Estilizando card header e body
- Configurando o componente DailyBudget
Utilizando o Tailwind
- Entendendo o Tailwind CSS
- Iniciando o projeto
- Inserindo variáveis de cores, logo e limpeza do projeto
- Criando a barra lateral
- Importando a fonte
- Criando o container principal
- Implementando input de texto e Main
- Desenvolvendo componente para tipografia
- Estruturando o card, card.header e card.body
- Estilizando o componente de orçamento diário
- Implementando barra de progresso
- Montando o Grid para os cards

Descubra se esse curso é pra você! Leia as primeiras aulas

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

Conheça os planos

Escola

Front-end

Desenvolva experiências web incríveis com HTML, CSS e JavaScript, além de se aprofundar nos principais frameworks do mercado, como React, Angular e Vue.JS. Domine JavaScript a fundo, para não depender de copiar e colar.

Conheça a escola

Cursos relacionados em React

curso

React

técnicas avançadas de otimização e desempenho

Front-end

curso

React

utilizando GraphQL para integração de dados

Front-end

curso

React:

O que você aprenderá_