marcosnto/frend-labs

Frend Labs consiste em uma simulação de listagem de fornecedores de uma cadeia de suprimentos, os quais possuem informações de cadastro e localização.

Frend Labs

Frend Labs consiste em uma simulação de listagem de fornecedores de uma cadeia de suprimentos, os quais possuem informações de cadastro e localização.

Tecnologias

• ReactJS
• Google Maps API
• React Router Dom
• Styled Components
• Axios
• React Icons

Conceitos

• Criação de componentes
• Criação de testes automaizados
• Criação de API local e utilização dos métodos HTTP
• Integração com API do GoogleMaps
• Criação de paginação de resultados

Como executar o projeto

1. Clone o repositório e entre no diretório do projeto

git clone https://github.com/Marcosnto/frend-labs.git

cd /sl-test.git

2. Baixe as dependências do projeto

yarn ou npm install

4. Após o passo 3, o projeto já pode ser iniciado na porta padrão 3000.

yarn start ou npm start

Porém os dados não serão exibidos, pois precisamos iniciar a API.

API

Usaremos a lib json-server. Ela irá simular uma API a partir de um arquivo json, o qual está localizado na raiz do projeto com o nome 'db.json'

Por padrão, o json-server é executado na porta 3000. Para evitar conflito com o projeto mudamos a porta para 3333 através do arquivo json-server.json.

Para iniciar, abra o terminal e execute o comando:

yarn json-server db.json ou npm run json-server --watch db.json

A partir disso, basta dar um F5 na aba do projeto no navegador e os dados serão exibidos juntamente com as funcionalidades. 😊

Testes

O projeto possui 2 testes automatizados, para executa-los utilize o comando:

yarn test ou npm test