Skip to content

🚗 API cars - Criação do front-end em Angular para a API REST de usuários e de seus carros.

Notifications You must be signed in to change notification settings

thiiagolourenco/apicars-web-frontend

Repository files navigation

FRONTEND PARA A API REST DE USUÁRIOS E SEUS CARROS

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.

💻 Projeto

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.

📝 Pré-requisitos

Para contribuir com o projeto é necessário os seguintes requisitos:

🚀 Tecnologias

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.

🏗️ Arquitetura e estrutura de pastas

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:

Project architecture

⚙️ Executando

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.

💻 Buildando

Rode ng build para buildar o projeto. Após o build os arquivos gerados estarão salvos na pasta dist/apicars-web-frontend .

🐞 Testes unitários

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.

🧗 Deploy

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.

📝 Autor

Por Thiago Lourenço dá uma olhadinha no LinkedIn e no meu Medium ✌🏽

About

🚗 API cars - Criação do front-end em Angular para a API REST de usuários e de seus carros.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published