Projeto | Pré-requisitos | Tecnologias | Executando | Buildando | Testes unitários | Autor
⚠️ AVISO: A 1ª REQUISIÇÃO DEMORA MAIS QUE O NORMAL. Isso acontece porque o deploy do serviço foi feito gratuitamente e quando não é usado ele é DESLIGADO.
FRONTEND PARA API CARS - Criação de um frontend em Angular para a API Rest de usuários e seus carros proposto no desafio técnico.
Obs.: acesse o sistema através do link: 🚗 APICARS.
Obs².: o projeto do backend está no repositório: Back-end.
Para contribuir com o projeto é necessário os seguintes requisitos:
- GIT,
- Node 16.20.2,
- NPM 8.19.4,
- Angular CLI 14.0.7,
- IDE JavaScrip da sua escolha (recomendação: VsCode).
Esse projeto foi desenvolvido utilizando o framework Angular version 14.0.3 junto a biblioteca de componentes Material Design UI com o objetivo de acelerar o desenvolvimento. Para ver quais são todas as dependências do projeto basta abrir o arquivo package.json.
Esse projeto foi organizado utilizando dois módulos principais: Core e Shared. No primeiro com o módulo da aplicação (app.module.ts...) e autenticação (authentication.module.ts). Já no segundo temos os módulos comuns da aplicação. Para facilitar o entendimento veja a imagem abaixo:
Rode ng serve
rodar o projeto em ambiente local. Ele vai abrir na URL http://localhost:4200/
. Essa aplicação tem auto reload caso vocÊ faça alguma alteração nos arquivos do projeto.
Rode ng build
para buildar o projeto. Após o build os arquivos gerados estarão salvos na pasta dist/apicars-web-frontend
.
O projeto Angular já vem com o Karma configurado para testes, porém a ideia seria alterar para utilizar o Jest e o Test library. Caso você esteja trabalhando no projeto e se depare com o Karma saiba que não deu tempo de trocar as libs kkkkk. Basta rodar o comando ng test
para executar os testes unitários via Karma.
Para realizar o deploy da aplicação utilizou-se a ferramenta Netlify. Para realizar o deploy, temos dois caminhos sendo o primeiro com pipeline já criado pela ferramenta e o outro através da pasta dist. No primeiro caso basta conectar o repositório com a sua conta na plataforma. Após isso é necessário realizar algumas configurações para setar o environment (no arquivo com esse nome dentro do projeto temos as variáveis de ambiente e seus valores). Caso não tenha um usuário Netlify cadastrado com um repositório você pode ir para o segundo caso e gerar a pasta dis e coloca-lá na plataforma e realizar as mesmas configurações de ambiente.
Por Thiago Lourenço dá uma olhadinha no LinkedIn e no meu Medium ✌🏽