[author] curso react + redux: fundamentos e 2 apps do absoluto zero!

• Criar componentes em React

• Desenvolver uma aplicação do zero com React/Redux

• Aplicar boas práticas de desenvolvimento

• Desenvolver uma aplicação full-stack em Javascript

• Integrar o Redux em uma aplicação React

• Configurar uma aplicação com Webpack

• Áudio e Vídeo em Alta Definição

  439 aulas e 54 horas de conteúdo. Didática comprovada. Investimento garantido.

• Certificado de Conclusão

  Ao final você receberá certificado com a carga horária apropriada para conclusão

• Suporte Dedicado

  Conte com um time de especialistas e tire todas as suas dúvidas relativas ao curso

• Sem prazo de expiração

  Assista o curso no seu tempo, sem pressa, sem nenhum prazo para expirar.

• Recursos para download

  Baixe arquivos e artigos para melhor desenvolvimento do curso

• Acesso Mobile

  Acesse por qualquer dispositivo: Computador, celular e Ipad

5 classificação por estrelas

Excelente

Ótimo curso, conteúdo passado de forma fácil e muito prática.

Ótimo curso, conteúdo passado de forma fácil e muito prática.

Ler menos

5 classificação por estrelas

Curso detalhado e atualizado constantemente. Muito Bom!

Fernando Tozetto

Esse curso é fantástico, consegui perceber ainda mais o seu valor quando apliquei os conhecimentos em projetos pessoais ao precisar rever alguns conceitos fi...

Ler mais

Esse curso é fantástico, consegui perceber ainda mais o seu valor quando apliquei os conhecimentos em projetos pessoais ao precisar rever alguns conceitos fica nítida a riqueza nos detalhes que o Leonardo passa nas aulas, já tenho vários cursos da Cod3r e recomento a todos que quiserem aprender!

Ler menos

5 classificação por estrelas

Perfeito

Luiz Campos

• 1

  • Visão Geral do Curso

    TESTE GRÁTIS

  • Repositório do Curso & Apostila

  • Usando o Terminal

  • Terminais

  • Aviso importante aos usuários de Windows

  • Configuração do Ambiente (Windows)

  • Configuração do Ambiente (Linux)

  • Configuração do Ambiente (MacOS)

• 2

  • Introdução do Módulo

  • Criando Projeto

  • Exibindo String na Tela

  • Conhecendo JSX

  • Carregando CSS

  • Primeiro Componente #01

  • Primeiro Componente #02

  • Componente com Propriedade

  • Propriedades são Somente Leitura

  • React Fragment

  • Componente App

  • Desafio Número Aleatório

  • Desafio Número Aleatório - Resposta

  • Componente Card #01

  • Componente Card #02

  • Componente Card #03

  • Componente com Filho #01

  • Componente com Filho #02

  • Repetição

  • Desafio Repetição

  • Desafio Repetição - Resposta

  • Renderização Condicional #01

  • Renderização Condicional #02

  • Renderização Condicional #03

  • Comunicação Direta

  • Comunicação Indireta

  • Componente com Estado

  • Componente Controlado

  • Contador #01

  • Contador #02

  • Desafio Megasena

  • Desafio Megasena - Resposta #01

  • Desafio Megasena - Resposta #02

  • Conclusão do Módulo

• 3

  • Criando Projeto

  • Componente Calculator

  • Componente Button #01

  • Componente Display

  • Componente Button #02

  • Implementando a Lógica #01

  • Implementando a Lógica #02

• 4

  • Introdução do Módulo

  • Criação do Projeto

  • Estrutura do projeto

  • Aplicando estilos

  • React Router Dom v6

  • Navegação simples

  • Navegação com parâmetro

  • Entendendo o parâmetro Exact

  • Página não encontrada

  • Conclusão do módulo

