Watch next.js e react - curso completo - aprenda com projetos videos

O que você aprenderá?

Confira algumas coisas que você aprenderá durante o curso.

  • NextJs

  • ReactJs

  • Integração com Firebase, Tailwind CSS e Typescript

  • Fazer Deploy na Núvem

  • 6 Projetos na Prática

  • Boas Práticas de Programação e Muito Mais

Conteúdo do Curso

  • 2

    • Introdução do Módulo

    • Código Fonte Final

    • Objetivos do Módulo

    • Criando o Projeto

    • Primeiro Componente

    • Movendo o Primeiro Componente

    • JSX #01

    • JSX #02

    • JSX #03

    • JSX #04

    • Desafio Lista

    • Desafio Lista - Resposta #01

    • Desafio Lista - Resposta #02

    • Desafio Lista - Resposta #03

    • Fragment #01

    • Fragment #02

    • Usando Componente

    • Propriedades de Componente

    • Integração com CSS #01

    • Integração com CSS #02

    • Propriedades são Somente Leitura

    • Aplicando Estilo CSS

    • Projeto Tabuleiro #01

    • Projeto Tabuleiro #02

    • Projeto Tabuleiro #03

    • Projeto Tabuleiro #04

    • Projeto Tabuleiro #05

    • Repetição #01

    • Repetição #02

    • Condicional #01

    • Propriedade Children

    • Condicional #02

    • Comunicação Direta

    • Chamando Função Via Evento

    • Comunicação Indireta

    • Componente com Estado

    • Desafio Contador

    • Desafio Contador - Resposta

    • Componentes Controlados

    • Desafio Mega-Sena

    • Desafio Mega-Sena - Resposta #01

    • Desafio Mega-Sena - Resposta #02

    • Desafio Mega-Sena - Resposta #03

    • Componente Baseado em Classe

    • Sistema Módulo ECMAScript

    • Integrando TypeScript

    • Conclusão do Módulo

  • 3

    • Introdução do Módulo

    • Código Fonte Final

    • Criando o Projeto

    • Estrutura do Projeto

    • Pasta Page e as Rotas no Next

    • Rotas #01

    • Rotas #02

    • Rotas #03

    • Navegando entre Páginas #01

    • Navegando entre Páginas #02

    • API #01

    • API #02

    • Integrando com API #01

    • Integrando com API #02

    • API com Múltiplos Parâmetros

    • Resolvendo Warnings

  • 4

    • Introdução do Módulo

    • Código Fonte Final

    • Visão Geral da Aplicação

    • Criando o Projeto

    • Componente Presente

    • Box Sizing

    • Componente Porta #01

    • Componente Porta #02

    • Componente Porta #03

    • Componente Porta #04

    • Componente Porta #05

    • Componente Porta #06

    • Classe Porta

    • Integrando TypeScript

    • Adicionando Eventos a Porta #01

    • Adicionando Eventos a Porta #02

    • Adicionando Eventos a Porta #03

    • Lidando com Array de Portas #01

    • Lidando com Array de Portas #02

    • Integração Porta Presente

    • Componente Jogo #01

    • Componente Jogo #02

    • Usando Router

    • Estruturando o Formulário

    • Finalizando o Formulário

    • Validando o Formulário

    • Atualizando Next 11

  • 5

    • Introdução do Módulo

    • Código Fonte Final

    • Estratégias de Renderização

    • Renderização SPA

    • Renderização SSR

    • Renderização SSG

    • Analisando o Projeto Tabuleiro

    • Criando Projeto

    • Componente Estático #01

    • Componente Estático #02

    • Componente Estático #03

    • Componente Estático #04 - Parte 1

    • Componente Estático #04 - Parte 2

    • Componente Dinâmico #01

    • Componente Dinâmico #02

    • Bug no Build do Projeto

    • Usando getStaticPaths - Parte 1

    • Usando getStaticPaths - Parte 2

    • Usando Fallback True

  • 6

    • Introdução do Módulo

    • Código Fonte Final

    • Visão Gera da Aplicação

    • Criando o Projeto

    • Classe Questão

    • Classe Resposta

    • Iniciando nossa API

    • Banco de Questões

    • Convertendo Para Objeto

    • Construindo a API #01

    • Construindo a API #02

    • Embaralhar Itens

    • Respondendo Pergunta

    • Iniciando Componente Questão

    • Componente Enunciado

    • Componente Resposta #01

    • Componente Resposta #02

    • Componente Resposta #03

    • Componente Resposta #04

    • Componente Resposta #05

    • Componente Resposta #06

    • Componente Resposta #07

    • Componente Temporizador

    • Externalizando Tempo Resposta

    • Componente Botão

    • Componente Questionário #01

    • Componente Questionário #02

    • Componente Index #01

    • JSON para Modelo

    • Componente Index #02

    • Componente Index #03

    • Solução com Atributo Key

    • Componente Resultado

    • Componente Estatística

    • Animação Resposta

    • Atualizando Next 11

  • 7

    • Introdução do Módulo

    • Código Fonte Final

    • Visão Geral da Aplicação

    • Criando o Projeto

    • Classe Tarefa

    • Enum Tipo Filtro

    • Classe ListaTarefas #01

    • Tarefas Iniciais

    • Classe ListaTarefas #02

    • Componente Seleção

    • Componente ListaItem

    • Componente Lista

    • Componente ListaBotão

    • Componente Lista Rodapé #01

    • Componente Lista Rodapé #02

    • Adicionando Imagem ao Background

    • Trabalhando no Layout

    • Posicionamento da Lista

    • Formulário #01

    • Formulário #02

    • Integrando com Fontawesome

  • 8

    • Introdução do Módulo

    • Deploy Vercel - Projeto #01 - Parte 1

    • Deploy Vercel - Projeto #01 - Parte 2

    • Problema Tailwind CSS

    • Deploy Vercel - Projeto #02 - Parte 1

    • Deploy Vercel - Projeto #02 - Parte 2

    • Deploy da aplicação Quiz

  • 9

    • Introdução do Módulo

    • Código Fonte Final

    • Visão Geral do Projeto

    • Configurando o Projeto

    • Estrutura Inicial

    • Configurando Fonte

    • Componente Layout #1

    • Esquema de Cores

    • Componente Menu Lateral #1

    • Componente Menu Lateral #2

    • Componente Título

    • Componente Logo

    • Componente Menu Lateral #3

    • Esquema de Cores #2

    • Comunicação Entre Componentes

    • Context API #1

    • Context API #2

    • Botão Alternar Tema #1

    • Botão Alternar Tema #2

    • Tela Autenticação #1

    • Tela Autenticação #2

    • Tela Autenticação #3

    • Tela Autenticação #4

    • Atualização no Firebase

    • Configuração do Firebase

    • Iniciando com Autenticação do Firebase

    • Autenticação com Google

    • Avatar Usuário

    • Criando Sessão com Cookie

    • Implementando Logout

    • Protegendo Rotas #1

    • Protegendo Rotas #2

    • Salvando Tema Local Storage

    • Protegendo Rotas #3

    • Autenticação com E-mail e Senha

  • 10

    • Introdução do Módulo

    • Resultado Final

    • 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

  • 11

    • Aviso sobre a seção extra de TypeScript

    • O que é TypeScript

    • Por que TypeScript e como Usá-lo?

    • Instalando TypeScript

    • Executando TypeScript - Manual

    • Executando Typescript - Code Runner

    • Executando TypeScript - HTML

    • O Básico de Tipos

    • Tipos Numéricos e Booleano

    • Atribuindo Tipos Explícitos

    • Arrays e Tipos

    • Tuplas

    • Enums

    • O Tipo "Any"

    • O Básico sobre Interfaces

    • Interfaces e Propriedades

    • Interfaces e Métodos

    • Usando Interfaces com Classes

    • Interfaces e Tipo Função

