Página web criada para praticar o gerenciamento de estados globais com ContextAPI.
O objetivo principal deste projeto é aprender sobre as funcionalidades do ContextAPI, através da criação de uma página de feira de verduras, onde o usuário poderá adicionar ao carrinho e finalizar a compra. O site é completamente responsivo.
O usuário deverá conseguir:
- Validar seu nome e o saldo disponível para a compra;
- Escolher quais produtos quer acrescentar em seu carrinho de compras;
- Verificar a quantidade total de itens ao lado do botão do carrinho de compras, localizado no cabeçalho;
- Acessar a página do carrinho de compras através do botão no cabeçalho;
- Navegar pelos produtos selecionados, com a opção de aumentar ou diminuir a quantidade, bem como excluir algum produto do carrinho;
- Acompanhar o valor total da compra de forma simultânea e selecionar a forma de pagamento;
- Verificar o preço total com juros, o saldo disponível e o saldo que restará após a compra;
- Não deverá conseguir finalizar a compra com o carrinho vazio ou com saldo insuficiente;
Confira o projeto em funcionamento através do link
- React
- JavaScript
- Styled Components
- ContextAPI
- Hooks useEffect, useState e useHistory
- Hooks personalizados;
🟢 Manipulação de estados globais com o ContextAPI
🟢 Como criar hooks que atendam a necessidade do projeto conforme o contexto
🟢 Como utilizar o useHistory para avançar para próxima página ou voltar