• 5

  • Introdução do Módulo

  • Configuração do Projeto

  • useState #01

  • useState #02

  • useEffect

  • Desafio useEffect

  • Desafio useEffect - Resposta

  • useRef #01

  • useRef #02

  • Desafio função Merge

  • useMemo

  • useCallback

  • Porque usar Context API

  • useContext #01

  • useContext #02

  • useReducer #01

  • Desafio useReducer

  • Desafio useReducer - Resposta

  • useReducer #02

  • Custom Hooks #01

  • Custom Hooks #02

  • Conclusão do módulo

• 6

  • Link do repositório

  • Configuração do Projeto

  • O que é Next.js?

  • Estrutura de Pastas

  • Primeiro Componente & Rotas

  • Entendendo o JSX

  • Integração JavaScript/JSX

  • CSS Global

  • CSS Modularizado

  • Usando Componente

  • Propriedades de Componentes

  • Navegação entre Componentes

  • Componente Layout

  • Componente Navegador

  • Navegação Simples

  • Navegação Dinâmica

  • Componente com Estado

  • Usando API #01

  • Usando API #02

  • Integração com API

  • Recomendação de Vídeo

  • Modelos de Pré-Renderização

  • Pré-Renderização na Prática

  • Introdução do projeto

  • Resultado Final

  • Nova instalação do Tailwind

  • Configuração: NextJS, TailwindCSS e Firebase

  • Componentes Layout e Título

  • Classe Cliente

  • Componente Tabela #01

  • Componente Tabela #02

  • Componente Tabela #03

  • Componente Botão

  • Componente Formulário

  • Alternando entre Tabela e Formulário

  • Integrando Tabela e Formulário

  • Configurando Firebase no Projeto

  • Repositório de Clientes

  • Integrando Cadastro com Firebase

  • Organizando Código com Hooks

  • Excluindo Projeto Firebase

• 7

  • Visão Geral

  • Configuração e Instalação

  • Configurando o Servidor com o Express

  • Conexão com o Banco de Dados

  • Avisos no terminal sobre MongoDB

  • ODM e Criação da API REST

  • Mapeamento das Rotas

  • Testando a API (Postman)

  • Habilitando o CORS

  • Iniciando o Backend com PM2

• 8

  • Configuração e Instalação

  • Configurando o Build com Webpack

  • Criação do index.html

  • Componente App

  • Componentes Todo e About

  • Componente Menu

  • Configurando as Rotas (React-Router)

  • Componente PageHeader

  • Componentes TodoForm e TodoList

  • Estratégia de Implementação

  • Estrutura do Formulário

  • Componentes Grid e IconButton

  • Renderização Condicional (If)

  • Evento Adicionar

  • Evento onChange

  • Evento Adicionar (Integração Backend)

  • Consulta e Exclusão de TODOs

  • Marcar como Concluído/Pendente

  • Pesquisa de TODOs

  • Melhorias de CSS e Limpar Formulário

  • Adicionar Teclas de Atalhos

• 9

  • Introdução do Módulo

  • Entendendo o Redux

  • Criando o Projeto

  • Iniciando a App

  • Componente Card

  • Componente Intervalo

  • Outros Componentes

  • Explicando o Funcionamento da App

  • Implementação SEM Redux

  • Limpando a Implementação

  • Configurando Redux

  • Conectando Componentes com Redux #01

  • Conectando Componentes com Redux #02

  • Invocando Action Creator #01

  • Invocando Action Creator #02

  • Invocando Action Creator #03

  • Refatorando Reducer

  • Constantes para os Tipos das Actions

  • Conclusão do Módulo

• 10

  • Instalando as Dependências

  • Configurando os Reducers

  • Configurando o Redux

  • Conectar o TodoList com Redux

  • Conectar o TodoForm com Redux

  • Action Creator changeDescription

  • Configurando o Redux Dev Tools

  • Action Creator de Pesquisa

  • Aplicando Middleware (Redux-Promise)

  • Adicionar TODO

  • Aplicando Middleware (Redux-Multi)

  • Aplicando Middleware (Redux-Thunk)

  • Marcar como Concluído/Pendente

  • Exclusão de TODOs

  • Limpar Formulário

  • Melhorando a Action de Pesquisa

