ReactJS
5.0 (3 ratings)
Instead of using a simple lifetime average, Udemy calculates a course's star rating by considering a number of different factors such as the number of ratings, the age of ratings, and the likelihood of fraudulent ratings.
4 students enrolled
Wishlisted Wishlist

Please confirm that you want to add ReactJS to your Wishlist.

Add to Wishlist

ReactJS

Crie aplicações completas em ReactJS sem precisar programar nada no servidor.
5.0 (3 ratings)
Instead of using a simple lifetime average, Udemy calculates a course's star rating by considering a number of different factors such as the number of ratings, the age of ratings, and the likelihood of fraudulent ratings.
4 students enrolled
Created by Tulio Faria
Last updated 7/2017
Portuguese
Price: $115
30-Day Money-Back Guarantee
Includes:
  • 12.5 hours on-demand video
  • Full lifetime access
  • Access on mobile and TV
  • Certificate of Completion
What Will I Learn?
  • criar aplicativos web com atualizações em tempo real sem precisar programar nada no servidor
View Curriculum
Requirements
  • Noções básicas de programação e de HTML/CSS
Description

Aprenda a criar aplicações single-page completas e totalmente em ReactJS sem precisar programar nada no servidor. Você criará sistemas prontos para serem entregues para o cliente ou para validar aquela sua ideia e criar o MVP do seu app.

O curso conta com projetos práticos que te fazem ganhar confiança e experiência em ReactJS, permitindo que você veja como aplicar cada conceito em um projeto real., utilizando o que há de mais moderno como Continuous Integration, Continuous Deployment e Redux.

ReactJS / React.JS / Redux

Who is the target audience?
  • Desenvolvedores que queiram aprender a utilizar ReactJS de maneira profissional
Students Who Viewed This Course Also Viewed
Curriculum For This Course
87 Lectures
12:15:46
+
Comece por aqui
1 Lecture 02:59
+
Preparando o ambiente de desenvolvimento
6 Lectures 15:26



Preparando seu ambiente (Linux/Ubunto)
02:56

Instalando a extensão do React DevTools no Chrome/Firefox
01:00

Configurando o Sublime para reconhecer ES6/JSX
03:15
+
Introdução ao ReactJS
4 Lectures 39:35
Componentes
09:43

O que é o ReactJS?
08:18

Primeiro componente ReactJS em ES5
10:35

Criando um projeto em ReactJS e primeiro componente em ES6
10:59
+
Projeto 1: Sistema de Comentários
14 Lectures 02:07:13
Sobre o Projeto 1: Sistema de Comentários
04:56

Sobre o Firebase
03:08

Criando o Projeto
09:15

Primeiros Componentes
06:36

O state de um component e a criação de novos comentários
14:54

Utilizando o valor do textarea
05:41

Criando o component Comment e organizando os comentários
10:09

Reescrevendo o component Comment como Functional Stateless Component
05:11

Pessoal, houve uma mudança na forma como o re-base é inicializado. Agora devemos linkar o Firebase separadamente, mas ainda é bem tranquilo para utilizarmos.

Basta adicionar mais uma dependência (npm install --save firebase ou yarn add firebase) e deixar o arquivo base.js parecido com este:

import Rebase from 're-base'
import firebase from 'firebase'

const firebaseApp = firebase.initializeApp({
  apiKey: "",
  authDomain: "xxx",
  databaseURL: "xxx",
  storageBucket: "xxx",
  messagingSenderId: "xxx"
})
const db = firebase.database(firebaseApp)
const base = Rebase.createClass(db)

export const providers = {
  'facebook': new firebase.auth.FacebookAuthProvider()
}

export const auth = firebaseApp.auth()
export default base

Ps: iremos regravar esta aula para que o formato da inicialização esteja coerente com a versão mais atual :)

