Skip to main content

Documentation Index

Fetch the complete documentation index at: https://mintlify.com/lucavallini/aibar-frontend/llms.txt

Use this file to discover all available pages before exploring further.

This guide walks you through cloning the Aibar SRL App repository, installing dependencies, pointing the app at a backend API, and launching the development server. By the end you will have a fully functional local environment at http://localhost:4200 authenticated against either a local FastAPI instance or the hosted production API.

Prerequisites

Before you begin, make sure the following are available on your machine:
  • Node.js 18 or laternodejs.org
  • Angular CLI 22 — install globally with npm install -g @angular/cli@22
  • A running Aibar backend — either a local FastAPI server or the hosted instance at https://aibar-api.onrender.com
If you do not have a local backend available, you can point the development build at the production API by setting apiUrl to https://aibar-api.onrender.com in src/environments/environment.ts. See Step 3 below.

Setup

1

Clone the repository

Clone the aibar-frontend repository from GitHub and navigate into the project directory:
git clone https://github.com/lucavallini/aibar-frontend.git && cd aibar-frontend
2

Install dependencies

Install all Node.js dependencies declared in package.json:
npm install
This installs Angular 22, RxJS 7.8, Vitest 4, Prettier, and the Angular CLI build toolchain.
3

Configure the environment

Open src/environments/environment.ts and set apiUrl to the address of your backend. The default points to a local FastAPI server running on port 8000:
export const environment = {
  production: false,
  apiUrl: 'http://127.0.0.1:8000'
};
Change apiUrl to match wherever your Aibar backend is running. For the hosted API, use https://aibar-api.onrender.com.
The development server hot-reloads whenever you save a source file, including changes to environment.ts. There is no need to restart ng serve after editing the environment file.
4

Start the development server

Launch the Angular development server:
ng serve
Angular CLI compiles the application and serves it at http://localhost:4200. The terminal output will confirm the address once compilation succeeds:
Application bundle generation complete. [N.NNs]
Watch mode enabled. Watching for file changes...
➜  Local:   http://localhost:4200/
The browser will automatically reload whenever you modify a source file.
5

Log in

Open http://localhost:4200 in your browser. You will be redirected to /login automatically — unauthenticated users cannot access any other route.Enter your credentials:
  • Administrador account — grants access to all modules including Auditoría and Usuarios.
  • Empleado account — grants access to Viajes, Choferes, Camiones, Multas, and Combustible.
After a successful login the API returns a JWT, which is stored in sessionStorage under the key aibar_token and automatically attached to every subsequent HTTP request by the authInterceptor.

Running Tests

The project uses Vitest as its test runner, integrated through the @angular/build:unit-test builder. Run the full unit test suite with:
ng test
Vitest will discover and execute all *.spec.ts files in the project. Test results are printed to the terminal; the process exits with a non-zero code if any test fails, making it safe to use in CI pipelines.

Building for Production

To compile an optimized production bundle, run:
ng build
Angular CLI applies full ahead-of-time (AOT) compilation, tree-shaking, and output hashing. The compiled assets are written to the dist/ directory and are ready to be deployed to any static hosting provider or web server.
The production build automatically uses src/environments/environments.prod.ts, which sets apiUrl to https://aibar-api.onrender.com. You do not need to change any environment file before running a production build.
To build explicitly with the development configuration (source maps enabled, no optimization):
ng build --configuration development

Build docs developers (and LLMs) love