Somos uma empresa de tecnologia do segmento digital, especializada na gestão de eventos e infroprodutos. Ajudamos pessoas e empresas na organização, gestão e comercialização de eventos digitais e físicos por meio da nossa plataforma Ticket and Go.
Desenvolva um catálogo de produtos simples que mostre produtos da Fake Store API. Ao clicar em um produto, o usuário deve ver uma modal ou página de detalhes com mais informações. Este projeto deve ser implementado uma vez em React e uma vez em Vue.
- NodeJS - Ambiente de execução JavaScript
- NextJS - Framework web TypeScript para front-end
- Nuxt 3 - Framework web TypeScript para front-end
- Tailwind CSS - Framework para estilização
- Atomic Design - Metodologia para o design system
- Fake Store API - Api dos produtos
- Escolha o projeto
Ambos os projetos possuem a mesma configuração para instalar e rodar as aplicações.
Basta escolher o projeto através do comando:
cd [diretorio do projeto escolhido]- Instale as dependências do projeto.
yarn install- Inicie o projeto em um servidor de desenvolvimento http://localhost:3000 e veja o resultado em seu browser preferido.
yarn dev- Liste os produtos obtidos da Fake Store API(https://fakestoreapi.com/docs), mostrando pelo menos a imagem, o nome e o preço de cada produto.
- Implemente um design responsivo simples para a lista de produtos.
- Ao clicar em um produto, exiba uma modal ou navegue para uma página de detalhes mostrando mais informações do produto (por exemplo, descrição, categoria).
- Permita fechar a modal ou voltar à lista de produtos facilmente.
- Inclua um README simples que explique como rodar cada projeto, as decisões de design tomadas e qualquer outra informação que considere relevante.
- Adicione a funcionalidade que permite aos usuários adicionar produtos ao carrinho a partir da lista de produtos ou da página de detalhes.
- Exiba um ícone ou link para o carrinho que mostre a quantidade de itens no carrinho. Este indicador deve ser atualizado dinamicamente conforme itens são adicionados ao carrinho.
- (Opcional) Crie uma página ou modal para o carrinho onde os usuários possam ver os itens adicionados, com opções para remover itens ou limpar o carrinho inteiro.