Nesta tarefa, o candidato deverá inicializar um projeto utilizando NEXT.js e realizar um sistema de listagem de produtos e carrinho de compras.
-
Inicialização do Repositório
- Inicialize um projeto Next.js.
- Utilize TypeScript.
- Configure uma estrutura básica de arquivos para páginas, componentes e serviços. (domain -> api, service, types, adapter)
-
Listagem de Produtos
- Crie uma página de listagem de produtos usando a API Fake Store, implementando a funcionalidade de paginação infinita para carregar mais produtos à medida que o usuário rola a página.
- As requisições para listar os produtos devem ser feitas utilizando React Query.
- Utilize Axios para realizar as requisições HTTP.
-
Carrinho de Compras
- Implemente a funcionalidade de adicionar e remover produtos no carrinho.
- Gerencie o estado do carrinho de compras utilizando Zustand.
- O estado do carrinho deve ser persistido para que o usuário não perca os itens ao recarregar a página.
- Requisicao realizada via SSR.
- Testes e2e
- Layout responsivo
- Utilize a biblioteca Framer para adicionar animações em botões e outros elementos interativos na página.