Introdução e Conceitos básicos
  • Olá mundo!
  • Elementos React com JSX
  • Primeiro Projeto
  • Recomendações
  • Editor de códigos
  • Extensões
  • Primeiros passos
  • Componentes React
  • Arrow functions
  • Funções JavaScript
  • Explicação detalhada do estado - parte 1
  • Explicação detalhada do estado - parte 2
  • Explicação detalhada do estado - parte 3
  • Usando o Estado no projeto
  • Propriedades (props)
  • Array de elementos
  • React Developer Tools
  • Fluxo de dados unidirecional
  • Renderização
  • Novos botões
  • Operadores
  • Limpar e deletar
  • Componente controlado e não controlado
  • Tratando o estado através de um evento
  • Eventos
  • Estado de erro
  • Efeito colateral - sideEffect()
  • React Hooks
  • Regras dos Hooks
  • Teclas avançadas
  • Concorrência
  • Histórico
  • Exibição do histórico
  • Limpar tudo
  • Voltar no histórico
  • Barra de rolagem
  • Conclusão do projeto
Exercícios e testes - Conceitos básicos
  • Teste prático 1 - Olá mundo!
  • Resolução teste prático 1
  • Teste prático 2 - Contador
  • Resolução teste prático 2
  • Teste prático 3 - Título da página
  • Resolução teste prático 3
  • Teste teórico - Conceitos básico
Fundamentos
  • Fundamentos - Introdução
  • Processo de desenvolvimento
  • Primeira entrega, protótipo
  • Node.js
  • Instalação passo a passo
  • Criando o projeto
  • Storybook
  • Formatadores
  • Hero
  • Composição de componentes
  • Mudando a fonte
  • Styled Components
  • Imagens
  • Estilos globais
  • Margens
  • Media Queries
  • Testando em diferentes tamanhos de telas
  • Tipagem com PropTypes
  • Adicionando a cor padrão
  • Compound Components
  • Construção de títulos
  • Componente Heading
  • Documentação do Heading
  • Organização da documentação
  • Storybook groups
  • Storybook Knobs
  • Diretório de estilos
  • Ajuste no Storybook para o MDX
  • Storybook com MDX
  • Tipografia
  • Criando um teste de unidade
  • Teste da imagem do Hero
  • Test Coverage
  • Snapshot Testing
  • Testando arquivos de estilos
  • Revisão
  • GitHub
  • React Helmet
  • Atualização das dependências
  • Criando um botão personalizado
  • Usando um tema
  • Definindo o tema globalmente
  • Melhor definição das cores
  • Repassando as cores para o componente
  • Definindo o comportamento do componente
  • Variante Outlined
  • Variante Link
  • Test Provider
  • Testando o evento de click
  • Testando as diferentes propriedades
  • Revisão
  • Diferentes temas
  • Ajuste na cor do texto