Projeto-3.md

Projeto 4 - Empório da Cerveja

Backend aqui: https://github.com/jenicarvalho/fake-api-emporio

Páginas -> Cadastro, Home e Carrinho

• Cadastro

  • enviar: name, email, password, age (api: http://localhost:4000/register)
  • Caso a idade seja menor que 18 avisar e não deixar entrar
  • Caso seja maior de 18 anos e o cadastro seja feito com sucesso, guarde o token no localStorage e redirecione para a home

• Home

  • Não permitir acessar se não tiver token
  • Redirecionar para a tela de cadastro se não tiver token
  • Listar as categorias (api: http://localhost:4000/categories)
  • Listar as bebidas (api: http://localhost:4000/beers)
  • Ao clicar em "comprar":
    • adicionar o item ao redux
    • somar + 1 no icone do carrinho do header
    • redirecionar para a página carrinho

• Carrinho

  • Listar os itens adicionados (nome, quantidade e valor)
  • Permitir alterar a quantidade (isso altera no redux)
  • Permitir excluir um item do carrinho (isso exclui o item do redux)
  • Ao avançar mostrar mensagem "Seu pedido foi realizado" e limpar o redux

Componentes

• Header
  • Componente header deverá aparecer em todas as páginas e ali mostrará a quantidade de itens no carrinho.

CSS e JSX

• Crie seu próprio CSS e JSX
• Pode usar sass, css, bootstrap, styled componentes o que preferir

Usar Duck Pattern para o Redux

Dependências do projeto

• axios react-router-dom @types/react-router-dom react-redux redux
• se for usar sass: node-sass

Happy coding!

Faça o melhor que conseguir!