React

Programa curricular

Compactar tudo 5 aulas 28h

• Unidade 01 - Introdução ao React
• • React | Unidade 1 - Entenda sua trilha
  • Introdução e Objetivos de Aprendizagem
  • React | Unidade 1 - Primeiros Passos
  • 1.) O que é React?
  • React | Unidade 1 - Pílula do Conhecimento 1: NPM, node e CRA.
  • 2) Características do React
  • 2.1) Declarativo
  • 2.2) Componentes reativos e reutilização
  • 2.3) Tipos de componentes React
  • React | Unidade 1 - Pílula do Conhecimento 2: Criação de componentes.
  • React | Unidade 1 - Pílula do Conhecimento 3: Controle de estados com React
  • 2.3.1) Class components
  • 2.3.2) Function components (componentes funcionais)
  • 2.3.3) Componentes de Classe VS Componentes Funcionais
  • 2.4) One-way data flow (fluxo de dados unidirecional)
  • React | Unidade 1 - Pílula do Conhecimento 4: One-way data flow (fluxo de dados unidirecional)
  • 2.5) Learn Once, Write Anywhere
  • 2.6) Manipulação performática do DOM (Virtual DOM)
  • 2.7) Single Page Application (SPA)
  • React | Unidade 1 - Pílula do Conhecimento 5: Rotas - Para que servem e como funcionam?
  • 3) Configuração do ambiente para programar em React
  • React | Unidade 1 - Pílula do Conhecimento 6: Testes - Como funcionam na prática e vantagens
  • 3.1) O que preciso instalar?
  • React | Unidade 1 - Masterclass 1
  • Síntese
  • React | Unidade 1 - Dicas Masterclass
  • E-book - Resumo da unidade | React - Unidade 1
  • React | Unidade 1 - Exercício extra
• Unidade 02 - Estilização em React
• • Introdução e Objetivos de Aprendizagem
  • React | Unidade 2 - Primeiros passos
  • 1) Pré-processadores
  • React | Unidade 2 - Pílula do conhecimento 1: CSS - modules
  • 1.1) Instalação do pré-processador em um projeto React
  • React | Unidade 2 - Pílula do conhecimento 2: IEstruturação do projeto
  • 1.2) Conceitos
  • React | Unidade 4 - Pílula do conhecimento 3: CSS-Modules - Por que utilizar e como usar?
  • 1.2.1) Variáveis
  • 1.2.2) Agrupamento (nesting)
  • 1.2.3) Módulos e partials
  • 1.2.4) Mixing
  • 1.2.5) Herança (extend)
  • 1.2.6) Operadores
  • 2) CSS-in-JS
  • React | Unidade 2 - Pílula do conhecimento 4: Pré processadores e SASS
  • 2.1) Instalação
  • React | Unidade 2 - Pílula do conhecimento 5: Styled components
  • 2.2) Conceitos
  • React | Unidade 2 - Pílula do conhecimento 6: Responsividade
  • 2.2.1) Template Literals
  • 2.2.2) Adaptação por props
  • 2.2.3) Herança
  • 2.3) Estilizando componentes
  • React | Unidade 2 - Masterclass 1
  • Síntese
  • React | Unidade 2 - Dicas Masterclass
  • React | E-book - resumo da unidade 2
  • React | Unidade 3 - Exercícios extras
• Unidade 03 - Componentes de React
• • Introdução e Objetivos de Aprendizagem
  • React | Unidade 3 - Primeiros passos
  • 1) Conceitos básicos de React
  • 1.1) Organização de pastas em React
  • 1.2) Componente
  • React | Unidade 3 - Pílula do conhecimento 1: Criação de um component em React
  • React | Unidade 3 - Pílula do conhecimento 2: Package.json
  • 1.2.1) Importação e exportação de componentes
  • React | Unidade 3 - Pílula do conhecimento 3: Components 2
  • 1.2.2) Fragments <>
  • 1.3) JSX (JavaScript XML)
  • 1.4) Props
  • 1.4.1) Prop drilling e Composition
  • React | Unidade 3 - Pílula do conhecimento 4: NPM
  • 1.5) State
  • 1.5.1) Lifting state up
  • 2). React Hooks
  • React | Unidade 3 - Pílula do conhecimento 5: Aprimorando o conhecimento
  • 2.1) useState
  • 2.2) useEffect
  • 2.3) useRef
  • 2.4) useContext
  • 2.5) useMemo
  • 2.6 useCallback
  • 2.7) useReducer
  • 2.8) Hooks customizados (custom Hook)
  • React | Unidade 3 - Pílula do conhecimento 6: Material UI
  • React | Unidade 3 - Masterclass 1
  • Síntese
  • React | Unidade 3 - Dicas Masterclass
  • React | E-book - Resumo da unidade 3
  • React | Exercícios extras - Unidade 3
• Unidade 04 - Roteamento, Redux e Integração
• • Introdução e Objetivos de Aprendizagem
  • React | Unidade 4 - Primeiros passos
  • 1) Roteamento
  • React | Unidade 4 - Pílula do conhecimento 1: Conceitos de Flux e Redux
  • 1.2) Instalação
  • 1.3) Conceitos essenciais
  • 1.4) Exemplo de utilização
  • React | Unidade 4 - Pílula do conhecimento 2: Redux
  • 2.2) Instalação
  • React | Unidade 4 - Pílula do conhecimento 3: Actions de redux
  • 2.3) Exemplo de Utilização
  • React | Unidade 4 - Pílula do conhecimento 4: Projeto Counter
  • 3) Integração com Back-end
  • React | Unidade 4 - Pílula do conhecimento 5: Rest
  • 3.1) Axios
  • 3.2) Instalando e Configurando o Axios
  • 3.3) Exemplo de Utilização
  • React | Unidade 4 - Pílula do conhecimento 6: JSON placeholder
  • React | Unidade 4 - Masterclass 1
  • Síntese
  • React | Unidade 4 - Dicas masterclass
  • React | E-book - Resumo da unidade 4
  • React | Unidade 4 - Exercícios extra
• Fim da Jornada
• • React | Fim da jornada - Masterclass 1
  • React | Fim da jornada - Masterclass 2
  • React | Fim da jornada - Vídeo de apoio ao projeto final
  • React | Fim da jornada - Instruções para o projeto
  • Projeto React

Avaliações

• Joâo Otávio Grajeda Aichinger

• Igor Pontes

• Felipe Vieira De Souza