Udemy
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
Development
Web Development Data Science Mobile Development Programming Languages Game Development Database Design & Development Software Testing Software Engineering Development Tools No-Code Development
Business
Entrepreneurship Communications Management Sales Business Strategy Operations Project Management Business Law Business Analytics & Intelligence Human Resources Industry E-Commerce Media Real Estate Other Business
Finance & Accounting
Accounting & Bookkeeping Compliance Cryptocurrency & Blockchain Economics Finance Finance Cert & Exam Prep Financial Modeling & Analysis Investing & Trading Money Management Tools Taxes Other Finance & Accounting
IT & Software
IT Certification Network & Security Hardware Operating Systems Other IT & Software
Office Productivity
Microsoft Apple Google SAP Oracle Other Office Productivity
Personal Development
Personal Transformation Personal Productivity Leadership Career Development Parenting & Relationships Happiness Esoteric Practices Religion & Spirituality Personal Brand Building Creativity Influence Self Esteem & Confidence Stress Management Memory & Study Skills Motivation Other Personal Development
Design
Web Design Graphic Design & Illustration Design Tools User Experience Design Game Design Design Thinking 3D & Animation Fashion Design Architectural Design Interior Design Other Design
Marketing
Digital Marketing Search Engine Optimization Social Media Marketing Branding Marketing Fundamentals Marketing Analytics & Automation Public Relations Advertising Video & Mobile Marketing Content Marketing Growth Hacking Affiliate Marketing Product Marketing Other Marketing
Lifestyle
Arts & Crafts Beauty & Makeup Esoteric Practices Food & Beverage Gaming Home Improvement Pet Care & Training Travel Other Lifestyle
Photography & Video
Digital Photography Photography Portrait Photography Photography Tools Commercial Photography Video Design Other Photography & Video
Health & Fitness
Fitness General Health Sports Nutrition Yoga Mental Health Dieting Self Defense Safety & First Aid Dance Meditation Other Health & Fitness
Music
Instruments Music Production Music Fundamentals Vocal Music Techniques Music Software Other Music
Teaching & Academics
Engineering Humanities Math Science Online Education Social Science Language Teacher Training Test Prep Other Teaching & Academics
AWS Certification Microsoft Certification AWS Certified Solutions Architect - Associate AWS Certified Cloud Practitioner CompTIA A+ Cisco CCNA Amazon AWS CompTIA Security+ AWS Certified Developer - Associate
Graphic Design Photoshop Adobe Illustrator Drawing Digital Painting InDesign Character Design Canva Figure Drawing
Life Coach Training Neuro-Linguistic Programming Personal Development Mindfulness Personal Transformation Meditation Life Purpose Coaching Neuroscience
Web Development JavaScript React CSS Angular PHP WordPress Node.Js Python
Google Flutter Android Development iOS Development Swift React Native Dart Programming Language Mobile Development Kotlin SwiftUI
Digital Marketing Google Ads (Adwords) Social Media Marketing Google Ads (AdWords) Certification Marketing Strategy Internet Marketing YouTube Marketing Email Marketing Retargeting
SQL Microsoft Power BI Tableau Business Analysis Business Intelligence MySQL Data Analysis Data Modeling Big Data
Business Fundamentals Entrepreneurship Fundamentals Business Strategy Online Business Business Plan Startup Freelancing Blogging Home Business
Unity Game Development Fundamentals Unreal Engine C# 3D Game Development C++ 2D Game Development Unreal Engine Blueprints Blender
30-Day Money-Back Guarantee

This course includes:

  • 91.5 hours on-demand video
  • Full lifetime access
  • Access on mobile and TV
Development Web Development React

Curso React.js Ninja - React Completo

O curso para se tornar um ninja em React, e todas as ferramentas do seu ecossistema!
Rating: 4.5 out of 54.5 (1,129 ratings)
3,948 students
Created by Fernando Daciuk
Last updated 7/2020
Portuguese
30-Day Money-Back Guarantee

What you'll learn

  • Criar aplicações utilizando o React.js de forma correta
  • Configurar seu ambiente de desenvolvimento e produção
  • Usar conceitos de programação funcional em suas aplicações
  • Aplicar testes de vários tipos em suas aplicações
  • Criar aplicações com rotas, estados isolado e pré-renderização no lado do servidor
Curated for the Udemy for Business collection

Course content

