Skip to content

🛒 E-commerce de camisetas com estampas divertidas relacionadas ao espaço

Notifications You must be signed in to change notification settings

matheusqueirozds/labe-commerce

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

2 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Labecommerce

🩺 E-commerce de camisetas com estampas divertidas relacionadas ao espaço


MIT License

Clique aqui para acessar o deploy do projeto


🎓 Autor


🎨 Documentação de cores

Cor Hexadecimal
cor-1 #00acb7
cor-2 #e9eae9
cor-3 #3b3a38
cor-4 #ffffff

✅ Funcionalidades

Seguem as principais features acrescentadas nesse projeto:

  • O usuário consegue visualizar uma lista de produtos
  • O usuário consegue visualizar os dados do produto (nome, preço e imagem)
  • O usuário consegue adicionar um produto no carrinho
  • O usuário consegue visualizar os produtos adicionados
  • O usuário consegue visualizar a quantidade correta de cada produto
  • O usuário consegue remover itens do carrinho
  • O usuário consegue ver corretamente o valor total de sua compra
  • O usuário consegue filtrar os itens por preço mínimo
  • O usuário consegue filtrar os itens por preço máximo
  • O usuário consegue realizar uma busca por nome
  • O usuário consegue ordenar os itens em ordem crescente ou decrescente
  • O usuário consegue adicionar filtros, busca e ordenação simultaneamente
  • O usuário consegue retornar à visualização sem filtros

🚫 Roadmap

Seguem as implementações a serem adicionadas nesse projeto:

  • Quando a página for atualizada, os itens deverão continuar no carrinho

🎯 Aprendizados

  • Componentes Funcionais e Props
  • Estados e Imutabilidade
  • Styled-Components
  • Renderização de listas
  • Busca, Filtros e ordenação

🔄 Rodando o projeto localmente

Clone o projeto via HTTPS

  git clone https://github.com/matheusqueirozds/labe-commerce.git

Entre no diretório do projeto

  cd labe-commerce

Instale todas as dependências abaixo:

  npm i styled-components

Inicie o servidor

  npm run start

🤹🏾‍♂️ Stacks utilizadas

  • React JS

🔳 Screenshots

Sobre