fonchaves / ecommerce-challenge

A simple App e-commerce with React Native

🤖 Amcom Challenge - Teste de seleção Mobile Developer

Desafio

Desenvolver um aplicativo para um E-commerce.

Features

• Dependências mais recentes e atualizadas

✔️ Itens do desafio cumpridos

1. Tela de Listagem de Produtos

• Será possível ver os produtos da loja

• Campo que aparecerão em cada item

  • Imagem do principal produto
  • Nome do Produto
  • Preço do Produto
  • Desconto (se houver)
  • Média das avaliações de quem consumiu
  • Botão de Compra (redireciona para o carrinho de compra)
  • Botão de Adicionar ao Carrinho de Compras
  • Se já tiver no carrinho de compras terá o botão de remover do carrinho

• Haverá um filtro por nome do produto

• Haverá ordenação por preço

• Haverá paginação dos produtos (usuário verá no máximo 10 produtos em cada página)

• Disponha os componentes de maneira que melhore a experiência do usuário

• Ao selecionar um produto o usuário irá para tela de detalhes do Produto

2. Tela de Detalhe do Pedido

• O usuário irá ver

  • Imagem do principal produto
  • Outra imagens do produto
  • Nome do Produto
  • Descrição do Produto
  • Preço do Produto
  • Desconto (se houver)
  • Média das avaliações de quem consumiu
  • Botão de Compra (redireciona para o carrinho de compra)
  • Botão de Adicionar ao Carrinho de Compras
  • Se já tiver no carrinho de compras terá o botão de remover do carrinho
  • Verá os comentários sobre aquele produto de outros usuários

3. Tela de Carrinho de Compra

• O usuário verá todos os itens do adicionados ao carrinho de compras

• Cada item terá

  • Imagem do principal produto
  • Nome do Produto
  • Preço do Produto
  • Desconto (se houver)
  • Média das avaliações de quem consumiu
  • Botão para remover do carrinho

• Haverá no footer um somatório do total para pagar (considerando os descontos de cada produto)

Outras melhorias

• Linguagem de programação: Javascript usando React Native
• Versões mais atualizadas
• Instruções detalhadas de Readme

Instalação

Clone este repositório, e na pasta raiz execute o comando abaixo para baixar as dependências

yarn

ou

npm install

Iniciar API (Caso habilitado)

Basta rodar o script abaixo para habilitar o serviço básico de REST.

json-server db.json

Do contrario, o arquivo database.js já provê de modo facilitado a lista de produtos

Teste

O aplicativo foi desenvolvido com foco no Android, sendo assim conecte um celular no seu computador, ou use um simulador de Android, em seguida rode o comando abaixo:

react-native run-android

Para instruções de como preparar seu ambiente de testes, segui o link abaixo: Configuração de Ambiente

Passos

Você também pode conferir todo o passo a passo de desenvolvimento no link a seguir. Passo a Passo

ou mesmo conferir alguns insights e problemas durante o desenvolvimento. Problemas