Skip to main content
Get your local development environment set up and running in just a few minutes. This guide will walk you through cloning the repository, installing dependencies, and launching the application.

​
Prerequisites

Before you begin, ensure you have the following installed:
  • Node.js 20.x or higher
  • npm (comes with Node.js)
  • Git
This project uses Angular 20, which requires Node.js version 20.0.0 or higher.

​
Quick Start Steps

1

Clone the repository

Clone the Biblioteca Virtual Frontend repository to your local machine:
git clone https://github.com/AngheloMP10/biblioteca-virtual-frontend.git
cd biblioteca-virtual-frontend
Expected output:
Cloning into 'biblioteca-virtual-frontend'...
remote: Enumerating objects: 150, done.
remote: Counting objects: 100% (150/150), done.
remote: Compressing objects: 100% (95/95), done.
remote: Total 150 (delta 45), reused 120 (delta 30)
Receiving objects: 100% (150/150), 85.23 KiB | 1.50 MiB/s, done.
Resolving deltas: 100% (45/45), done.
2

Install dependencies

Install all required npm packages:
npm install
This will install Angular 20 and all dependencies defined in package.json:
  • @angular/core: ^20.0.0
  • @angular/router: ^20.0.0
  • @angular/common: ^20.0.0
  • @angular/forms: ^20.0.0
  • rxjs: ~7.8.0
Expected output:
added 234 packages, and audited 235 packages in 45s

42 packages are looking for funding
  run `npm fund` for details

found 0 vulnerabilities
3

Configure the API endpoint

The application connects to a backend API. By default, it points to http://localhost:8080.If your backend is running on a different URL, update src/environments/environment.ts:
src/environments/environment.ts
export const environment = {
  production: false,
  apiUrl: 'http://localhost:8080', // Change this to your backend URL
};
Make sure your backend API is running before starting the frontend, or you’ll see connection errors in the browser console.
4

Start the development server

Launch the Angular development server:
npm start
This runs ng serve under the hood. Expected output:
Initial chunk files | Names         |  Raw size
polyfills.js        | polyfills     | 82.64 kB  |
main.js             | main          | 18.23 kB  |
styles.css          | styles        |  1.12 kB  |

                    | Initial total | 101.99 kB

Application bundle generation complete. [2.456 seconds]

Watch mode enabled. Watching for file changes...
➜  Local:   http://localhost:4200/
➜  press h + enter to show help
5

Access the application

Open your browser and navigate to:
http://localhost:4200
You should see the login page of the Biblioteca Virtual application.
The development server supports hot reload. Any changes you make to the source code will automatically refresh the browser.

​
Verify Your Setup

To verify everything is working correctly:
  1. Check the login page loads - Navigate to http://localhost:4200/auth/login
  2. Open browser DevTools - Press F12 and check the Console tab for any errors
  3. Verify API connectivity - The app should attempt to connect to your backend at http://localhost:8080

​
What’s Next?

Installation Guide

Learn about all available installation methods including Docker

Architecture Overview

Understand the project structure and architecture

​
Common Issues

If you see an error that port 4200 is already in use, you can specify a different port:
ng serve --port 4201
Or kill the process using port 4200:
# On Linux/macOS
lsof -ti:4200 | xargs kill -9

# On Windows
netstat -ano | findstr :4200
taskkill /PID <PID> /F
If npm install fails, try:
  1. Clear npm cache: npm cache clean --force
  2. Delete node_modules and package-lock.json
  3. Run npm install again
npm cache clean --force
rm -rf node_modules package-lock.json
npm install
If you see CORS errors or connection refused errors:
  1. Verify your backend is running on http://localhost:8080
  2. Check that CORS is properly configured in your backend
  3. Update the apiUrl in src/environments/environment.ts if needed

​
Available Scripts

Once installed, you have access to these npm scripts:
CommandDescription
npm startStart development server on http://localhost:4200
npm run buildBuild for production (output in dist/)
npm run watchBuild in watch mode with source maps
npm testRun unit tests with Karma
npm run build:netlifyBuild with Netlify configuration
For more details on the build process and deployment options, check out the Installation Guide.

Build docs developers (and LLMs) love

Get started for freeTalk to us