Awesome

angular-nest

Simple web app template with Angular + NestJS + ng-openapi-gen + Angular Material.

Deployable on Heroku, Render, Google App Engine (GAE), Cloud Run and other hosting services using with/without Docker (learn more).

Key Elements

There is some variations... https://github.com/mugifly/angular-nest/wiki#variations

• Angular -- for Frontend app.
• NestJS -- for Backend app.
• ng-openapi-gen -- for API Client generation.
• Angular Material -- for UI.
  • NOTE: There is also a vanilla branch that doesn't include Angular Material.
• Docker -- for Production environment.
  • NOTE: Deployments without Docker are also supported.
• Karma + Jasmine -- for Unit testing of Frontend (with Puppeteer + Headless Chromium)
• Jest -- for Unit testing of Backend
• GitHub Actions -- for CI
• npm Workspaces - for Monorepo structure.

Quick Start for Development

StackBlitz

StackBlitz lets you quickly run and edit your source code in your browser.

Local

Before you start, you should install the following softwares:

• Git

• Node.js v20+

• Visual Studio Code

Next, please Create a new repository from this repository.

Then, execute as the following in your terminal:

$ git clone git@github.com:YOUR_GITHUB_NAME/angular-nest.git
$ cd angular-nest/

$ npm install

$ npm run start:dev

Finally, open the web browser and navigate to http://localhost:4200/. Also, when you edit the frontend source-code, auto-reloading applies your changes to the browser immediately.

An API documentation is generated by Swagger UI, and you can access it at http://localhost:4200/api/docs.

See the Wiki for additional information. You'll find tips for implementing database connectivity, guides for future updates, and more.

Quick Start for Deployment

This app supports direct deployment to various hosting services as a production environment.

It's also very easy to automatic-deployment, because you don't have to run the build process locally or in CI.

Deployment on Heroku

This app can be deployed either to the Heroku stack (Node.js buildpack based) or the Container stack (Docker based).

Please see Deploy to Heroku page for more informations.

Deployment on Render

This app can be deployed either as a Node.js application or Docker based application.

Please see Deploy to Render page for more informations.

Deployment on other servers (with/without Docker)

https://github.com/mugifly/angular-nest/wiki/#Deployments

CLI Commands

Start

• Start the development server (watch mode):   npm run dev
• Start the production app:   npm run build && npm run start

Angular CLI & Nest CLI

• Angular CLI (@angular/cli):   npm run ng
  • Generate component:   npm run ng -- generate component foo-bar
  • Other ng commands can also be run by typing it after npm run ng -- . See here for a list of the available commands.
• Nest CLI (@nestjs/cli):   npm run nest
  • Generate controller:   npm run nest -- generate controller foo-bar
  • Other nest commands can also be run by typing it after npm run nest -- . See here for a list of the available commands.

Testing

• Unit tests for frontend:   npm run test -w client   (Google Chrome and dependencies of Puppeteer required)
  • NOTE: If you have never generated an API client (or run npm run dev), you should run npm run build-api-client before running the test.
• Unit tests for backend:   npm run test -w server
• E2E tests for backend:   npm run test:e2e -w server

Install npm modules

• Install for frontend: npm install -w client XXXXX
• Install for backend: npm install -w server XXXXX<br>(e.g. npm install -w server @nestjs/typeorm typeorm)

License and Author

This project is released under the CC0 1.0 Universal license, by Masanori Ohgita (mugifly).

Therefore, a copyright notice is NOT required. Feel free to use or copy it to your project :)

NOTE: However, some sample codes and documents (e.g. client/README.md and server/README.md) that generated by Angular CLI or Nest CLI may be based on their respective licenses.