Do Zero ao Redux - projetos práticos diversificados
4.3 (147 ratings)
Course Ratings are calculated from individual students’ ratings and a variety of other signals, like age of rating and reliability, to ensure that they reflect course quality fairly and accurately.
548 students enrolled

Do Zero ao Redux - projetos práticos diversificados

Aprenda a criar projetos práticos com React e Redux e conheça seus middlewares (redux thunk, sagas, logger, chrome dev)
4.3 (147 ratings)
Course Ratings are calculated from individual students’ ratings and a variety of other signals, like age of rating and reliability, to ensure that they reflect course quality fairly and accurately.
548 students enrolled
Last updated 2/2019
Portuguese
Portuguese [Auto]
Current price: $20.99 Original price: $29.99 Discount: 30% off
5 hours left at this price!
30-Day Money-Back Guarantee
This course includes
  • 12.5 hours on-demand video
  • 3 articles
  • Full lifetime access
  • Access on mobile and TV
  • Certificate of Completion
Training 5 or more people?

Get your team access to 4,000+ top Udemy courses anytime, anywhere.

Try Udemy for Business
What you'll learn
  • Utilizar Redux e seus complementos Redux-thunk e Redux-sagas
  • Criar aplicativos completos utilizando React e Redux
  • Código fonte de todos os aplicativos disponíveis em cada sessão
Course content
Expand all 100 lectures 12:21:18
+ Introdução
8 lectures 44:45
Props
03:23
State e Virtual DOM
06:29
Redux, porque utilizar essa ferramenta
05:57
Redux - Conceitos
09:01
Redux - fluxo assíncrono
07:18
Como instalar as ferramentas necessárias para este curso
04:33
+ Projeto 1- Criando o seu Youtube
24 lectures 02:42:17
Código fonte no Github
00:30
Iniciando o projeto
09:53
Organizando os componentes na tela com CSS Grid
07:13
Componente SearchBar
08:12
Criando a função PesquisaTermo
06:08

Para criar a sua própria API KEY e fazer uso da pesquisa oficial do Youtube, acesse: https://console.developers.google.com

Youtube API
06:39
Iniciando com Redux no projeto
02:06
Criando a Action Busca Video
15:00
Criando o Reducer Busca Video
07:08
Instalando as dependências do Redux e combinando os reducers
05:57
Criando a Store
09:37
Conectando o projeto ao Redux com o Provider
03:56

Temos agora, o componente SearchBar, trazendo uma lista de videos do youtube baseado no termo qeu digitamos na caixa de texto.

É mágica? Não, é Redux!

E não é que funciona mesmo?
10:48
Uma pausa para falar dos plugins
06:09
Componente Video List
07:18
Conectando o componente VideoList a Store
05:36
Mostrando a lista de Videos
09:19
Spinner enquanto carrega VideoList
06:39
Redux síncrono: Reproduz Video
06:01
Disparando a ação para colocar na Store o video que eu quero assistir
05:49
Iniciando o Video Player
08:03
Reproduzindo o Video do Youtube
06:21
Finalizando o Projeto
06:18
+ Projeto 2 - Lista de compras
49 lectures 07:05:40
Codigo no Github
00:43
Configurando o ambiente
09:58
Introducao ao CSS Flexbox
10:27
Criando temas com Material Ui
03:50
Header da aplicação
05:08
Como organizar o projeto
07:20
Iniciando a Home Page
12:12
Lista da Home Page
10:56
Refatorando a Home Page
12:56
Refatorar, Refatorar e Rafatorar
11:14
PropTypes é nosso amigo
07:34
Construção das Rotas
07:07
Criando os links
07:16
Hora de criar o form
08:24
Estilizando o form
10:01
Items da lista
08:56
Criando o rodapé dos items
11:11
Com uma imagem fica mais bonito!
10:09
Finalmente Redux
13:25
Nossa Primeira action e reducer
11:17
Conectando componente na store
12:12
Disparando ações
09:35
Tratando Erros no form
04:32
Visualizando items da lista
11:20
Calculando Total da lista com Selectors
09:48
Hora de otimizar o selector com Reselect
09:01
Excluindo items da lista
10:31
Eu ja comprei esse produto ?
12:18
Total de items abertos e fechados
05:54
Action e Reducer do Form
10:26
Atualizando o Form
10:04
Salvando o item atualizado
12:20
Concluindo a edição
05:00
Nova Lista
11:07
Mostrando o form condicionalmente
09:02
Carregando o nome da lista nas atualizacoes
04:29
Componente Novo Item
07:40
Adicionando novo item no modo de edicao
09:55
Salvando a Lista no LocalStorage
09:14
Configurando a api de imagens do google
09:42
Criando nossa api com Axios
05:08
Action e Reducer para busca de imagens
07:33
Configurando Middleware
04:19
Criando os Sagas
12:54
Vendo o resultado
07:24
E chegamos ao Fim do Projeto!
07:42
Deploy para o Heroku
10:22
Correção - Adicionando data dinâmica ao footer
03:10
+ Projeto 3 - Conversor de Moedas
19 lectures 01:48:34
Código fonte no Github
00:30
Criando o Boilerplate
02:12
Instalando o Bootstrap CSS only
04:21
Componente Cabeçalho
02:51
Criando o corpo do conversor
08:48
Criando o Formulário
11:37
Criando a lista de moedas
08:43
Ajustes
03:16
Instalando o Redux no projeto
02:30
Criando a Store
05:44
Criando a Action
11:47
Criando o Redux - convert
07:21
Combinando Reducers
02:53
Conectando os componentes ao Redux
06:03
Capturando o valor digitado
10:30
Capturando o nome das moedas selecionadas
03:32
Surpresa na conversão
09:07
Enfim, convertendo e mostrando o valor
04:55
Requirements
  • Conhecimento prévio de Javascript e ao menos uma noção de React
  • Não é necessário ter conhecimento avançado, as aulas são bem explicadas
Description

Que tal aprender o framework javascript mais famoso da atualidade, em aulas práticas, de curta duração e construindo alguns projetos práticos, como um sistema de chat? Este curso vai preparar você para criar aplicativos em React.js utilizando Redux de forma síncrona e assíncrona.

Vamos aprender:

  • O que é o Redux

  • Redux não depende do React

  • Redux com Node.js

  • Redux com React

  • Middlewares (logger, chrome dev tool)

  • Redux síncrono

  • Redux assíncrono com redux-thunk

  • Redux assíncrono com redux-sagas

E vamos ver tudo isso através de alguns projetos, como:

  • Xumestube (criando o seu próprio Youtube)

  • Lista de Compras (não esqueça mais nada na próxima ida ao supermercado)

  • Conversão de Moeda (quanto está o Dólar hoje? E o Euro?) fique por dentro (inclui conversão de Bitcoin para qualquer moeda)

Uma ótima oportunidade, vem aprender conosco.

Who this course is for:
  • desenvolvedores javascript que estão começando a conhecer React e querem conhecer como incluir Redux para gerenciar o estado da aplicação
  • Quer desenvolver o seu próprio Youtube? Vamos criar um sistema de busca de videos e reproduzi-los no nosso próprio app.
  • Aprenda a criar uma lista de compras, utilizando React e Redux