/photogram

Image shop developed in an e-commerce style

Primary LanguageTypeScript

Processo Seletivo para a Liven Tech

Por Giulia Santos

🔧 Como rodar o projeto

  1. Instale as dependências do projeto rodando o seguinte comando:

yarn

  1. Execute o projeto com o seguinte comando:

yarn start

Não esqueça de se certificar que as extensões do ESLint e Prettier estão instaladas no seu Editor de Texto e ativadas no projeto.


🖼️ Layout

O layout está disponivel no Figma

💻 Demo

Você consegue ver a aplicação rodando aqui, o deploy é feito via Firebase Hosting

Para o deploy no Firebase é necessário ter o Firebase CLI instalado.

📋 Especificações

  • React 17.0.2
  • TypeScript 4.3.5
  • Node 12.16.2
  • Yarn 1.22.1

⚙️ Configurações


📝︎ Extensões recomendadas para o VSCode


📝 Próximas Features

  • Paginação na tela de produtos
  • Select de ordem na tela de produtos, exemplo: ordem alfabetica, preço...
  • Ajustar responsividade para ficar bonito em telas menores
  • Finalizar carrinho
  • Favoritos: adicionar e remover

🪧 Texto Inicial

Enunciado Desenvolver uma loja simples em React, com um catálogo de produtos e um carrinho de compras. O usuário deve poder adicionar/remover produtos do catálogo no carrinho de compras.

Especificações Tela de produtos 🎁 Será responsável por apresentar todos os produtos disponíveis para o usuário em uma lista. Será necessário que você estabeleça comunicação com o back-end, para obter informações relativas a cada um dos produtos.

Requisição HTTP para pegar a lista de produtos: GET https://5d6da1df777f670014036125.mockapi.io/api/v1/product

Tela do carrinho de compras 🛒 Responsável por guardar os itens e quantidades adicionadas pelo usuário. É desejável que o usuário possa aumentar ou diminuir a quantidade de um produto do carrinho, além de remover por completo.

Extra: Testes automatizados ✅ Criação de suite de testes automatizados para o repositório. Sobre a entrega Estimativa de tempo para entrega: O primeiro ponto de entrega deste projeto é o próprio tempo de estimativa para a entrega final do projeto. Apresentação de 30 minutos (3ª etapa do processo): Durante a apresentação, é importante demonstrar o funcionamento da aplicação, assim como trazer as motivações para cada escolha do projeto. Demonstrações de trechos importantes do código também são valiosas! Cópia do repositório: O repositório será entregue para avaliação da estrutura do projeto. Por isso, quaisquer pontos de documentação/comentários em código são bem vindos. Boa sorte!