React Básico: Fundamentos do Desenvolvimento de Interfaces
- Nível: Junior
- Módulos: 7
- Aulas: 16
- Tempo de leitura: 7h 25min
- Tecnologias: React
- Preço: Gratuito
Código do curso: github.com/johnpires/react-junior-projeto-final
React é a biblioteca JavaScript mais popular para construção de interfaces de usuário, mantida pelo Meta (Facebook) e amplamente adotada por empresas de todos os portes ao redor do mundo. Este curso foi desenvolvido para quem possui conhecimento básico de JavaScript e deseja ingressar no desenvolvimento frontend moderno com React. Você aprenderá os fundamentos da biblioteca desde o primeiro dia, construindo uma base sólida para projetos reais.
Ao longo do curso, você explorará o modelo de componentes do React, entenderá como o JSX funciona, aprenderá a gerenciar estado com o hook useState, lidar com efeitos colaterais com useEffect e criar interfaces dinâmicas que respondem às interações do usuário. Todo o conteúdo é apresentado de forma prática, com exemplos reais e progressivos que simulam situações do cotidiano do desenvolvimento frontend.
Este curso é ideal para desenvolvedores que já conhecem HTML, CSS e os fundamentos de JavaScript e querem dar o próximo passo na carreira. Ao finalizar o curso, você terá capacidade de criar aplicações React completas, entender o fluxo de dados entre componentes e estar preparado para avançar para tópicos mais complexos como React Router, Context API e gerenciamento de estado global.
O que você vai aprender
Ao final deste curso, você será capaz de:
- Criar e organizar componentes funcionais em React
- Utilizar JSX para descrever a estrutura visual das interfaces
- Gerenciar estado local de componentes com o hook useState
- Executar efeitos colaterais e buscar dados de APIs com useEffect
- Passar dados e funções entre componentes usando props
- Renderizar listas dinâmicas com map e controlar exibição condicional
- Lidar com formulários controlados e eventos do usuário
- Estruturar um projeto React com Vite de forma organizada
Pré-requisitos
Para aproveitar este curso, você precisa ter conhecimento básico de JavaScript (variáveis, funções, arrays, objetos e arrow functions), além de noções de HTML e CSS. Conhecimento de TypeScript é útil, mas não obrigatório. Não é necessária experiência prévia com React ou qualquer outro framework frontend.
Conteúdo do curso
Módulo 1: Introdução ao React
Entenda o que é React, como ele surgiu e por que ele é tão popular. Configure seu ambiente de desenvolvimento com Vite.
- O que é React e por que aprender (20 min)
- Configurando o ambiente com Vite (25 min)
- JSX: Escrevendo HTML dentro do JavaScript (25 min)
Módulo 2: Componentes React
Aprenda a criar, organizar e reutilizar componentes funcionais no React.
- Componentes funcionais (30 min)
- Props: Passando dados para componentes (30 min)
- Eventos no React (25 min)
Módulo 3: Estado com useState
Domine o hook useState para criar componentes dinâmicos que respondem às interações do usuário.
- Introdução ao useState (30 min)
- Listas e renderização condicional (30 min)
- Formulários controlados (30 min)
Módulo 4: Efeitos com useEffect
Aprenda a realizar operações como busca de dados e integração com APIs usando o hook useEffect.
- Introdução ao useEffect (30 min)
- Buscando dados com parâmetros (25 min)
Módulo 5: Comunicação entre Componentes
Aprenda padrões para passar dados e funções entre componentes pai e filho.
- Lifting state up (30 min)
Módulo 6: Estilização de Componentes
Explore as diferentes formas de estilizar componentes React: CSS modules, inline styles e bibliotecas.
- CSS Modules e estilos inline (25 min)
Módulo 7: Projeto Final: Lista de Tarefas Interativa
Aplique todos os conceitos do curso construindo uma aplicação completa de gerenciamento de tarefas com React.
- Planejamento e estrutura do projeto (20 min)
- Implementando os componentes principais (40 min)
- Finalizando com estilos e melhorias (30 min)