• 11

  • Visão Geral

  • Configuração e Instalação

  • Configurando o Servidor com o Express

  • Conexão com o Banco de Dados

  • Mapeamento Objeto-Documento (ODM)

  • Criação da API REST

  • Correção: Método Get

  • Mapeamento das Rotas

  • Testando a API (Postman)

  • Obtendo a Qtde de Registros (Count)

  • Atualização Mongoose / Mongo 3.6

  • Obtendo o Sumário de Pagamentos

  • Tratando as Mensagens de Erro

  • Habilitando o CORS

  • Middleware Query Parser Int

• 12

  • Visão Geral

  • Comunicado IMPORTANTE sobre o AdminLTE

  • Configuração e Instalação

  • Configurando o Build com Webpack

  • Criação do index.html

  • Componentes Index e App

  • Dependências do Template (AdminLTE)

  • Componente Cabeçalho

  • Componente Menu (Parte 1)

  • Componente Menu (Parte 2)

  • Componente Rodapé

  • Navegação com React-router

  • Componente de Título do Conteúdo

  • Componente Dashboard: Visão Geral

  • Componente Grid

  • Componente ValueBox

  • Usando ValueBox

  • Configurando Redux

  • Integrando Dashboard com Redux (Parte 1)

  • Integrando Dashboard com Redux (Parte 2)

  • Ciclo React-Redux com Middlewares

  • Configurando Redux DevTools

  • Dashboard SEM Redux

  • Visão Geral dos Componentes de Abas

  • Componente BillingCycle: Refatorando para Classe

  • Componentes Estruturais das Abas

  • Componente TabHeader

  • Criando a Primeira Action e o Reducer

  • Componente TabHeader: Conectando com Redux

  • Componente Tab Content

  • Componente BillingCycle: Conectando com Redux

  • Visibilidade das Abas (Parte 1)

  • Visibilidade das Abas (Parte 2)

  • Componente de Lista: Visão Geral

  • Criando a Action "getList" e o Reducer

  • Componente BillingCycleList

  • Integrando BillingCycleList com Redux

  • Exibindo os dados em BillingCycleList

  • BillingCycleForm com Redux-Form (Parte 01)

  • BillingCycleForm com Redux-Form (Parte 02)

  • Exibindo as Mensagens de Sucesso e Erro

  • Melhorias na Inclusão do Ciclo de Pagamento

  • Field com Componente Personalizado

  • Exibir Aba de Alterar Ciclo de Pagamento

  • Inicializar Formulário com Dados

  • Função do Botão Cancelar

  • Alterar Ciclo de Pagamento

  • Excluir Ciclo de Pagamento

  • Finalizando o Cadastro Básico (Melhorias)

  • Componente CreditList Básico

  • Componente Input para CreditList

  • Evoluindo o Componente CreditList

  • Adicionar e Clonar Créditos

  • Remover Créditos

  • Generalizando o Componente CreditList

  • Adicionando o Campo Status no ItemList

  • Componente Summary

  • Integrar Soma de Créditos e Débitos

• 13

  • Problema de Responsividade do Menu

  • Navegação com React-router (Versão 2)

• 14

  • Correção package.json

  • Apostila do Curso (Versão BETA)

  • Autenticação - Backend (Parte 01)

  • Autenticação - Backend (Parte 02)

  • Autenticação - Backend (Parte 03)

  • Autenticação - Backend (Parte 04)

  • Solução: Problemas com Bcrypt

  • Autenticação - Backend (Parte 05)

  • Autenticação - Backend (Parte 06)

  • Autenticação - Backend (Parte 07)

  • Autenticação - Backend (Parte 08)

  • Autenticação - Backend (Parte 09)

• 15

  • Autenticação - Frontend (Parte 01)

  • Autenticação - Frontend (Parte 02)

  • Autenticação - Frontend (Parte 03)

  • Autenticação - Frontend (Parte 04)

  • Autenticação - Frontend (Parte 05)

  • Autenticação - Frontend (Parte 06)

