Este repositório contém o sistema Frota Gerencial, desenvolvido em Angular seguindo o Padrão Digital de Governo (DSGOV). O projeto permite visualizar, gerenciar e monitorar veículos de uma frota, com interface moderna, responsiva e acessível.
- Frontend: angular-dsgov-frota-manager.vercel.app
- API Mock: mock-frota-manager.onrender.com/abastecimentos
Construir uma solução web para gestão de frotas, permitindo o acompanhamento de abastecimentos, motoristas, veículos e indicadores, pronta para produção e fácil de manter.
- Node.js 18+
- npm 10+
# Instalar dependências
npm install# Terminal 1 - Rodar o mock server (API fake)
npm run mock
# Terminal 2 - Rodar a aplicação Angular
npm startAcesse em: http://localhost:4200 API local: http://localhost:3000/abastecimentos
- Frontend: https://angular-dsgov-frota-manager.vercel.app/
- API: https://mock-frota-manager.onrender.com/abastecimentos
GET /abastecimentos- Lista todos os abastecimentosGET /abastecimentos/:id- Busca abastecimento por IDPOST /abastecimentos- Cria novo abastecimentoPUT /abastecimentos/:id- Atualiza abastecimentoDELETE /abastecimentos/:id- Remove abastecimento
Mesmo com um tempo de desenvolvimento reduzido, foi adotada uma organização prévia para garantir clareza e produtividade ao longo do processo.
-
Prototipação inicial de baixa fidelidade (papel)
Utilizada para validar rapidamente a estrutura das telas e o fluxo de navegação antes da implementação. -
Organização das tarefas
O acompanhamento do desenvolvimento é feito através do Trello, permitindo uma visão clara do progresso e das prioridades do projeto:
👉 https://trello.com/b/GPChYR9o/v-lab-front -
Aprendizado guiado com IA
A ferramenta Gemini está sendo utilizada como apoio ao aprendizado guiado, auxiliando na tomada de decisões técnicas e na compreensão de conceitos durante o desenvolvimento. -
Fluxo de Desenvolvimento com Pull Requests (PRs)
Para garantir a qualidade e a revisão do código, cada nova funcionalidade ou correção é desenvolvida em uma branch separada e integrada à branchmainpor meio de um Pull Request. Isso evita commits diretos na branch principal e promove a colaboração.
O projeto segue os fundamentos do Design System do Governo Federal (DSGOV), garantindo consistência visual, acessibilidade e reutilização de padrões.
Documentação utilizada:
👉 https://www.gov.br/ds/fundamentos-visuais/espacamento
O projeto adota o padrão Facade, promovendo:
- Separação entre lógica de negócio e apresentação
- Componentes mais simples e reutilizáveis
- Facilidade de manutenção e escalabilidade
Estrutura base de camadas:
components– Componentes visuaisfacades– Intermediação entre componentes e serviçosservices– Regras de negócio e comunicação
- Angular 20
- TypeScript
- RxJS para programação reativa
- JSON Server para mock da API
- ng-apexcharts para visualização de dados
- CSS Custom Properties (tokens de design)
- SCSS para estilização
- Trello para organização
- Gemini como suporte de aprendizado guiado
src/
├── app/
│ ├── core/
│ │ ├── facades/ # Camada de intermediação
│ │ ├── services/ # Serviços e lógica de negócio
│ │ └── models/ # Interfaces e tipos
│ ├── shared/
│ │ └── components/ # Componentes reutilizáveis
│ └── pages/ # Páginas da aplicação
└── public/
└── assets/
└── mocks/ # Dados mockados (db.json)