The main objectives of this article are:
Run the below command to create the NestJS CLI application.
package.json - The 'package.json' file contains 'dependencies'(libraries that nestjs depends on), 'devdependencies'(libraries that are required for development), 'scripts'(commands to run, debug, test, etc), etc.
Now in the 'launch.json' file replace the 'configuration' array as follows.
- NestJS And Angular Application Communication
- NestJS
- Create A NestJS Application
- Debug NestJS Application From Visual Studio Code Editor
NestJS And Angular Application Communication:
- User request the Angular application(single page application) then js files are downloaded and then runs the application on the browser.
- Since Angular is a single-page application it depends on API for data to display.
- So Angular requests the NestJS endpoint through HTTP requests.
- NestJS API that runs at the server gives the JSON response. NestJS API communicates with the database for fetching and storing the data.
NestJS:
NestJS is a framework used to develop the server-side application. NestJS is built on top of the Node.js framework just like Express. It is the combination of Progressive Javascript, Object-Oriented Programming, Functional Programming, and Functional Reactive Programming.
NestJS application built with 'Models' and 'Controllers' to serve an HTTP request. NestJS works with TypeScript for strongly typed programming.
Create A NestJS Application:
To Create a NestJS Application or Angular Application we should have Node installed in our local machine. So go to 'https://nodejs.org/en/download/'
npm i -g @nestjs/cli
Run the below command to create the NestJS CLI application.
nest new project-name
Commands to start the NestJS API.
npm start
Let's explore our nestjs project:
package.json - The 'package.json' file contains 'dependencies'(libraries that nestjs depends on), 'devdependencies'(libraries that are required for development), 'scripts'(commands to run, debug, test, etc), etc.
tsconfig.json - The 'tsconfig.json' file contains a typescript configuration to build the project.
main.ts - The 'main.ts' file is the entire file of our application. Here we can see our application running port number. Here we can observe it loads the 'AppModule'.
app.module.ts - The 'app.module.ts' is our entry module file.
app.controller.ts - The 'app.controller.ts' file default controller file, either we can use or ignore it
app.controller.ts - The 'app.controller.ts' file default controller file, either we can use or ignore it
app.service.ts - The 'app.service.ts' file is the default service file, either we can use or ignore it.
Debug NestJS Application From Visual Studio Code:
Let's understand how to enable the debugger in the NestJS application using Visual Studio
Run the below command to start the nestjs application in debug mode.
npm run start:debug
Now select the 'Run & Debug' and then click on 'create a launch.json' and then select 'Node JS' as the environment.
.vscode/launch.json:
"configurations": [ { "name": "Attach", "port": 9229, "request": "attach", "skipFiles": [ "<node_internals>/**" ], "type": "node" } ]Now add the debugger in any part of the controller and then click on 'start debug'.Next article, we are going to create the angular application.
Support Me!
Buy Me A Coffee
PayPal Me
Video Session:
Wrapping Up:
Hopefully, I think this article delivered some useful information on NestJS (v9) and Angular(v4). using I love to have your feedback, suggestions, and better techniques in the comment section below.
Refer:
Part-4| NestJS(v9) | Angular(v14) | MongoDB | CRUD Example
Part-5| NestJS(v9) | Angular(v14) | MongoDB | CRUD Example
Part-6| NestJS(v9) | Angular(v14) | MongoDB | CRUD Example
Part-5| NestJS(v9) | Angular(v14) | MongoDB | CRUD Example
Part-6| NestJS(v9) | Angular(v14) | MongoDB | CRUD Example
Comments
Post a Comment