Página web criada para cumprir o desafio técnico da MKS Sistemas.
O objetivo principal desse teste é avaliar sua capacidade de escrever código limpo, bem testado e reutilizável. Ao terminar, faça o deploy da aplicação e mande-nos o link.
Para esse desafio, você deve consumir nossa API REST de produtos para exibir a lista de produtos da loja.
A aplicação deve conter apenas uma página/rota e um carrinho.
-
Loja: A lista de produtos deve ser buscada de nossa API, use um shimmer/skeleton enquanto estiver em loading.
-
Carrinho: O carrinho deve conter todos os produtos selecionados, juntamente com a opção de aumentar a quantidade de cada produto selecionado.
Utilizar Jest e a testing-library para realizar os testes unitários.
O usuário deverá conseguir:
- Navegar pelos produtos disponibilizados após o consumo da API;
- Escolher quais produtos quer acrescentar em seu carrinho de compras;
- Abrir o modal 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 finalizar a compra através do botão;
- Não deverá conseguir finalizar a compra com o carrinho vazio;
- React;
- Typescript;
- Styled Components;
- Redux;
- JEST;
- Hooks useState, useEffect;
- Componentes Reutilizáveis;
- Animações com o animate;
🟢 Integração de API com o front-end
🟢 Integração entre componentes instantaneamente com o Redux
🟢 Testes com o JEST
🟢 Estilização com StyledComponents