• 17

  • Deploy Backend

  • Deploy do Backend #01

  • Deploy do Frontend #02

• 18

  • Mongo - Visão Geral

  • Mongo - Exercício 01: Comandos Básicos

  • Mongo - Exercício 02: Inserções

  • Mongo - Exercício 03: Consultas

  • Mongo - Exercício 04: Agregação

  • Mongo - Exercício 05: Atualização

  • Mongo - Exercício 06: Contador e Remoções

• 19

  • Node - Exercício 01: Javascript Básico

  • Node - Exercício 02: Sistema de Módulos

  • Node - Exercício 03: Singleton

  • Node - Exercício 04: Objeto Global

  • Node - Exercício 05: This

  • Node - Exercício 06: Módulo Externo (Lodash)

  • Node - Exercício 07: Passagem de Parâmetros

  • Node - Exercício 08: Process (ARGV)

  • Node - Exercício 09: Process (STDIN/STDOUT)

  • Node - Exercício 10: Módulo FS

  • Node - Exercício 11: Módulo HTTP

• 20

  • Express - Visão Geral

  • Express - Exercício 01: Configuração e Mapeando uma Rota

  • Express - Exercício 02: Cadeia de Middlewares

  • Express - Exercício 03: Método USE

  • Express - Exercício 04: Método Route

  • Express - Exercício 05: Express Router

  • Express - Exercício 06: Express e Router são Singletons?

• 22

  • Visão Geral do Webpack

  • Estrutura Básica do Projeto

  • Sistema de Módulos

  • Configurando a Pasta de Saída

  • Carregando Arquivo .CSS

  • Externalizando Arquivo .CSS

  • Corrigir problemas do módulo node-sass.

  • Carregando Arquivo .SCSS (SASS)

  • Desenvolvimento & Produção

  • Carregando Arquivos de Imagens

  • Adicionando WebServer

• 23

  • Criando Projeto

  • Primeiro Componente

  • Componente Com Parâmetro

  • Múltiplos Componentes

  • Componente de Classe #01

  • Componente de Classe #02

  • Componentes: Pai & Filho #01

  • Componentes: Pai & Filho #02

• 24

  • Implementando Backend (JSON Server)

  • Criando Projeto Frontend

  • Criando Componentes (Template)

  • Aplicando Estilo (CSS Grid)

  • Componente Logo

  • Componente Cabeçalho

  • Componente Rodapé

  • Componente Navegação

  • Componente Conteúdo

  • Componente Cadastro Usuário #01

  • Implementando Rotas (React Router)

  • Componente Cadastro Usuário #02

  • Componente Cadastro Usuário #03

  • Componente Cadastro Usuário #04

  • Adicionando Responsividade

• 25

  • Função: Cidadão de Primeira Classe

  • Função: Parâmetros e Retorno São Opcionais

  • Função: "this" pode Variar

  • Função: "this" e a Função bind #01

  • Função: "this" e a Função bind #02

  • Funções Arrow #01

  • Funções Arrow #02

  • Funções Arrow #03

  • Funções Anônimas

  • Funções Callback #01

  • Funções Callback #02

  • Funções Callback #03

  • Funções Construtoras

  • Array: Map #01

  • Array: Map #02

  • Array: Map #03

  • Array: Filter #01

  • Array: Filter #02

  • Array: Reduce #01

  • Array: Reduce #02

  • Array: Reduce #03

  • ESNext: Revisão #01

  • ESNext: Revisão #02

  • ESNext: Revisão #03

  • ESNext: Operador Rest/Spread

  • Promises

  • Usando Callbacks Aninhadas

  • Refatorando Callbacks p/ Promises

• 26

  • Flex Box vs CSS Grid

  • Flex Box Nomenclatura

  • Flex Box #01

  • Flex Box #02

  • Flex Box #03

  • CSS Grid #01

  • CSS Grid #02

  • CSS Grid #03

