Curso sobre React JS para pessoas interessadas em conhecer o assunto e desenvolver habilidades relacionadas. Revise as aulas para confirmar conteúdo, nÃvel e pré-requisitos.
Aulas do Curso
(50 vídeos)
0 de 50 aulas concluídas
0%
Progresso salvo somente neste navegador.
0
Curso de React JS Aula 01 Criar Projeto React JS, Estrutura do Projeto
JS, JavaScript, Frontend, Front-end, React, React JS, FullStack, Instalar, Instalação, Configurar, Testar, Ferramentas, …
1
Curso de React JS Aula 02 Organizar Projeto React JS, Fragment
1. Limpar estrutura do projeto
2. Ajustes nos códigos
3. index.html em public
4. App.js em src
5. index.js em src
6. JSX…
2
Curso de React JS Aula 03 Criar Componentes no React JS + CSS Module
Tópicos da Aula 03:
00:00 Apresentação do layout de referência inicial e tarefas da aula
01:30 O que são Componentes e m…
3
Curso de React JS Aula 04 Criar Componentes com props e children
00:00 Apresentação das tarefas da aula e layout básico no Figma
01:34 Revisão do que já fizemos até o momento
02:23 Ajus…
4
Curso de React JS Aula 05 Criar Componente Card e mapear json
00:00 Apresentação das tarefas do dia
01:00 Ajustes para retirar informações do App.js
02:25 Criar componente Card
08:13…
5
Curso de React JS Aula 06 Criar Componente Category e filtrar vídeos por categoria
1. Criar componente category
2. Filtrar vídeos por categoria
00:00 Apresentação das tarefas do dia
00:50 Novo arquivo J…
6
Curso de React JS Aula 07 Solução de mapeamento, export, import e escopo
Curso de React JS Aula 07 Solução de mapeamento, export, import e escopo [14:45]
1. Solução de mapeamento para retirar …
7
Curso de React JS Aula 08 Criar Rotas e Páginas, React Router DOM
1. Instalar pacote react-router-dom
2. Criar componentes de páginas Home e Watch
3. Criar rotas
00:00 Apresentação das …
8
Curso de React JS Aula 09 Criar Page 404 Page Not Found e Ajustes no CSS
1. Criar página para erro 404
2. Criar nova rota
3. Fazer ajustes no CSS geral e dos componentes
00:00 Apresentação das…
9
Curso de React JS Aula 10 Criar Rotas Dinâmicas, Exibir vídeo por ID do card
1. Criar rota dinâmica passando parâmetros
2. Ajuste no routes.js
3. Ajuste no componente Watch para pegar o id dos parâ…
10
Curso de React JS Aula 11 React Hooks, useState
1. O que são React Hooks?
2. Situação prática de criação do useState()
React JS, JS, JavaScript, Hook, useState, state,…
11
Curso de React JS Aula 12 Criar Componente VideoList e Página Pesquisar
1. Criar nova página Search
2. Criar nova rota para /search
3. Criar novo componente VideoList que lista todos os vídeos…
12
Curso de React JS Aula 13 Criar Componente SearchVideoList, Pesquisar vídeos por categoria ou título
1. Criar novo componente SearchVideoList
2. Refatorar página Search para exibir o componente SearcVideoList
3. SearchVid…
13
Curso de React JS Aula 14 Criar componente Carousel React Slick
Criar componente Carousel React Slick
[ Atualização da lista de videos.json ]
1. Usar lib React Slick para criar Carouse…
14
Curso de React JS Aula 15 Clonar Repositório do GitHub
React JS, JS, JavaScript, Clonar, Download, Code, ZIP, npm install, npm start, Frontend, Front-end, FullStack, Criar com…
15
Curso de React JS Aula 16 Criar Página e Rota Favoritos
1. Criar page Favorites
2. Criar route /favorites
3. Refatorar Header, tirar link Assistir e criar link Favoritos
4. For…
16
Curso de React JS Aula 17 API Context do React e Hook Personalizado
1. Criar contexts
2. Criar FavoriteContext
3. Criar Hook Personalizado para controlar estado do contexto
4. Ajustes nas …
17
Curso de React JS Aula 18 Criar componente Formulário e página com rota
1. Criar componente Form, index e css
2. Criar page VideoCadastre
3. Criar rota para acessar page VideoCadastre
React J…
18
Curso de React JS Aula 19 Receber dados do Formulário, processar e validar form
00:03 Apresentação do Formulário
03:02 Receber ou Pegar dados do Form
07:17 Processar dados do Form
07:53 Função onSave …
19
Curso de React JS Aula 20 Criar componente Loader
Nosso Discord, acesse em https://discord.gg/z9mwxdr2
Crie um canal no Discord para trocarmos ideias, tirarmos dúvidas.
…
20
Curso de React JS Aula 01 EXTRA Responsividade e botão ScrollToTop
Nosso Discord, acesse em https://discord.gg/z9mwxdr2
Crie um canal no Discord para trocarmos ideias, tirarmos dúvidas.
…
21
Curso de React JS Aula 02 EXTRA Fazer Deploy na Vercel
1. Clonar repositório do GitHub e importar repositório
2. Criar conta na Vercel
3. Configurar integração da Vercel com o…
22
Curso de React JS Aula 01 Criar Projeto React JS com Vite, Estrutura do Projeto
JS, JavaScript, Frontend, Front-end, FullStack, Instalar, Instalação, Configurar, Testar, Criar projeto, Vite, Vitejs, n…
23
Curso de React JS Aula 02 Organizar projeto, criar componentes e página Home
JS, JavaScript, Frontend, Front-end, FullStack, Vite, Vitejs, Portfolio, criar pastas, components, pages, criar componen…
24
Curso de React JS Aula 03 Criar páginas, rotas e links no React JS + react router dom
JS, JavaScript, Frontend, Front-end, FullStack, Vite, Vitejs, Portfolio, criar pastas, components, pages, criar componen…
25
Curso de React JS Aula 04 Criar componente Container e Página 404
JS, JavaScript, Frontend, Front-end, FullStack, Vite, Vitejs, Portfolio, Page404, 404, PageNotFound, Props, Props.Childr…
26
Curso de React JS Aula 05 Ícones no React JS, React Icons e criar página Contatos
JS, JavaScript, Frontend, Front-end, FullStack, Vite, Vitejs, Portfolio, React Icons, Ícones, página Contatos, importar …
27
Curso de React JS Aula 06 Rotas aninhadas no React JS com o react router dom
JS, JavaScript, Frontend, Front-end, FullStack, Vite, Vitejs, Portfolio, página base, PageBase, Rotas Aninhadas, routes …
28
Curso de React JS Aula 07 Página Sobre do Portfolio feito no React JS
JS, JavaScript, Frontend, Front-end, FullStack, Vite, Vitejs, Portfolio, página sobre, about, criar css, css da página s…
29
Curso de React JS Aula 08 Criar componente Card da página Projetos no React JS
JS, JavaScript, Frontend, Front-end, FullStack, Vite, Vitejs, Portfolio, página projetos, projects, card, componente car…
30
Curso de React JS Aula 09 Cards Dinâmicos, Consumir dados da API do Github
JS, JavaScript, Frontend, Front-end, FullStack, Vite, Vitejs, Portfolio, página projetos, projects, cards dinâmicos, use…
31
Repositório do Projeto Portfólio
Veja o repositório do projeto no Github. Tem arquivos markdown com as instruções de cada aula.
32
Curso de React JS Aula 10 Deploy na Vercel do seu projeto React JS + Ajustes no código
JS, JavaScript, Frontend, Front-end, FullStack, Vite, Vitejs, Portfolio, Deploy, Vercel, Ajustes, tag a, rel, noopener, …
33
Curso de React JS Aula 01 EXTRA Responsividade no Projeto React JS
JS, JavaScript, Frontend, Front-end, FullStack, Vite, Vitejs, Portfolio, Responsividade, Responsivily, F12, media querie…
34
Curso de React JS Aula 02 EXTRA Responsividade no Projeto React JS
JS, JavaScript, Frontend, Front-end, FullStack, Vite, Vitejs, Portfolio, Page404, Responsividade, Responsivily, F12, med…
35
Curso de React JS Aula 03 EXTRA Menu Sandwich React JS
JS, JavaScript, Menu, Sandwich, useState, Menu sandwich, toggle, toggleMenu, Frontend, Front-end, FullStack, Vite, Vitej…
36
Curso de React JS Aula 00 Projeto Copa do Mundo Feminina 2023
React, React JS, Vite, JS, JavaScript, Frontend, Front-end, FullStack, Planejamento, Pesquisa, Teste, Prova, MVP, Copa, …
37
Curso de React JS Aula 01 Criar Projeto Copa do Mundo Feminina 2023 Grupos da Copa
React, React JS, Vite, JS, JavaScript, Frontend, Front-end, FullStack, Criar projeto, copa2023, favicon, bandeiras, App,…
38
Curso de React JS Aula 02 Criar Componente Tabela de Jogos da Copa do Mundo Feminina 2023
React, React JS, Vite, JS, JavaScript, Frontend, Front-end, FullStack, Criar Tabela, GameTable, Tabela de Jogos, copa202…
39
Curso de React JS Aula 03 Criar Componente Classificação por Grupos da Copa do Mundo Feminina 2023
React, React JS, Vite, JS, JavaScript, Frontend, Front-end, FullStack, Criar Tabela, GameTable, Tabela de Jogos, Classif…
40
Curso de React JS Aula 04 Refatorar Componente Classificação por Grupos Copa do Mundo Feminina 2023
Nesta aula vamos refatorar o componente para exibir uma caixa de seleção e com base na escolha da letra do grupo usar o …
41
Curso de React JS Aula 05 Criar Componente Fases Eliminatórias da Copa do Mundo Feminina 2023
Nesta aula vamos criar um componente chamado KnockoutStage que exibirá cards dos jogos das fases eliminatórias, oitavas …
42
Curso de React JS Aula 06 Usar o Componente KnockoutStage da Copa do Mundo Feminina 2023 + Desafio
Nesta aula vamos refatorar e usar o componente chamado KnockoutStage que exibirá cards dos jogos da fase eliminatória de…
43
Ajuste no componente KnockoutStage
Ajuste no componente KnockoutStage para que ele possa ser usado corretamente em todas as fases eliminatórias. É uma pequ…
44
Curso de React JS Aula 07 Criar Componente Fixture da Copa do Mundo Feminina 2023 Solução do Desafio
Nesta aula vamos criar o componente Fixture ou FixtureList que exibirá cards dos jogos do dia, ou seja, com base em uma …
45
Curso de React JS Aula 08 Composição de Componentes React JS Copa do Mundo Feminina 2023
Nesta aula vamos criar o componente TournamentBracket que utilizará o conceito de composição de componentes.
React, Rea…
46
Curso de React JS Aula 09 Navegação por Abas no React JS Copa do Mundo Feminina 2023
Nesta aula vamos implementar a navegação por abas no React JS.
React, React JS, Vite, JS, JavaScript, Frontend, Front-e…
47
Curso de React JS Aula 11 Extra 01 Criar componente TabButtom Projeto Copa 2023 + Refatoração
Nesta aula vamos criar o componente TabButtom e refatorar o nosso App para que ele use esse novo componente, com ajustes…
48
Programação Descomplicada com o ChatGPT: Aprenda de Forma Inteligente
Quer contribuir para o crescimento do canal, se puder faça um pix para: [email protected]
Transforme sua Jornada de …
49
Programação Descomplicada com o Bard: Aprenda de Forma Inteligente
Quer contribuir para o crescimento do canal, se puder faça um pix para: [email protected]
Transforme sua Jornada de …