6 sections • 519 lectures • 91h 25m total length

  • Preview07:56
  • Preview05:15
  • M1#A03 - Começando a trabalhar com React
    11:23
  • M1#A04 - Criando elementos aninhados
    04:33
  • M1#A05 - Conhecendo o JSX
    09:52
  • M1#A06 - Aninhando com JSX e criando componentes
    10:54

  • MRW#01 - Apresentando minhas configurações de ambiente e o Webpack
    03:20
  • MRW#01.0.1 - Aula do futuro sobre versões das dependências
    05:11
  • MRW#02 - Configuração básica do Webpack
    07:58
  • MRW#03 - Usando o server do Webpack
    05:00
  • MRW#04 - Modularizando a aplicação
    03:50
  • MRW#05 - Criando uma aplicação em React
    08:28
  • MRW#06 - Usando o sistema de módulos do ES6/2015
    14:39
  • MRW#06.0.1 - Aula do futuro sobre ES Modules
    09:52
  • MRW#07 - Configurando JSX no babel e sourcemaps no Webpack
    06:52
  • MRW#08 - Configurando nossa aplicação para usar o React hot loader
    11:12
  • MRW#09 - Colocando o hot loader para funcionar
    12:42
  • MRW#10 - Configurando a ferramenta de lint
    08:15

  • M1#A07 - Passando props
    04:49
  • M1#A08 - Atributos do HTML
    04:59
  • M1#A09 - getDefaultProps
    05:20
  • M1#A10 - Passando outros tipos de dados via props
    05:32
  • M1#A11 - Renderizando componentes com funções puras
    14:10
  • M1#A12 - Renderizando componentes com classes do ES6/2015
    05:48
  • M1#A13 - Conhecendo a prop "key"
    10:38
  • M1#A14 - Problemas ao duplicar a "key"
    04:10
  • M1#A15 - Eventos
    08:29
  • M1#A16 - A prop "children"
    05:52
  • M1#A17 - Composição
    10:56
  • M1#A18 - State
    08:25
  • M1#A19 - Entendendo arrow functions
    10:46
  • M1#A20 - Stateful vs stateless
    14:33
  • M1#A21 - Lifecycle dos componentes
    05:28
  • M1#A22 - Lifecycle: fluxo de montagem / desmontagem
    16:02
  • M1#A23 - Lifecycle: fluxo de atualização (componentWillReceiveProps)
    04:12
  • M1#A24 - Lifecycle: fluxo de atualização (shouldComponentUpdate)
    08:52
  • M1#A25 - Lifecycle: fluxo de atualização (componentWillUpdate)
    05:31
  • M1#A26 - Lifecycle: fluxo de atualização (componentDidUpdate)
    04:28
  • M1#A27 - propTypes
    10:00
  • M1#A28 - Introdução à formulários no React
    12:55
  • M1#A29 - Formulários (checkbox e radio)
    10:32
  • M1#A30 - Formulários (select e option)
    06:19
  • M1#A31 - Formulários (textarea)
    04:46
  • M1#A32 - Eventos para componente de formulário
    06:06
  • M1#A33 - setState é assíncrono
    06:53
  • M1#A34 - Conceitos e tipos de componentes com React, criando uma app (GitHub)
    04:54
  • M1#A35 - GitHub app - Criando a marcação da aplicação
    10:49
  • M1#A36 - GitHub app - Separando os componentes
    19:03
  • M1#A37 - GitHub app - Criando o Container Component da aplicação
    11:06
  • M1#A38 - GitHub app - Criando o objeto de estado da aplicação
    14:17
  • M1#A39 - GitHub app - Passando o state via props para o componente UserInfo
    07:09
  • M1#A40 - GitHub app - Fazendo o request dos dados do usuário
    07:39
  • M1#A41 - GitHub app - Refatorando a aplicação e populando os dados do usuário
    10:39
  • M1#A42 - GitHub app - popular dados dos repositórios
    10:53
  • M1#A43 - GitHub app - método para buscar repositórios e favoritos
    18:23
  • M1#A44 - GitHub app - buscar repositórios do usuário pesquisado
    11:18
  • M1#A45 - GitHub app - sobre eventos - desabilitar / habilitar campo de busca
    13:28
  • M1#A46 - GitHub app - loading enquanto estiver buscando os dados
    09:16
  • M1#A47 - GitHub app - organizando as propTypes
    05:33
  • M1#A48 - formas de fazer "bind" do this em eventos
    08:51
  • M1#A49 - Entendendo o spread operator do ES6/2015
    10:54
  • M1#A50 - Trabalhando com libs de terceiros junto com React
    12:10
  • M1#A51 - Um overview sobre testes
    07:55
  • M1#A52 - TDD
    14:19
  • M1#A53 - Testes unitários em componentes
    16:03
  • M1#A54 - Encerramento módulo 1
    02:07

  • M2#A01 - Introdução
    05:32
  • M2#A02 - Conhecendo o create-react-app
    13:00
  • M2#A03 - Jest (overview)
    09:43
  • M2#A04 - Jest na prática - instalação e configuração
    08:36
  • M2#A05 - Jest na prática - conhecendo as funções para teste e asserção
    08:57
  • M2#A06 - Jest na prática - code coverage
    14:06
  • M2#A07 - Jest na prática - Integração com ES6/2015
    06:59
  • M2#A08 - Jest na prática - watch interativo
    11:45
  • M2#A09 - TDD - Assertion tools e desafio método map
    12:48
  • M2#A10 - TDD - método map
    27:47
  • M2#A11 - TDD - aprendendo recursão
    11:23
  • M2#A12 - TDD - map recursivo
    12:25
  • M2#A13 - TDD - map recursivo - parte 2
    16:45
  • M2#A14 - TDD - filter
    20:41
  • M2#A15 - TDD - filter recursivo
    09:43
  • M2#A16 - TDD - every
    10:55
  • M2#A17 - TDD - every recursivo
    10:20
  • M2#A18 - TDD - some
    09:52
  • M2#A19 - TDD - some recursivo
    05:21
  • M2#A20 - TDD - reverse
    06:48
  • M2#A21 - TDD - reverse recursivo
    14:18
  • M2#A22 - TDD - reduce
    12:35
  • M2#A23 - TDD - reduce (parte 2)
    16:07
  • M2#A24 - TDD - reduce recursivo
    17:19
  • M2#A25 - TDD - reduceRight
    09:30
  • M2#A26 - TDD - reduceRight recursivo
    08:20
  • M2#A27 - TDD - find
    08:57
  • M2#A28 - TDD - find recursivo
    08:43
  • M2#A29 - TDD - testando exceções
    18:13
  • M2#A30 - Conhecendo o Storybook
    14:09
  • M2#A31 - Trabalhando com assets: configuração no Webpack
    14:34
  • M2#A32 - Trabalhando com assets: HTML
    10:14
  • M2#A33 - Trabalhando com assets: Exportando CSS em um arquivo
    09:27
  • M2#A34 - Webpack: gerando bundle de produção
    11:46
  • M2#A35 - Webpack Dashboard
    04:57
  • M2#A36 - Trabalhando com assets: Modularizando o CSS
    08:22
  • M2#A37 - Trabalhando com assets: CSS Modules
    07:24
  • M2#A38 - Trabalhando com assets: Critical Rendering Path
    10:31
  • M2#A39 - Trabalhando com assets: Otimizando o Critical Rendering Path
    13:37
  • M2#A40 - Trabalhando com assets: Ajustando ambiente de dev
    02:31
  • M2#A41 - cross-env
    04:17
  • M2#A42 - criando alias no webpack
    09:46
  • M2#A43 - Configurando o Storybook
    14:19
  • M2#A44 - Storybook - escrevendo histórias reais
    10:27
  • M2#A45 - Storybook - extendendo o webpack.config padrão
    13:39
  • M2#A46 - Storybook - localização do arquivo de config, linter e static build
    07:33
  • M2#A47 - Storybook - criando histórias para os outros componentes
    12:54
  • M2#A48 - Paginação - criando o componente
    09:58
  • M2#A49 - Conhecendo o Yarn
    04:22
  • M2#A50 - Paginação - ambiente para testes
    06:05
  • M2#A51 - Paginação - ambiente para testes - linter
    09:03
  • M2#A52 - Paginação - implementação inicial
    15:40
  • M2#A53 - Paginação - implementação - parte 2
    10:34
  • M2#A54 - Paginação - implementação - parte 3
    15:50
  • M2#A55 - Paginação - implementação - parte 4
    08:36
  • M2#A56 - Paginação - implementação - parte 5
    16:12
  • M2#A57 - Paginação - testando as excessões
    15:54
  • M2#A58 - Paginação - storybook
    09:43
  • M2#A59 - Paginação - storybook - parte 2
    08:49
  • M2#A60 - Paginação - storybook - parte 3
    10:16
  • M2#A61 - Paginação - storybook - parte 4
    06:46
  • M2#A62 - Abstraindo configuração padrão do webpack
    09:44
  • M2#A63 - Abstraindo configuração padrão do webpack - parte 2
    16:45
  • M2#A64 - Abstraindo configuração padrão do webpack - parte 3
    06:05
  • M2#A65 - Adicionando paginação na aplicação
    06:27
  • M2#A66 - Colocando a paginação pra funcionar
    03:51
  • M2#A67 - Trocando de página
    13:21
  • M2#A68 - Adicionando parâmetros de paginação para os repositórios
    13:27
  • M2#A69 - Ajustando as proptypes do state para paginação
    07:31
  • M2#A70 - Acertando informações da paginação - página ativa
    02:54
  • M2#A71 - Acertando informações da paginação - total de páginas
    19:17
  • M2#A72 - Webpack - atualizando nosso boilerplate para webpack v2
    17:50
  • M2#A73 - Atualização do Webpack - atualizando as dependências
    16:24
  • M2#A74 - Atualização do Webpack - removendo dependências não utilizadas
    04:19
  • M2#A75 - Atualização do Webpack - atualizar storybook e remover erros
    07:59
  • M2#A76 - Atualização do Webpack - o que o tree shaking e como configurar
    11:10
  • M2#A77 - ES6 - Promises
    15:05
  • M2#A78 - webpack clean plugin
    04:53
  • M2#A79 - ES7 - async / await
    08:37
  • M2#A80 - Adicionando async / await no nosso workflow
    11:30
  • M2#A81 - Ajustando storybook
    13:54
  • M2#A82 - Centralizar paths do webpack no common.js
    07:38
  • M2#A83 - Introdução à code splitting
    11:24
  • M2#A84 - CommonsChunkPlugin
    06:36
  • M2#A85 - CommonsChunkPlugin - opções do plugin
    13:42
  • M2#A86 - import() dinâmico
    15:17
  • M2#A87 - import() dinâmico - e o linter?
    07:42
  • M2#A88 - webpack - file-loader: imagens e outros assets além de CSS
    13:24
  • M2#A89 - webpack - url-loader: imagens e outros assets além de CSS
    05:09
  • M2#A90 - webpack - raw-loader: pegando conteúdo de qualquer tipo de arquivo
    03:52
  • M2#A91 - webpack - adicionando o file-loader e url-loader no nosso boilerplate
    11:09
  • M2#A92 - this.setState() - usando funções fazer atualizações em lote
    11:52
  • M2#A93 - Configuração do preloader do storybook
    06:12
  • M2#A94 - Aplicação: editor de Markdown
    14:51
  • M2#A95 - Aplicação: editor de Markdown - melhorando a estrutura inicial
    11:01
  • M2#A96 - Aplicação: editor de Markdown - renderizando HTML
    10:40
  • M2#A97 - webpack - ajustando loader de CSS para depências externas
    03:26
  • M2#A98 - Aplicação: editor de Markdown - adicionando opção de markdown no editor
    05:08
  • M2#A99 - Aplicação: editor de Markdown - colorindo blocos de código
    09:42
  • M2#A100 - Aplicação: editor de Markdown - como fica em produção?
    10:42
  • M2#A101 - Aplicação: editor de Markdown - analisando bundle de produção
    08:25
  • M2#A102 - Aplicação: editor de Markdown - melhorar bundle de produção
    10:08
  • M2#A103 - Aplicação: editor de Markdown - ordenando os scripts no HTML
    16:31
  • M2#A104 - Aplicação: editor de Markdown - highlight.js assíncrono
    08:17
  • M2#A105 - Aplicação: editor de Markdown - reduzindo o bundle de produção
    15:28
  • M2#A106 - Aplicação: editor de Markdown - servindo arquivos comprimidos com gzip
    10:00
  • M2#A107 - react dev tools - conhecendo a ferramenta
    07:23
  • M2#A108 - Aplicação: editor de Markdown - persistência de dados
    10:26
  • M2#A109 - Aplicação: editor de Markdown - removendo ações do comp. stateless
    15:38
  • M2#A110 - Aplicação: editor de Markdown - salvando automaticamente
    09:33
  • M2#A111 - Aplicação: editor de Markdown - feedback de salvamento automático
    11:46
  • M2#A112 - Aplicação: editor de Markdown - removendo do localStorage
    17:08
  • M2#A113 - Aplicação: editor de Markdown - criar arquivos MD
    13:29
  • M2#A114 - Aplicação: editor de Markdown - oportunidades de melhorias
    15:27
  • M2#A115 - Aplicação: editor de Markdown - storybook do botão
    08:06
  • M2#A116 - Aplicação: editor de Markdown - mais oportunidades de refactory
    13:28
  • M2#A117 - Aplicação: editor de Markdown - atualização do React 15 - 15.5 - 16
    11:02
  • M2#A118 - Aplicação: editor de Markdown - conhecendo a lib strclass
    11:20
  • M2#A119 - Aplicação: editor de Markdown - adicionar novo MD no localStorage
    17:08
  • M2#A120 - Aplicação: editor de Markdown - lista de arquivos MD (componente)
    08:48
  • M2#A121 - Aplicação: editor de Markdown - popular a lista de arquivos MD
    11:21
  • M2#A122 - Aplicação: editor de Markdown - remover arquivos dinamicamente
    11:13
  • M2#A123 - Aplicação: editor de Markdown - editar e adicionar arquivos no state
    03:23
  • M2#A124 - Aplicação: editor de Markdown - adicionar título para arquivos
    08:06
  • M2#A125 - Aplicação: editor de Markdown - remover entradas que não são arquivos
    05:07
  • M2#A126 - Aplicação: editor de Markdown - componente para título do arquivo
    06:20
  • M2#A127 - Aplicação: editor de Markdown - opção para editar título
    12:50
  • M2#A128 - Aplicação: editor de Markdown - usando só uma entrada no localStorage
    10:42
  • M2#A129 - Conhecendo o PureComponent
    17:09
  • M2#A130 - Introdução à context API
    13:21
  • M2#A131 - Context API - Trabalhando com informações dinâmicas
    08:33
  • M2#A132 - Context API - Resolvendo shouldComponentUpdate retornando false
    08:15
  • M2#A133 - Context API - Atualizando context à partir da emissão de eventos
    13:54
  • M2#A134 - Context API - Unsubscribe está funcionando?
    09:35
  • M2#A135 - Higher Order Component (HOC) - Entendendo o que é um HOC
    15:38
  • M2#A136 - Context API - Isolando o context usando HOC
    14:57
  • M2#A137 - Testes - Conhecendo os snapshots
    11:39
  • M2#A138 - Testes - Atualizando Jest no workflow e criando teste de snapshot
    14:51
  • M2#A139 - Aplicação: editor de Markdown - testando componentes
    10:06
  • M2#A140 - Enzyme - Testando lógica em componentes
    11:15
  • M2#A141 - Encerramento módulo #02
    02:56

  • M3#A01 - Introdução
    07:14
  • M3#A02 - O que é, e para que serve Redux?
    01:58
  • M3#A03 - Conhecendo o Redux - Primeiro princípio
    09:19
  • M3#A04 - Conhecendo o Redux - Segundo princípio
    06:55
  • M3#A05 - Conhecendo o Redux - Terceiro princípio - Funções Puras
    04:26
  • M3#A06 - Conhecendo o Redux - Terceiro princípio - Reducer
    04:23
  • M3#A07 - Primeiro contato com Redux
    08:14
  • M3#A08 - Criando nosso primeiro reducer com testes
    11:37
  • M3#A09 - Adicionando redux na aplicação Contador
    11:51
  • M3#A10 - Colocando o contador pra funcionar
    09:20
  • M3#A11 - Como funciona o createStore()?
    13:50
  • M3#A12 - "Contador" no React
    12:05
  • M3#A13 - "Contador" no React - estado no Redux
    10:03
  • M3#A14 - "Contador" no React - estado no Redux - parte 2
    11:23
  • M3#A15 - "Contador" no React - estado no Redux - parte 3
    11:33
  • M3#A16 - Adicionando mais contadores
    10:17
  • M3#A17 - Adicionando mais contadores - parte 2
    11:02
  • M3#A18 - Adicionando mais contadores - testes
    07:07
  • M3#A19 - Adicionando mais contadores - testes - parte 2
    09:19
  • M3#A20 - Adicionando mais contadores - testes - parte 3
    09:58
  • M3#A21 - Adicionando mais contadores - testes - parte 4
    09:00
  • M3#A22 - Adicionando mais contadores - componente
    15:26
  • M3#A23 - Adicionando mais contadores - action creators
    11:00
  • M3#A24 - App Todo List
    11:53
  • M3#A25 - App Todo List - Atualização do boilerplate
    10:29
  • M3#A26 - App Todo List - Atualização do storybook
    09:12
  • M3#A27 - App Todo List - Configuração: exibição de erros
    03:03
  • M3#A28 - App Todo List - Implementação inicial
    06:51
  • M3#A29 - App Todo List - Reducer para lista de todos
    10:05
  • M3#A30 - App Todo List - Reducer para lista de todos - parte 2
    13:04
  • M3#A31 - App Todo List - Reducer para lista de todos - parte 3
    06:15
  • M3#A32 - App Todo List - Implementação do reducer todos - configuração do Redux
    08:27
  • M3#A33 - App Todo List - Implementação do reducer todos - Config do React Redux
    02:57
  • M3#A34 - App Todo List - Implementação do reducer de todos - Add Todo
    19:33
  • M3#A35 - App Todo List - Implementação do reducer de todos - Lista
    03:59
  • M3#A36 - App Todo List - Implementação do reducer de todos - Toggle Todo
    13:38
  • M3#A37 - App Todo List - Implementação do reducer de visibilityFilter
    10:42
  • M3#A38 - App Todo List - Implementação do reducer de visibilityFilter - parte 2
    13:19
  • M3#A39 - App Todo List - Como usar mais de um reducer?
    11:36
  • M3#A40 - App Todo List - combineReducers
    05:07
  • M3#A41 - App Todo List - Implementação manual do combineReducers
    08:08
  • M3#A42 - App Todo List - Isolar componentes
    18:46
  • M3#A43 - App Todo List - Nomes para actions
    04:22
  • M3#A44 - App Todo List - Conectar filtro no state
    11:37
  • M3#A45 - App Todo List - Atualizar estado do filtro
    10:51
  • M3#A46 - App Todo List - Refactory no link do componente filtro
    12:07
  • M3#A47 - App Todo List - Mostrar todos filtrados
    10:52
  • M3#A48 - padrão para criação de reducers com o createReducer()
    11:15
  • M3#A49 - criando a função createReducer()
    11:55
  • M3#A50 - Busca CEP - Usando async no Redux
    07:46
  • M3#A51 - Busca CEP - Estilos CSS para aplicação
    07:23
  • M3#A52 - Busca CEP - Buscar endereço à partir de um CEP
    09:53
  • M3#A53 - Busca CEP - Populando tabela com dados do endereço
    09:13
  • M3#A54 - Busca CEP - buscando endereço à partir do form
    05:46
  • M3#A55 - Busca CEP - melhorando experiência do usuário
    10:12
  • M3#A56 - Busca CEP - criar reducer de endereços
    14:33
  • M3#A57 - Busca CEP - testes para createReducer
    12:03
  • M3#A58 - Busca CEP - testes para createReducer - parte 2
    19:54
  • M3#A59 - Busca CEP - passando state do endereço do Redux para a aplicação
    12:10
  • M3#A60 - Busca CEP - passando dispatch como props
    08:20
  • M3#A61 - Busca CEP - initialState da aplicação
    08:46
  • M3#A62 - replaceReducer - hot reload para reducers
    05:34
  • M3#A63 - Busca CEP - extendendo o Redux com middlewares
    11:58
  • M3#A64 - Busca CEP - entendendo o poder dos middlewares
    19:17
  • M3#A65 - Busca CEP - ações assíncronas no app com Redux - configuração da store
    14:21
  • M3#A66 - Busca CEP - ações assíncronas no app com Redux
    15:04
  • M3#A67 - Busca CEP - ações assíncronas no app com Redux - isFetching no Redux
    15:42
  • M3#A68 - Busca CEP - usando mais de um store enhancer no Redux
    14:11
  • M3#A69 - Busca CEP - como funciona o compose?
    15:55
  • M3#A70 - Reactflix - Instruções para criação do nosso app
    03:39
  • M3#A71 - Reactflix - Setup inicial da aplicação
    15:27
  • M3#A72 - Reactflix - Estrutura base da aplicação
    13:04
  • M3#A73 - Reactflix - Lista de vídeos
    15:17
  • M3#A74 - Reactflix - Melhorando estilo do componente de vídeo
    11:50
  • M3#A75 - Reactflix - Single de vídeo
    10:55
  • M3#A76 - Reactflix - Firebase
    09:53
  • M3#A77 - Reactflix - Lendo dados do Firebase
    15:51
  • M3#A78 - Reactflix - Adicionando dados do Firebase
    07:16
  • M3#A79 - Reactflix - Editando dados do Firebase
    05:31
  • M3#A80 - Reactflix - Removendo dados do Firebase
    06:10
  • M3#A81 - Reactflix - Remover firebase global
    11:26
  • M3#A82 - Reactflix - Criar formulário de cadastro do vídeo
    06:05
  • M3#A83 - Reactflix - Criar ação de adicionar vídeo
    12:03
  • M3#A84 - Reactflix - Adicionar Vídeo dinamicamente
    11:17
  • M3#A85 - Reactflix - Salvar vídeo no Firebase
    08:03
  • M3#A86 - Reactflix - Limpar formulário após salvar vídeo
    09:52
  • M3#A87 - Reactflix - Opção para abrir / fechar formulário de cadastro
    10:39
  • M3#A88 - Reactflix - Extrair Header e Footer do App
    10:34
  • M3#A89 - Reactflix - Reducer de UI
    15:31
  • M3#A90 - Reactflix - Pegar dados cadastrados no Firebase
    15:41
  • M3#A91 - Reactflix - Link para vídeos na listagem
    08:59
  • M3#A92 - Reactflix - Abrir vídeo na single ao clicar
    12:32
  • M3#A93 - Reactflix - Ordenar conteúdo que vem do Firebase
    17:46
  • M3#A94 - Encerramento do módulo #03
    06:06

  • M4#A01 - Introdução
    06:11
  • M4#A02 - Instalação do React Router
    10:07
  • M4#A03 - Componentes principais do React Router
    12:39
  • M4#A04 - Criando mais de uma rota
    09:43
  • M4#A05 - Problema na configuração do webpack do boilerplate
    07:53
  • M4#A06 - Rotas dinâmicas - passando parâmetros na rota
    12:17
  • M4#A07 - Conceitos de SPA - o request de uma rota
    13:18
  • M4#A08 - Conceitos de SPA - History API
    11:57
  • M4#A09 - Conceitos de SPA - History API - evento onpopstate
    11:01
  • M4#A10 - Conceitos de SPA - History API - método replaceState
    09:36
  • M4#A11 - Conceitos de SPA - History API - resolvendo problema reload da página
    06:15
  • M4#A12 - Component Switch e Erro 404
    09:34
  • M4#A13 - Rotas dinâmicas - definindo rotas específicas
    09:16
  • M4#A14 - NavLink - componente especial para navegação
    12:29
  • M4#A15 - Route - prop "render"
    09:19
  • M4#A16 - Route - prop "children"
    12:29
  • M4#A17 - React Pattern - Render Props
    07:46
  • M4#A18 - Route Props - match e parâmetros opcionais
    14:05
  • M4#A19 - Route Props - location (pathname e key)
    09:52
  • M4#A20 - Route Props - location (hash)
    05:45
  • M4#A21 - Route Props - location (search)
    10:13
  • M4#A22 - Route Props - location (state)
    10:09
  • M4#A23 - Route Props - history (location e length)
    08:40
  • M4#A24 - Route Props - history (método push)
    07:07
  • M4#A25 - Route Props - history (método replace)
    03:25
  • M4#A26 - Route Props - history (action)
    05:39
  • M4#A27 - Route Props - history (navegação no history)
    06:37
  • M4#A28 - Componente Redirect
    11:43
  • M4#A29 - Componente Prompt
    05:50
  • M4#A30 - withRouter()
    08:36
  • M4#A31 - <HashRouter />
    06:17
  • M4#A32 - Problemas conhecidos - Rota que não renderiza
    09:42
  • M4#A33 - Informações iniciais sobre a aplicação React-zzaria
    09:28
  • M4#A34 - React-zzaria - iniciando o projeto
    09:41
  • M4#A35 - React-zzaria - Entendendo variáveis de ambiente (.env)
    06:47
  • M4#A36 - Novidades do React v16 - Fragment
    09:24
  • M4#A37 - Novidades do React v16 - lazy e Suspense
    18:04
  • M4#A38 - React-zzaria - Tratamento de erros em componentes (Error Boundaries)
    14:44
  • M4#A39 - React-zzaria - "Logar" mensagens de erro (Error Boundaries)
    07:07
  • M4#A40 - React-zzaria - Limpando o CRA (dependências exatas)
    09:55
  • M4#A41 - React-zzaria - Limpando o CRA (removendo arquivos desnecessários)
    04:41
  • M4#A42 - React-zzaria - Adicionando configs. básicas (.editorconfig e linter)
    12:41
  • M4#A43 - React-zzaria - Extendendo configurações do CRA sem ejetar
    07:08
  • M4#A44 - React-zzaria - Corrigindo erros de lint
    11:20
  • M4#A45 - React-zzaria - Arquitetura da aplicação: rotas iniciais
    12:53
  • M4#A46 - React-zzaria - Rotas internas no MainPage
    07:00
  • M4#A47 - React-zzaria - Usando alias no CRA
    04:26
  • M4#A48 - React-zzaria - Dependências de UI e configs iniciais de estilo
    09:32
  • M4#A49 - React-zzaria - Marcação para tela de login
    09:43
  • M4#A50 - React-zzaria - Grid na tela de login
    14:20
  • M4#A51 - React-zzaria - Estilos para tela de login (alinhamento)
    07:31
  • M4#A52 - React-zzaria - Estilos para tela de login (botão)
    11:32
  • M4#A53 - React-zzaria - propriedade attrs do styled components
    03:14
  • M4#A54 - React-zzaria - Melhorando estilo do botão
    05:25
  • M4#A55 - React-zzaria - Autenticação: Criação do projeto no Firebase
    10:45
  • M4#A56 - React-zzaria - Autenticação: Configurar firebase no app
    05:30
  • M4#A57 - React-zzaria - Login do usuário
    08:17
  • M4#A58 - React-zzaria - Persistência de dados e informações do usuário logado
    09:22
  • M4#A59 - React-zzaria - Deslogar usuário
    11:35
  • M4#A60 - Novidades do React v16.8 - Hooks
    04:59
  • M4#A61 - React Hooks - conhecendo o useState
    12:14
  • M4#A62 - React Hooks - useState: atualizar com base no estado anterior
    05:39
  • M4#A63 - React Hooks - useState: estados complexos
    05:05
  • M4#A64 - React Hooks - useState: arrays e objetos
    08:29
  • M4#A65 - React Hooks - efeitos colaterais
    06:37
  • M4#A66 - React Hooks - useEffect: atualização condicional
    07:10
  • M4#A67 - React Hooks - useEffect: executando somente uma vez
    07:37
  • M4#A68 - React Hooks - Criando Hooks personalizados
    05:27
  • M4#A69 - React Hooks - useEffect: simulando o componentWillUnmount
    04:41
  • M4#A70 - React Hooks - Regras para uso dos Hooks
    05:16
  • M4#A71 - React-zzaria - Trocar class por hooks na página de login
    09:15
  • M4#A72 - React-zzaria - Otimização de callbacks
    09:07
  • M4#A73 - React-zzaria - Importar páginas com lazy e Suspense
    10:25
  • M4#A74 - React-zzaria - Isolar configuração do firebase
    04:42
  • M4#A75 - Novidades do React v16 - Context API
    14:07
  • M4#A76 - React-zzaria - Estrutura inicial para dados do usuário na Context API
    12:09
  • M4#A77 - React-zzaria - Dados do usuário na Context API (login)
    05:51
  • M4#A78 - React-zzaria - Dados do usuário na Context API (App)
    11:00
  • M4#A79 - React-zzaria - React-zzaria - Regras de redirects pré/pós autenticação
    15:29
  • M4#A80 - React-zzaria - Evitar redirects desnecessários
    13:02
  • M4#A81 - React-zzaria - Refatorar regras de redirects
    05:38
  • M4#A82 - React-zzaria - Página inicial (header)
    11:16
  • M4#A83 - React-zzaria - Página inicial (parte 2 - header)
    04:14
  • M4#A84 - React-zzaria - Página inicial (CSS do header)
    05:17
  • M4#A85 - React-zzaria - Página inicial (regras lógicas no header)
    10:43
  • M4#A86 - React-zzaria - Página inicial - mover logo para diretório comum
    01:54
  • M4#A87 - React-zzaria - Adicionar hot-loader no CRA
    08:27
  • M4#A88 - React-zzaria - Página inicial (conteúdo)
    08:15
  • M4#A89 - React-zzaria - Como usar Temas no Material U
    17:56
  • M4#A90 - React-zzaria - Marcação do conteúdo da página principal
    11:31
  • M4#A91 - React-zzaria - Estilo para página principal
    08:49
  • M4#A92 - React-zzaria - Estilo para página principal (imagem da pizza)
    11:23
  • M4#A93 - React-zzaria - Estilos para página principal (responsivo)
    08:46
  • M4#A94 - React-zzaria - helper para singular e plural
    04:28
  • M4#A95 - React-zzaria - Refactoring: isolando componentes (Header)
    13:29
  • M4#A96 - React-zzaria - Refactoring: abstração das informações do usuário
    08:14
  • M4#A97 - React-zzaria - Refactoring: estrutura para páginas internas
    09:51
  • M4#A98 - React-zzaria - Refactoring: organizar dados fake
    06:29
  • M4#A99 - Refactoring: atualização de dependências e correção de erros
    24:34
  • M4#A100 - React-zzaria - Preparar navegação para tela de escolha de sabores
    08:09
  • M4#A101 - React-zzaria - rota para escolha de sabores da pizza
    16:53
  • M4#A102 - React-zzaria - Refactoring: abstrair nomes das rotas
    12:37
  • M4#A103 - React-zzaria - Página "Escolha de sabores"
    25:04
  • M4#A104 - React-zzaria - Estrutura de dados para sabores das pizzas
    09:27
  • M4#A105 - React-zzaria - Marcação da listagem de sabores
    16:57
  • M4#A106 - React-zzaria - Listagem de sabores (alinhamento e link)
    08:39
  • M4#A107 - React-zzaria - Regras para seleção de sabores
    12:11
  • M4#A108 - React-zzaria - Regras seleção de sabores (selecionar quantidade certa)
    13:45
  • M4#A109 - React-zzaria - Regras para seleção de sabores (estilo da seleção)
    05:38
  • M4#A110 - React-zzaria - Tema do Material UI no styled-components
    07:30
  • M4#A111 - React-zzaria - Variáveis do tema do Material UI em todo o app
    20:05
  • M4#A112 - React-zzaria - Apresentação dos valores de moeda (helper)
    08:15
  • M4#A113 - React-zzaria - Estrutura inicial do footer
    13:57
  • M4#A114 - React-zzaria - Deixar o footer sempre no rodapé
    07:21
  • M4#A115 - React-zzaria - Ajustar estilo quebrado dos styled components
    07:41
  • M4#A116 - React-zzaria - Elementos internos do footer (Grid para os itens)
    03:42
  • M4#A117 - React-zzaria - Área do pedido no footer
    09:05
  • M4#A118 - React-zzaria - Área com botões de ação no footer
    07:29
  • M4#A119 - React-zzaria - Abstrair informações de auth para Hook customizado
    12:23
  • M4#A120 - React-zzaria - Criar página de escolha de quantidade
    07:05
  • M4#A121 - React-zzaria - Marcação inicial da página de escolha de quantidade
    08:28
  • M4#A122 - React-zzaria - Mover footer para reutilização
    11:43
  • M4#A123 - React-zzaria - Botões dinâmicos no footer
    05:53
  • M4#A124 - React-zzaria - Adicionar Footer na página de quantidade
    05:18
  • M4#A125 - React-zzaria - Informação de sabores no footer
    19:55
  • M4#A126 - React-zzaria - Ajustar botão de "voltar" no footer
    09:21
  • M4#A127 - React-zzaria - Não permitir passar sem selecionar sabor
    03:46
  • M4#A128 - React-zzaria - Alinhar botões no footer
    02:10
  • M4#A129 - React-zzaria - Redirecionar para home se não houver