1. Introduction
When learning NodeJs , you will surely be exposed to many different Node frameworks and surely anyone who has learned or exposed to NodeJS will work with Express framework – a web application framework of NodeJS .
I think this is a framework that is quite easy to learn for beginners. It is quite convenient when it comes to supporting a lot of features on the web or on mobile. They help us build the backend more easily. There are a few features that Express supports such as:
- Middleware
- Routing
- Templating
- Debugging
Besides, there is a lot of API support.
Sounds interesting already, let’s go to find out.
2. Installation
1 2 3 4 | $ mkdir express $ cd express $ npm install express --save |
Finish creating express already. First of all, print Hello World
first
Create an additional file index.js with the content:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 | <span class="token comment">// khai báo module express</span> <span class="token keyword">const</span> express <span class="token operator">=</span> <span class="token function">require</span> <span class="token punctuation">(</span> <span class="token string">'express'</span> <span class="token punctuation">)</span> <span class="token punctuation">;</span> <span class="token keyword">const</span> app <span class="token operator">=</span> <span class="token function">express</span> <span class="token punctuation">(</span> <span class="token punctuation">)</span> <span class="token punctuation">;</span> <span class="token comment">// khai báo route</span> app <span class="token punctuation">.</span> <span class="token function">get</span> <span class="token punctuation">(</span> <span class="token string">'/'</span> <span class="token punctuation">,</span> <span class="token punctuation">(</span> <span class="token parameter">req <span class="token punctuation">,</span> res</span> <span class="token punctuation">)</span> <span class="token operator">=></span> <span class="token punctuation">{</span> res <span class="token punctuation">.</span> <span class="token function">send</span> <span class="token punctuation">(</span> <span class="token string">'Hello World!'</span> <span class="token punctuation">)</span> <span class="token punctuation">;</span> <span class="token punctuation">}</span> <span class="token punctuation">)</span> <span class="token comment">// lắng nghe app trên cổng 3000</span> app <span class="token punctuation">.</span> <span class="token function">listen</span> <span class="token punctuation">(</span> <span class="token number">3000</span> <span class="token punctuation">,</span> <span class="token punctuation">(</span> <span class="token punctuation">)</span> <span class="token operator">=></span> <span class="token punctuation">{</span> console <span class="token punctuation">.</span> <span class="token function">log</span> <span class="token punctuation">(</span> <span class="token template-string"><span class="token template-punctuation string">`</span> <span class="token string">Server listening at http://localhost:3000</span> <span class="token template-punctuation string">`</span></span> <span class="token punctuation">)</span> <span class="token punctuation">;</span> <span class="token punctuation">}</span> <span class="token punctuation">)</span> |
Run node index.js
to see the results.
3. Routing
As in the simple example above, we have also looked through the fog about the express route by declaring as above.
1 2 3 4 | app <span class="token punctuation">.</span> <span class="token function">get</span> <span class="token punctuation">(</span> <span class="token string">'/'</span> <span class="token punctuation">,</span> <span class="token punctuation">(</span> <span class="token parameter">req <span class="token punctuation">,</span> res</span> <span class="token punctuation">)</span> <span class="token operator">=></span> <span class="token punctuation">{</span> res <span class="token punctuation">.</span> <span class="token function">send</span> <span class="token punctuation">(</span> <span class="token string">'Hello World!'</span> <span class="token punctuation">)</span> <span class="token punctuation">;</span> <span class="token punctuation">}</span> <span class="token punctuation">)</span> |
With the above code we can understand the structure to declare a route according to structure
1 2 | app <span class="token punctuation">.</span> <span class="token constant">METHOD</span> <span class="token punctuation">(</span> <span class="token constant">PATH</span> <span class="token punctuation">,</span> <span class="token constant">HANDLER</span> <span class="token punctuation">)</span> |
Inside :
app
an instance of expressMETHOD
HTTP methods (get, post, delete, put)PATH
path in browser.HANDLER
a function to execute the code when thepath
is called.
Route parameters
We can also declare the params for the url with the syntax :param
.
1 2 3 4 5 6 7 8 9 10 11 | <span class="token comment">// Khai báo routes</span> app <span class="token punctuation">.</span> <span class="token function">get</span> <span class="token punctuation">(</span> <span class="token string">'/users/:userId/address/:address'</span> <span class="token punctuation">,</span> <span class="token punctuation">(</span> <span class="token parameter">req <span class="token punctuation">,</span> res</span> <span class="token punctuation">)</span> <span class="token operator">=></span> <span class="token punctuation">{</span> res <span class="token punctuation">.</span> <span class="token function">send</span> <span class="token punctuation">(</span> req <span class="token punctuation">.</span> params <span class="token punctuation">)</span> <span class="token punctuation">;</span> <span class="token comment">// lấy params được truyền trên url req.params</span> <span class="token punctuation">}</span> <span class="token punctuation">)</span> <span class="token punctuation">;</span> <span class="token comment">// URL</span> http <span class="token operator">:</span> <span class="token operator">/</span> <span class="token operator">/</span> localhost <span class="token operator">:</span> <span class="token number">3000</span> <span class="token operator">/</span> users <span class="token operator">/</span> <span class="token number">1</span> <span class="token operator">/</span> address <span class="token operator">/</span> hanoi <span class="token comment">// Kết quả :</span> <span class="token punctuation">{</span> <span class="token string">"userId"</span> <span class="token operator">:</span> <span class="token string">"1"</span> <span class="token punctuation">,</span> <span class="token string">"address"</span> <span class="token operator">:</span> <span class="token string">"hanoi"</span> <span class="token punctuation">}</span> |
Use the Router to prefix the route
If we want before entering any path, we want it to start with /admin
example, we just need to declare the following:
1 2 3 4 5 6 7 | <span class="token keyword">const</span> router <span class="token operator">=</span> express <span class="token punctuation">.</span> <span class="token function">Router</span> <span class="token punctuation">(</span> <span class="token punctuation">)</span> <span class="token punctuation">;</span> app <span class="token punctuation">.</span> <span class="token function">use</span> <span class="token punctuation">(</span> <span class="token string">'/admin'</span> <span class="token punctuation">,</span> router <span class="token punctuation">)</span> <span class="token punctuation">;</span> router <span class="token punctuation">.</span> <span class="token function">get</span> <span class="token punctuation">(</span> <span class="token string">'/blog'</span> <span class="token punctuation">,</span> <span class="token punctuation">(</span> <span class="token parameter">req <span class="token punctuation">,</span> res</span> <span class="token punctuation">)</span> <span class="token operator">=></span> <span class="token punctuation">{</span> res <span class="token punctuation">.</span> <span class="token function">send</span> <span class="token punctuation">(</span> <span class="token string">'day la route co prefix'</span> <span class="token punctuation">)</span> <span class="token punctuation">;</span> <span class="token punctuation">}</span> <span class="token punctuation">)</span> <span class="token punctuation">;</span> |
In the above code, we have declared a Router object, this is a pretty powerful object of express often used in cases like middleware or route handling. It supports several methods that you can see for more reference here .
app.route ()
Another way to define a route
is to use app.route () . Using this method will find the code quite concise and easy to avoid confusion, and also avoid duplication when thinking of multiple routes that share the same paths. Example of not using app.route () .
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 | <span class="token keyword">function</span> <span class="token function">doGet</span> <span class="token punctuation">(</span> <span class="token parameter">req <span class="token punctuation">,</span> res <span class="token punctuation">,</span> next</span> <span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token comment">// code</span> <span class="token punctuation">}</span> <span class="token keyword">function</span> <span class="token function">doPost</span> <span class="token punctuation">(</span> <span class="token parameter">req <span class="token punctuation">,</span> res <span class="token punctuation">,</span> next</span> <span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token comment">// code</span> <span class="token punctuation">}</span> <span class="token keyword">function</span> <span class="token function">doPut</span> <span class="token punctuation">(</span> <span class="token parameter">req <span class="token punctuation">,</span> res <span class="token punctuation">,</span> next</span> <span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token comment">// code</span> <span class="token punctuation">}</span> app <span class="token punctuation">.</span> <span class="token function">get</span> <span class="token punctuation">(</span> <span class="token string">'/books/:book'</span> <span class="token punctuation">,</span> doGet <span class="token punctuation">)</span> <span class="token punctuation">;</span> app <span class="token punctuation">.</span> <span class="token function">post</span> <span class="token punctuation">(</span> <span class="token string">'/books/:book'</span> <span class="token punctuation">,</span> doPost <span class="token punctuation">)</span> <span class="token punctuation">;</span> app <span class="token punctuation">.</span> <span class="token function">put</span> <span class="token punctuation">(</span> <span class="token string">'/books/:book'</span> <span class="token punctuation">,</span> doPut <span class="token punctuation">)</span> <span class="token punctuation">;</span> |
It can be seen that there are up to 3 segments we all declare as /books/:book
, if there are more than 3, it looks quite difficult. A more optimal way of writing is to use app.route () .
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 | <span class="token keyword">function</span> <span class="token function">doGet</span> <span class="token punctuation">(</span> <span class="token parameter">req <span class="token punctuation">,</span> res <span class="token punctuation">,</span> next</span> <span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token comment">// code</span> <span class="token punctuation">}</span> <span class="token keyword">function</span> <span class="token function">doPost</span> <span class="token punctuation">(</span> <span class="token parameter">req <span class="token punctuation">,</span> res <span class="token punctuation">,</span> next</span> <span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token comment">// code</span> <span class="token punctuation">}</span> <span class="token keyword">function</span> <span class="token function">doPut</span> <span class="token punctuation">(</span> <span class="token parameter">req <span class="token punctuation">,</span> res <span class="token punctuation">,</span> next</span> <span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token comment">// code</span> <span class="token punctuation">}</span> app <span class="token punctuation">.</span> <span class="token function">route</span> <span class="token punctuation">(</span> <span class="token string">'/books/:book'</span> <span class="token punctuation">)</span> <span class="token punctuation">.</span> <span class="token function">get</span> <span class="token punctuation">(</span> doGet <span class="token punctuation">)</span> <span class="token punctuation">.</span> <span class="token function">post</span> <span class="token punctuation">(</span> doPost <span class="token punctuation">)</span> <span class="token punctuation">.</span> <span class="token function">put</span> <span class="token punctuation">(</span> doPut <span class="token punctuation">)</span> <span class="token punctuation">;</span> |
4. Middleware
When a request is sent, Express will execute middleware functions in turn until a response is returned to the user. They have access to the request or response .
If a Middleware function finishes but it is not the last function in the function we need to execute, we need to call next () function otherwise the application will hang at that function.
There are five middleware types used in Express :
- Application-level middleware
- Router-level middleware
- Error-handling middleware
- Built-in middleware
- Third-party middleware
We’ll go into finding out what each of these types is
Application-level middleware
When we instantiate an Express application we will have an object representing that application, namely the app . This object is usually declared by us as the name app .
1 2 | <span class="token keyword">const</span> app <span class="token operator">=</span> <span class="token function">express</span> <span class="token punctuation">(</span> <span class="token punctuation">)</span> <span class="token punctuation">;</span> |
Then we consider this app to be at the application level, the highest level. We can declare application-level middleware using app.use () or app.METHOD (where METHOD is HTTP methods).
Declare middleware for a specific path:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 | <span class="token keyword">const</span> express <span class="token operator">=</span> <span class="token function">require</span> <span class="token punctuation">(</span> <span class="token string">'express'</span> <span class="token punctuation">)</span> <span class="token keyword">const</span> app <span class="token operator">=</span> <span class="token function">express</span> <span class="token punctuation">(</span> <span class="token punctuation">)</span> <span class="token punctuation">;</span> <span class="token comment">// khai báo middleware cho route</span> app <span class="token punctuation">.</span> <span class="token function">use</span> <span class="token punctuation">(</span> <span class="token string">'/user/:id'</span> <span class="token punctuation">,</span> <span class="token punctuation">(</span> <span class="token parameter">req <span class="token punctuation">,</span> res <span class="token punctuation">,</span> next</span> <span class="token punctuation">)</span> <span class="token operator">=></span> <span class="token punctuation">{</span> console <span class="token punctuation">.</span> <span class="token function">log</span> <span class="token punctuation">(</span> <span class="token string">'Day la middleware'</span> <span class="token punctuation">)</span> <span class="token function">next</span> <span class="token punctuation">(</span> <span class="token punctuation">)</span> <span class="token punctuation">}</span> <span class="token punctuation">)</span> app <span class="token punctuation">.</span> <span class="token function">get</span> <span class="token punctuation">(</span> <span class="token string">'/user/:id'</span> <span class="token punctuation">,</span> <span class="token punctuation">(</span> <span class="token parameter">req <span class="token punctuation">,</span> res</span> <span class="token punctuation">)</span> <span class="token operator">=></span> <span class="token punctuation">{</span> res <span class="token punctuation">.</span> <span class="token function">send</span> <span class="token punctuation">(</span> <span class="token string">'hello nha'</span> <span class="token punctuation">)</span> <span class="token punctuation">}</span> <span class="token punctuation">)</span> app <span class="token punctuation">.</span> <span class="token function">listen</span> <span class="token punctuation">(</span> <span class="token number">3000</span> <span class="token punctuation">,</span> <span class="token punctuation">(</span> <span class="token punctuation">)</span> <span class="token operator">=></span> <span class="token punctuation">{</span> console <span class="token punctuation">.</span> <span class="token function">log</span> <span class="token punctuation">(</span> <span class="token template-string"><span class="token template-punctuation string">`</span> <span class="token string">Server listening at http://localhost:3000</span> <span class="token template-punctuation string">`</span></span> <span class="token punctuation">)</span> <span class="token punctuation">}</span> <span class="token punctuation">)</span> |
If you do not declare a specific path, it will run by default when calling all routes:
1 2 3 4 5 | app <span class="token punctuation">.</span> <span class="token function">use</span> <span class="token punctuation">(</span> <span class="token keyword">function</span> <span class="token punctuation">(</span> <span class="token parameter">req <span class="token punctuation">,</span> res <span class="token punctuation">,</span> next</span> <span class="token punctuation">)</span> <span class="token punctuation">{</span> console <span class="token punctuation">.</span> <span class="token function">log</span> <span class="token punctuation">(</span> <span class="token string">'Middleware chung route'</span> <span class="token punctuation">)</span> <span class="token function">next</span> <span class="token punctuation">(</span> <span class="token punctuation">)</span> <span class="token punctuation">}</span> <span class="token punctuation">)</span> |
Router-level middleware
This middleware is similar to application -level middleware , except that the Router-level middleware is an instance of express.Router () .
To use the route level middlware we will also use router.use () or router.METHOD as the Application-level middleware .
Above, if everyone noticed, in the section about Route I also used router.use () to define the route prefix.
Declare middleware to run at any request:
1 2 3 4 5 | router <span class="token punctuation">.</span> <span class="token function">use</span> <span class="token punctuation">(</span> <span class="token keyword">function</span> <span class="token punctuation">(</span> <span class="token parameter">req <span class="token punctuation">,</span> res <span class="token punctuation">,</span> next</span> <span class="token punctuation">)</span> <span class="token punctuation">{</span> console <span class="token punctuation">.</span> <span class="token function">log</span> <span class="token punctuation">(</span> <span class="token string">'Middleware route'</span> <span class="token punctuation">)</span> <span class="token function">next</span> <span class="token punctuation">(</span> <span class="token punctuation">)</span> <span class="token punctuation">}</span> <span class="token punctuation">)</span> |
Error-handling middleware
This is the middleware for error handling. But when using this middleware, it is necessary to declare all 4 parameters err, req, res, next
. Although the next parameter is not used, this declaration is required for Express to recognize it as an error handling function.
Suppose when the server fails.
1 2 3 4 5 | app <span class="token punctuation">.</span> <span class="token function">use</span> <span class="token punctuation">(</span> <span class="token keyword">function</span> <span class="token punctuation">(</span> <span class="token parameter">err <span class="token punctuation">,</span> req <span class="token punctuation">,</span> res <span class="token punctuation">,</span> next</span> <span class="token punctuation">)</span> <span class="token punctuation">{</span> console <span class="token punctuation">.</span> <span class="token function">error</span> <span class="token punctuation">(</span> err <span class="token punctuation">.</span> stack <span class="token punctuation">)</span> res <span class="token punctuation">.</span> <span class="token function">status</span> <span class="token punctuation">(</span> <span class="token number">500</span> <span class="token punctuation">)</span> <span class="token punctuation">.</span> <span class="token function">send</span> <span class="token punctuation">(</span> <span class="token string">'Something broke!'</span> <span class="token punctuation">)</span> <span class="token punctuation">}</span> <span class="token punctuation">)</span> |
Third-party middleware
Use this middlware so that we add other necessary functionality to the app. Suppose we are adding a middleware called cookie-parser
.
Just run the command
1 2 | $ npm install cookie-parser |
Then declare at the application level or route level , it is up to you to define it. For example :
1 2 3 4 5 6 7 | <span class="token keyword">var</span> express <span class="token operator">=</span> <span class="token function">require</span> <span class="token punctuation">(</span> <span class="token string">'express'</span> <span class="token punctuation">)</span> <span class="token keyword">var</span> app <span class="token operator">=</span> <span class="token function">express</span> <span class="token punctuation">(</span> <span class="token punctuation">)</span> <span class="token keyword">var</span> cookieParser <span class="token operator">=</span> <span class="token function">require</span> <span class="token punctuation">(</span> <span class="token string">'cookie-parser'</span> <span class="token punctuation">)</span> <span class="token comment">// load the cookie-parsing middleware</span> app <span class="token punctuation">.</span> <span class="token function">use</span> <span class="token punctuation">(</span> <span class="token function">cookieParser</span> <span class="token punctuation">(</span> <span class="token punctuation">)</span> <span class="token punctuation">)</span> |
Other middleware can be found here .
5. Use template engines
If you have ever interacted with Ruby on Rails , the access to NodeJS template engines is quite easy. If Rails has erb , NodeJS has ejs , or Rails has slim and Node has pug . I see not too much difference in the use of template engines in Node if you word comes into contact with Rails .
To use the pug template engine just install
1 2 | $ npm install --save pug |
and declare
1 2 3 4 5 | <span class="token comment">//Khai báo đường dẫn đến thư mục chứa các template</span> app <span class="token punctuation">.</span> <span class="token function">set</span> <span class="token punctuation">(</span> <span class="token string">'views'</span> <span class="token punctuation">,</span> <span class="token string">'./views'</span> <span class="token punctuation">)</span> <span class="token comment">//Khai báo template engine sử dụng</span> app <span class="token punctuation">.</span> <span class="token function">set</span> <span class="token punctuation">(</span> <span class="token string">'view engine'</span> <span class="token punctuation">,</span> <span class="token string">'pug'</span> <span class="token punctuation">)</span> |
And this declaration is similar if you use any other template engines .
6, Express database
Express can be combined with many different types of databases. Assuming we connect to mysql
, we need to install the mysql module first.
1 2 | $ npm install mysql |
and declare to use
1 2 | <span class="token keyword">const</span> mysql <span class="token operator">=</span> <span class="token function">require</span> <span class="token punctuation">(</span> <span class="token string">'mysql'</span> <span class="token punctuation">)</span> <span class="token punctuation">;</span> |
To create a database
we need to declare some simple configurations such as hostname
, database name
..
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 | <span class="token keyword">var</span> mysql <span class="token operator">=</span> <span class="token function">require</span> <span class="token punctuation">(</span> <span class="token string">'mysql'</span> <span class="token punctuation">)</span> <span class="token punctuation">;</span> <span class="token keyword">var</span> con <span class="token operator">=</span> mysql <span class="token punctuation">.</span> <span class="token function">createConnection</span> <span class="token punctuation">(</span> <span class="token punctuation">{</span> host <span class="token operator">:</span> <span class="token string">"localhost"</span> <span class="token punctuation">,</span> user <span class="token operator">:</span> <span class="token string">"yourusername"</span> <span class="token punctuation">,</span> password <span class="token operator">:</span> <span class="token string">"yourpassword"</span> <span class="token punctuation">}</span> <span class="token punctuation">)</span> <span class="token punctuation">;</span> con <span class="token punctuation">.</span> <span class="token function">connect</span> <span class="token punctuation">(</span> <span class="token keyword">function</span> <span class="token punctuation">(</span> <span class="token parameter">err</span> <span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token keyword">if</span> <span class="token punctuation">(</span> err <span class="token punctuation">)</span> <span class="token keyword">throw</span> err <span class="token punctuation">;</span> console <span class="token punctuation">.</span> <span class="token function">log</span> <span class="token punctuation">(</span> <span class="token string">"Connected!"</span> <span class="token punctuation">)</span> <span class="token punctuation">;</span> con <span class="token punctuation">.</span> <span class="token function">query</span> <span class="token punctuation">(</span> <span class="token string">"CREATE DATABASE mydb"</span> <span class="token punctuation">,</span> <span class="token keyword">function</span> <span class="token punctuation">(</span> <span class="token parameter">err <span class="token punctuation">,</span> result</span> <span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token keyword">if</span> <span class="token punctuation">(</span> err <span class="token punctuation">)</span> <span class="token keyword">throw</span> err <span class="token punctuation">;</span> console <span class="token punctuation">.</span> <span class="token function">log</span> <span class="token punctuation">(</span> <span class="token string">"Database created"</span> <span class="token punctuation">)</span> <span class="token punctuation">;</span> <span class="token punctuation">}</span> <span class="token punctuation">)</span> <span class="token punctuation">;</span> <span class="token punctuation">}</span> <span class="token punctuation">)</span> <span class="token punctuation">;</span> |
This is just one example of how to combine Express with database . In fact, I see that people use NodeJS with MongoDB more often. To learn how to use and combine them you can see more at https://github.com/mongodb/node-mongodb-native .
Conclude
Above is my understanding of the Express framework .