Adquira agora mesmo!

Aprenda tudo sobre Next em um curso super completo, e ainda leve um monte de outros conhecimentos pra sua carreira. Baseado em vários projetos práticos.

Benefícios Inclusos no Curso

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

    250 aulas e 31 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

Descrição

Bem-vindos ao tão esperado curso de NextJS da Cod3r!

Neste curso vamos falar do framework que roda em cima da mais famosa biblioteca da atualidade, o React, e que adiciona várias funcionalidades a ele. Várias grandes empresas já estão utilizando o Next, o que será uma grande adição ao seu currículo, aprender essa incrível tecnologia!

Você vai aprender Next na prática em um curso totalmente baseado em projetos do mais simples a projetos mais complexos.

Abordaremos não somente as bases do Next e as suas funcionalidades principais, mas como também vamos te ensinar React, passando por um resumão da biblioteca. Após isso, o curso vai se focar em diversos projetos que vão fazer integração com Tailwind, com Firebase, e vamos também ter projetos com backend já que essa é uma possibilidade que o Next provê. 

Você também irá aprender como fazer o deploy na nuvem dos seus projetos, e no final vamos entregar um Modelo de aplicação com responsividade, com mudança de tema(dark e light), login, autenticação, proteção de rotas, e tudo isso para que você possa usar de base para seus próprios projetos!

