README.md

Projeto desenvolvido durante a Imersão React da Alura para criação de site inspirado na Netflix.

Aulas

• Aula 1 - React Components e AluraFlix
• Aula 2 - Roteamento e State
• Aula 3 - Formulários reutilizáveis e mais components
• Aula 4 - Ajax, validação e o back-end
• Aula 5 - Gerenciamento de videos com React e JavaScript

Tecnologias utilizadas

• JavaScript;
• React;
• React-Router-DOM;
• Styled-Components;

Deploy

O site foi hospedado no site da Vercel através do link: https://aluraflix-john.vercel.app/

O back-end da aplicação foi hospedado na nuvem da Heroku.

---

Aula 1

• Conteúdo
  • Criação do projeto;
  • Instalação do Styled Components;
  • Criação de components;
  • Criação da page Home;
  • Deploy do projeto;
• Para criar um ambiente com React, usar o seguinte código no terminal:

npx create-react-app [nome do app]

• Para iniciar um ambiente com React, usar o seguinte código no terminal:

npm start

• Abrir http://localhost:3000/ no navegador para visualizar a aplicação.

---

Aula 2

• Conteúdo
  • Instalação do React Router DOM;
  • Integração do Browser Router, Switch e Route para SPA;
  • Instalação do React-Slick;
  • Criação das pages CadastroVídeo e CadastroCategoria;
• Para instalar o React Router DOM, usar o seguinte código no terminal:

npm install react-router-dom

• Para instalar o React-Slick, usar o seguinte código no terminal:

npm install react-slick

---

Aula 3

• Conteúdo
  • Atualização do CadastroCategoria;
  • Implementação de formulários;

---

Aula 4

• Conteúdo
  • Instalação do ESLint;
  • Integração dos PropTypes;
  • Instalação do Json Server;
  • Instalação do Concurrently;
• Para instalar o ESLint, usar o seguinte código no terminal:

npx eslint --init

• Para instalar o PropTypes, usar o seguinte código no terminal:

npm install prop-types

• Para instalar o Json Server, usar o seguinte código no terminal:

npm install json-server

• Para instalar o Concurrently, usar o seguinte código no terminal:

npm install concurrently

---

Aula 5

• Conteúdo
  • Organização de projeto;
  • Atualização do CadastroVídeo;
  • Criação de repositórios e adição funcional de categorias e vídeos;

---