Integrando o Firebase-Database ao ReactJS (favor, ler observações que estão junt
11:47

Testes Unitários 01: Começando os testes do App.js com Enzyme
15:37

Testes Unitários 02: Testando o método postNewComment e Injeção de Dependência
08:51

Testes Unitários 03: Cobertura de código
15:22

Testes Unitários 04: Completando os testes dos demais componentes (Comment e Com
07:32

Fazendo o build da aplicação e colocando-a em Produção
08:14
+
Projeto 1: Autenticação de Usuários no sistema de Comentários
4 Lectures 24:50
Configurando o Firebase para autenticação
08:51

Integrando ao Login do Facebook
02:40

Pessoal, por favor considerem as seguintes mudanças:

No index.js, importar e injetar o auth e providers:

import React from 'react'
import ReactDOM from 'react-dom'
import App from './App'
import base, { auth } from './base'
ReactDOM.render(
  <App base={base} auth={auth} providers={providers} />,
  document.getElementById('root')
)

No App.js, mudar o handler se o usuário está logado para:

    this.props.auth.onAuthStateChanged((user)=>{
      if(user){
        this.setState({ isLoggedIn: true, user })
      }else{
        this.setState({ isLoggedIn: false, user: {} })
      }
    })

Mudar também no App.js:

  auth(provider){
    this.props.auth.signInWithPopup(this.props.providers[provider])
  }

Trocar o botão deslogar por:

<button onClick={() => this.props.auth.signOut()}>Deslogar</button>
Criando o botão "Logar com Facebook" (favor, ler observações que estão junto a a
08:47

Vinculando o comentário ao usuário autenticado
04:32
+
Projeto 2: Gerenciador de Produtos
19 Lectures 03:04:37
O que iremos construir? Navegação em SPAs
02:01

Preparando o projeto
03:52

Estrutura Inicial
03:47

Configurando a Primeira Rota
07:38

A rota produtos
07:53

Mapeando Categorias e usando os parâmetros da URL
04:46

Recuperando os parâmetros/valores da URL
01:27

Carregando os dados de categorias do servidor
13:40

Carregando os dados de produtos do servidor
14:43

Criando categorias
09:17

Removendo categorias
06:08

Organizando a API
06:31

Organizando o código
20:38

Editando Categorias
17:18

Criando Produtos
17:41

Redirecionamento entre rotas
04:10

Organizando o projeto (Componente Categoria)
15:18

Removendo Produtos
07:20

Editando produtos
20:29
+
Git
6 Lectures 45:38
Introdução ao Git
15:08

Iniciando um repositório e fazendo push para o GitHub
12:33

Git pull e checkout (como recuperar um arquivo)
04:22

Corrigindo conflitos
07:14

Git Clone
03:08

Adicionando todos os arquivos e ignorando (.gitignore)
03:13
+
Bônus: Integração e entrega contínua
4 Lectures 39:59
O que é CI/CD (continous integration/continuous deployment)?
10:19

Configurando um repositório para o projeto
04:57

Criando o projeto no Codeship e fazendo as primeiras configurações
07:34

Finalizando o deploy com o Codeship
17:09
+
Bônus: Redux
12 Lectures 01:22:36
Introdução ao Redux
08:21

Redux na prática (sem ReactJS)
07:36

Projeto Contador: 01 - Criando o projeto React com Redux do zero
19:06

Projeto Contador: 02 - Reorganizando o projeto
04:49

Redux - DevTools
04:07

Redux-Logger
03:08

Action Creators
04:20

Tests: Action Creators
03:52

Test: Reducer
04:20

Test: Componente DisplayCounter
05:19

Test: Componente Counter
09:56

DefaultProps e PropTypes
07:42
+
Bônus: Redux - Thunk
5 Lectures 53:30
Redux assíncrono - Preparando o Projeto
16:31

Redux-Thunk - Carregando Dados de uma API
11:22

Redux-Thunk - Tratando erros
03:28

CombineReducers
12:25

Testes Unitários de Actions Assíncronas
09:44
3 More Sections
About the Instructor
Tulio Faria
5.0 Average rating
3 Reviews
4 Students
1 Course
Fullstack Developer

Tulio Faria é mestre em Sistemas de Informação pela USP e criador do DevPleno. Iniciou sua carreira como professor ainda jovem, com apenas 18 anos em um curso técnico; depois disso, foram 11 anos em sala de aula formando desenvolvedores fullstack no sul de Minas Gerais. Hoje, é empresário e também atua em uma empresa de grande porte do exterior. 

Em 2017, resolveu se dedicar ainda mais ao projeto que sonhou por anos, o DevPleno, cujo objetivo é auxiliar profissionais de tecnologia a alcançarem sucesso em suas carreiras por meio de conteúdo de qualidade e de fácil clareza.