• 27

  • Visão Geral e Instalação

    TESTE GRÁTIS

  • Configuração Inicial

  • Criando o index.html

  • Testando a Configuração

  • Usando o Sistema de Módulos do CommonsJS

  • Importância da referência

  • Usando EcmaScript 2015 sem Babel

  • Usando o Sistema de Módulos do ES2015 (Babel)

  • Interpretando o Operador Spread (Plugin Babel)

  • Adicionando o Preset do React

  • Adicionando o Loader para CSS

• 28

  • Configurando o Projeto

  • Configurando o Build com Webpack

  • Criando o arquivo index.html

  • Primeiro Componente

  • Primeiro Componente (Arrow Function)

  • Usando as Propriedades do Componente

    TESTE GRÁTIS

  • Exportando mais de um Componente

  • Componentes Filhos

  • Componentes Filhos

  • Passando Propriedades para Componentes Filhos (Parte 1)

  • Passando Propriedades para Componentes Filhos (Parte 2)

  • Componente de Classe

  • Componente com Estado (Ex. Contador)

  • Componentes Controlados/Não Controlados

• 29

  • Introdução do Módulo

  • Código Disponível no Final do Módulo

  • Configuração do Projeto

  • Olá React

  • O que é JSX?

  • Componentes

  • Primeiro Componente

  • Primeiro Componente com Arrow Function

  • Usando props

  • Um Arquivo com Múltiplos Componentes

  • Retornar Múltiplos Elementos

  • Sistema de Módulos (Import/Export)

  • Relação entre Componentes #01

  • Relação entre Componentes #02

  • Comunicação Direta entre Componentes

  • Propagando "props" para Componentes Filhos #01

  • Propagando "props" para Componentes Filhos #02

  • Adicionando Função em um Componente Funcional

  • Comunicação Indireta entre Componentes

  • Componente de Classe

  • Componente Funcional tem Estado?

  • Componente de Classe Contador

  • Problema do "this"

  • Usando "state" em Componente de Classe

  • Conclusão do Módulo

  • React Hooks

  • Recursos do Módulo & Links Úteis

• 30

  • Palavras Iniciais e Instalação

  • Conhecendo o Redux

  • Configurando o Redux

  • Ex 01 - Integrando o React-Redux (Parte 1)

  • Ex 01 - Integrando o React-Redux (Parte 2)

  • Ex 01 - Integrando o React-Redux (Parte 3)

  • Ex 02 - Integrando o React-Redux (Parte 1)

  • Ex 02 - Integrando o React-Redux (Parte 2)

Leonardo Leitão

Leonardo Leitão é graduado em Engenharia Elétrica pela Universidade Federal do Ceará e Mestre em Informática Aplicada pela Universidade de Fortaleza. Há 13 anos atua como desenvolvedor de softwares e é Professor de desenvolvimento de software há mais de 10 anos. Instrutor premiado internacionalmente pela excelência dos seus cursos, Fundador da Cod3r, reconhecida como uma das melhores escolas de tecnologia do pais onde já passaram mais de 250 mil alunos.

Seja Nosso Assinante

Tenha acesso a este curso e muitos outros por um preço muito mais acessível. Junte-se a muitos outros assinantes e venha fazer parte desta comunidade. Clique no botão abaixo e descubra como!

• Após a compra do curso tenho prazo pra poder assistir?

  Não, o curso pode ser assistido a qualquer tempo sem limite de prazo.

• O curso oferece certificado?

  Sim, ao final do curso você receberá um certificado baseado na carga horária pra concluir o curso

• Existe suporte para as minhas dúvidas?

  Sim, temos um time de suporte pronto pra tirar as dúvidas relativas ao conteúdo do curso.

• Adquirindo o plano de assinatura também terei acesso a este curso?

  Sim

• Existe a possibilidade de pagar este curso por boleto?

  Sim, basta enviar email para e solicitar.