✔️ Discover Nest, a framework to build server-side NodeJS applications with full TypeScript support.
✔️ Learn the concept of decorator
✔️ Create services to interact with a mocked database
In this workshop, you'll use Nest, a framework built on top of Express to create efficient and scalable apps. It's a very opinionated framework that provides everything you need and has built-in integration with many other frameworks (queues, type ORMs, validators, documentation, and much more!).
Nest fully supports TypeScript (in fact it's built in TypeScript).
All the required information to start this workshop can be found in SETUP.md
In this step, you will learn the fundamental concepts of NestJS and its architecture.
- Launch the server, you will see a message 😉
- Change the message that is returned within the app provider by
"I love this workshop!"
- Understand
📦providers
and〽️dependency injection
here
Command to launch the server:
npm run start:dev
💡 As said before, the command
start:dev
makes use offile watchers
. Every time you save a file, Nest will automatically rebuild the server with the updated file(s).
This way you won't need to restart it manually after each modification 😉
You can now go to http://localhost:3000 in your browser (or using Postman) to see if it works 🚀. Notice the message on the page?
Congratulations, you just completed your firstI love this workshop!
in NestJS! 🥳
In this step, we will cover the basics of using NestJS and get familiar with its fundamental concepts. Understanding these basics will provide a solid foundation for building applications with NestJS.
First of all you will create a folder in the src
folder named poc_shop
, inside the poc_shop
folder, create the following files:
- poc_shop.service.ts
- poc_shop.controller.ts
- poc_shop.module.ts
- What is is a provider?
- More about decorators
- What is a controller?
- What is a module
- What is dependency injection
You should have the following structure:
src
└── poc_shop
├── poc_shop.controller.ts
├── poc_shop.module.ts
└── poc_shop.service.ts
A provider, in the context of your project, refers to a class that offers specific services, functionality, or data manipulation related to the poc-shop feature and we will also see the dependency injections here.
Dependency injection is a design pattern that helps to decouple the components of an application and increase its maintainability, scalability, and testability. You can create a provider by adding the @Injectable()
decorator to a class
First of all you should import the Injectable
decorator and then place on the class that you will also create named PocShopService
.
🎮 In this section, you're about to embark on an exciting journey of creating your first controller using the @Controller('poc-shop')
decorator. 🚀 Controllers play a crucial role in handling incoming requests 📥 and responding to clients with the appropriate data. 💡
To kick things off, let's dive into creating the PocShopController class. This class will serve as the controller specifically designed for the poc-shop route. 🛍️ Inside this class, we'll include a constructor that accepts an instance of the PocShopService and leverages the provider methods. 💼
But wait, there's more! To ensure the smooth flow of your application, you'll need to utilize the Get decorator.
You should have a controller that handles the poc-shop
route and the constructor with the provider 😄
🔗 A module is a class annotated with a @Module()
🧩 decorator. The @Module() decorator provides metadata that Nest makes use of to organize the application structure
.🏗️
You can now link the poc-shop
controller to the app
thanks to the modules.
Upon accessing the poc-shop page, you'll notice that it currently lacks content.📭 Let's proceed by adding some essential elements, starting with a welcoming page. 🎉
- What is a DTO
- You should be able to create the poc-shop DTO
- Create a folder DTO in the
poc_shop/
folder and create a poc_shop.dto.tsThis DTO should include the following information:
- The number of visitors
- An array of IDs representing all available games
- Send
Welcome to poc-shop
message when user access to/poc-shop
- The number of visitors will be incremented each time a user access to
/poc-shop
or/poc-shop/:id
If you want to establish communication with your site, you need to employ an REST API, for this project we will use the GET, POST, DELETE and PATCH methods.
- Each time a user accesses the poc-shop/ route, they will be greeted with the message 'Welcome to poc-shop'.
- The user can see the games available, if there are not any games yet, you should send a message.
Now you have your own games page but there are no games, let's create a game together.
You know how to create a DTO for the poc-shop, let's create one for the games in the
DTO/
folder and you should name itgames.dto.ts
, it should contain:
- An ID
- A name
- A price
- The income of the game
Always in the the poc-shop controller you will now need to do a few a actions when a user access to
poc-shop/games
:
- Get all the games, if there are not any games yet, send a message.
- Get a game by his ID using @Param()
- Post a new game
- Delete a game by his ID
- Change the price for a game for the sales
If you are here that means that you finished the workshop or you want to go further and learn more about NestJS 🥇
- Unless you want to restart all the data in your program every time it's down, check what is postgreSQL and how to use it thanks to the ORM that makes it easier to interact with data bases, you can start with mikroORM. For more information check this video.
- For more security in your program check about user authentication with JWT
Mohammed JBILOU |
---|
🚀 Don't hesitate to follow us on our different networks, and put a star 🌟 on
PoC's
repositories.