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).
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.
StackBlitz lets you quickly run and edit your source code in your browser.
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.
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.
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.
This app can be deployed either as a Node.js application or Docker based application.
Please see Deploy to Render page for more informations.
https://github.com/mugifly/angular-nest/wiki/#Deployments
- Start the development server (watch mode):
npm run dev
- Start the production app:
npm run build && npm run start
- 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 afternpm run ng --
. See here for a list of the available commands.
- Generate component:
- 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 afternpm run nest --
. See here for a list of the available commands.
- Generate controller:
- 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 runnpm run build-api-client
before running the test.
- NOTE: If you have never generated an API client (or run
- Unit tests for backend:
npm run test -w server
- E2E tests for backend:
npm run test:e2e -w server
- Install for frontend:
npm install -w client XXXXX
- Install for backend:
npm install -w server XXXXX
(e.g.npm install -w server @nestjs/typeorm typeorm
)
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.