Criando o projeto

npx create-react-app todo

cd todo

yarn start

Remover arquivos desnecessários

Renomear title no diretório public (index.html)

Explicar div root do react

Apresentando estrutura do projeto

Mostrando os scripts dentro do package.json (start, build e eject)

--- Preparar API

npm install -g json-server

Startando o servidor da API

Criando arquivo db.json

json-server --watch db.json --port 3333

Instalando o Insomnia

Setando base_url para localhost:3333

Criando o List (GET) de Tarefas

Criando o Create (POST) de Tarefas

--- Construindo a aplicação

Criando rotas

yarn add react-router-dom

Criar diretório pages dentro de src

Criar componente Dashboard

Criar componente Tarefas

Criar diretório routes dentro de src

Importar Dashboard e Tarefas dentro de routes/index.js

Atualizar App.js -> importar Routes e em seguida o BrowserRouter

No routes/index.js mostrar sem o switch

No routes/index.js incluir o exact

Estilizando o App

CSS inline

Importar arquivo CSS

Mostrar resultado no inspect e comparar divs com fragment

Utilizando o Styled Components

apresentar -> template string

benefício de usar styled components -> Não compartilha o CSS com outros componentes da aplicação

Criar arquivo CSS global

Importar arquivo CSS global no App.js

Explicar encadeamento CSS

Criar Form

Instalar react-icons

Consumir API

Lidando com erros - try/catch

Finalizando tarefas

Removendo tarefas

Criando menu e Navegando entre páginas

Componentizando o Header

Criando o Dashboard

Autenticação

hook

inserir login e logout na aplicação

rotas autenticadas