lucasmattosdev / conta-azul-desafio-frontend

Conta Azul - Desafio Frontend (WeatherNow)

Teste prático de cargo Desenvolvedor Frontend na ContaAzul.

Desafio

Construir uma aplicação para exibir a temperatura atual de 3 cidades diferentes.

Especificações

• Condições climáticas das cidades Nuuk/GL, Urubici/BR e Nairobi/KE;
• As cores das temperaturas deve seguir:
  • Igual ou abaixo de 5 graus em azul;
  • Acima de 5 graus e igual ou abaixo de 25 em laranja;
  • Acima de 25 graus em vermelho;
• A topbar deve permanecer fixa ao rola a página;
• O layout para desktop baseado neste documento;
• O layout para mobile baseado neste documento;
• As cores utilizadas de acordo a paleta;
• Sugestão de API da OpenWeatherMap;
• Cache de 10min para as requisições com a API;
• Atualizar as informações a cada 10min;
• HTML Semântico;
• Testes automatizados;

Aplicação

Estrutura

• Servidor Node.JS
• Framework de Javascript em React
• CSS com SassScript

Preparar Ambiente

Você precisa do servidor Node.js instalado.

1. Vá para a pasta onde ficam seus projetos e faça clone com o comando:

git clone https://github.com/lucasmattooos/conta-azul-desafio-frontend.git

2. Vamos para a pasta onde o projeto foi clonado com o comando:

cd conta-azul-desafio-frontend

3. Instale as dependências do projeto com o comando:

npm install

Feito isso o projeto já está pronto para rodar

Ambiente de Desenvolvimento

Dentro da pasta do projeto, iremos rodar o servidor com o comando:

npm start

Agora seu servidor de desenvolvimento já está acessível em localhost:3000

Ambiente de Produção

Lembre-se de utilizar um Servidor Web apropriado para aplicações single-page application

1. Dentro da pasta do projeto, iremos compilar o projeto com o comando:

npm run build

2. Copiamos os arquivos da pasta build localizada dentro da pasta do projeto para o servidor web

Agora o projeto estará disponível a partir do seu Servidor Web

Testes Automatizados

Observação: Tenha executado ao menos uma vez a Preparação de Desenvolvimento antes de rodar os testes

1. Dentro da pasta do projeto, iremos rodar os testes com o comando

npm test

2. Uma primeira vez irá apresentar um menu para escolha do tipo de teste, pressione a para selecionar run all tests
3. Aguarde o fim do processo e confira se todos os testes tiveram resultado passed como no exemplo abaixo:

Test Suites: 4 passed, 4 total
Tests:       7 passed, 7 total
Snapshots:   0 total
Time:        5.333 s
Ran all test suites.

Licença

© 2021 Lucas Mattos.