Angular Full Stack screenshot

Angular Full Stack

Author Avatar Theme by Davideviolante
Updated: 19 Jun 2025
1533 Stars

Angular Full Stack project built using Angular, Express, Mongoose and Node. Whole stack in TypeScript.

Categories

Overview:

Angular Full Stack is a project that aims to simplify getting started with Angular by providing a complete stack including a backend and database. The entire stack is written in TypeScript, offering the advantage of coding in a single language throughout the project. The stack includes popular technologies such as MongoDB, Express.js, Angular, and Node.js. The project also utilizes other tools and technologies such as Angular CLI, Bootstrap, Font Awesome, JSON Web Token, Angular 2 JWT, and Bcrypt.js. It provides easy installation and setup instructions, including steps for development, production, manual mode, Docker, and deployment on AWS EC2.

Features:

  • Complete stack in TypeScript
  • MEAN stack (MongoDB, Express.js, Angular 2+, Node.js)
  • Utilizes popular tools and technologies such as Angular CLI, Bootstrap, Font Awesome, JSON Web Token, Angular 2 JWT, and Bcrypt.js
  • Provides different modes for development and production
  • Enables easy setup and deployment on AWS EC2

Installation:

  1. Install Node.js and MongoDB.
  2. Install Angular CLI by running the command: npm i -g @angular/cli.
  3. From the project’s root folder, install all the dependencies by running: npm i.

Development mode:

  • To run in development mode with file watching, run the command: npm run dev. This command concurrently executes MongoDB, Angular build, TypeScript compiler, and Express server. A window will open automatically at localhost:4200.

Production mode:

  • To run in production mode with a production bundle, run the command: npm run prod. The project will listen at localhost:3000.

Manual mode:

  • To build the frontend, run: npm run builddev for development or npm run build for production.
  • To build the backend, run: npm run predev.
  • To run MongoDB, run: mongod.
  • To run the app, run: npm start.

Docker:

  • To run the app using Docker, run the command: sudo docker-compose up.

AWS EC2:

  • Create an EC2 Linux machine on AWS.
  • Edit the EC2 Security Group and add TCP port 3000 as an Inbound rule for Source 0.0.0.0/0.
  • Clone the repository into the EC2 machine.
  • If using a remote MongoDB instance, edit the .env file.
  • Run npm ci, npm run build, and npm start.
  • The app will now be running and listening on port 3000. Visit the public IP of your AWS EC2 instance followed by the port (e.g., 12.34.56.78:3000).
  • Optionally, use pm2 to run the app instead of npm start, e.g., pm2 start dist/server/app.js.

Summary:

Angular Full Stack is a project that simplifies the process of getting started with Angular by providing a complete stack with a backend and database. It allows developers to code in TypeScript throughout the entire stack and includes popular technologies like MongoDB, Express.js, and Angular. The project offers easy installation instructions and provides different modes for development and production. It also includes support for manual mode, Docker, and deployment on AWS EC2. Overall, it aims to streamline the development process and provide a convenient starting point for projects using Angular.