O curso está dividido em seções e teremos:

 • Um resumo sobre React, onde criaremos um projeto utilizando os conceitos básicos de componente, jsx, fragment. Faremos integração com css e teremos um projeto que desenharemos um tabuleiro de damas para demonstrar como organizar os componentes. Abordaremos condicionais e laços, funções e faremos a integração com Typescript.

 • Teremos em seguida uma introdução ao NextJS de fato, onde criaremos um projeto base para trabalhar a estrutura do projeto, a organização dos arquivos e pastas. Aprenderemos sobre rotas, navegação entre páginas, falaremos sobre api e integração com ela, e  abordaremos estratégias de renderização, e resolvendo possíveis warnings.

 • Adiante começaremos nosso primeiro projeto, onde criaremos componentes novos. Aprenderemos sobre box sizing, fazer a integração do projeto com typescript, adicionando eventos ao projeto, usaremos router, e faremos validações de formulário. Também aprenderemos mais sobre a questão do SSR, Server Side Rendering. Veremos as estratégias de renderização e como funcionam as estratégias SPA, SSR e SSG. E Vamos criar um novo projeto e nele aprender sobre componentes estáticos e dinâmicos.

 • Depois teremos um projeto com foco no FullStack, ou seja, teremos um projeto também com o backend. Iremos trabalhar com construção de api, mexer com arquivos json e trabalhar no visual do projeto também.

 • Teremos uma seção onde faremos um projeto com integração com o Tailwind e logo após um projeto ensinando a fazer o deploy das aplicações na nuvem.

E na última seção será criada uma aplicação para Criação, Leitura, Edição e Remoção de dados, o famoso CRUD (Create, Read, Update, Delete) com NextJS. Utilizando o Firebase e Firestore como banco de dados, utilizando também o TailwindCSS para criar o visual do projeto e integrando com TypeScript. Tudo isso será mostrado e explicado durante a seção, desde a criação do projeto, a instalação das dependências, configuração e integração com o banco de dados e também a integração e uso tanto do Tailwind quanto do TypeScript.

Estamos entregando neste curso um conteúdo de muito valor, e que pode fazer muita diferença na sua carreira como programador.

Vamos aprender juntos, te aguardo no curso.

Super Promoção - Plano de Assinatura

Tenha acesso a este curso e a mais 6000 aulas por um preço incrível. Clique abaixo e confira essa super promoção. Junte-se a muitos outros assinantes e venha fazer parte desta comunidade. É por tempo limitado.

Instrutor

Watch next.js e react - curso completo - aprenda com projetos videos

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.

Cursos Relacionados

Pessoas que adquiriram este curso também se interessaram pelos cursos abaixo

FAQ

  • 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 clicar no link boleto e enviar o comprovante de pagamento para o email