Express.js tutorial for Beginners

Abhigyan Singh 01st Oct 2020

Frameworks are the best option for rapid development in any platform. It speeds up your development and makes it easier to add new functionalities in new or existing applications. It plays a better role where you are dealing with complex applications and getting difficult to implement in a coding manner. Today we are going to tell you Express.js which is a framework of Node.js. Express.js is the most popular framework is used to make web and mobile applications.

You can make a web application very quickly by using Express.js. It simplifies and reduces the line of code which already available in Node.js. It’s is very useful to make APIs and where you want to return your data in JSON format. Express allows us to set up middleware to handle HTTP (Like getting, POST) requests. Here will describe all things from installing to creating application following as shown below:

1.    What is Express.js?

2.    Why we Use?

3.    Where we should use it?

4.    Who is using it?

5.    How we install it?

6.    How and Why we Create Server in Express.js and bind it to individual Port.

7.    Simple Hello World Program in Express.js.

8.    How we embedded HTML page with Express.

What is Express.js?

Express is a module that works with Node.js. It's basically the heart and soul of Node.js is used for rapid development. Express is classified as middleware. It basically allows you to handle URLs (also called URL routing).

Why we Use Expressjs?

1.    It is a lightweight web application web framework to help organize your web application into an MVC architecture on the server-side.

2.    You can use a variety of choices for your template like EJS, Jade, and Dust.js.

3.    Express.js basically helps you managing everything from routes to handling requests and views.

4.    It takes less time and lines of code than Node.js when you write REST APIs in the server.

When we should use it?

1.    When you want to make an application in which the counting of the concurrent users is very high then you can choose express.js as a backend framework which improves your application performance.

2.    When you want to make APIs very quickly and want to return data in JSON format.

3.    Using express you can save writing more lines of code and time.

Who is using it?

Many Organizations are using Express.js to build their web and mobile applications like IBM, Accenture, Uber Cab, Myntra.
How we install it?

Assuming that you have already installed Node.js if you have not installed it then have a look at our previous Article to install node. To check Node.js is install or not type the following command in cmd or terminal as shown below:


To install Express.js type following command using npm as shown below:

npm install express

Above command will install express in your system, if you want to install it globally then type –g after above given command like:

npm install express –g

Now we have installed Express.js successfully. Let’s go to next step.

How and Why we Create Server in Express.js and bind it to individual Port?

We need a server to run any program weather it’s any language same as in Express.js you have to need server which we create by programming and define or choose port number. To understand this create new folder and place it anywhere. In my case folder name is express and placed in c drive.Make server.js file in express folder of c drive and following code in server.js to create server and bind it port 8081 as following:


Copy following code in server.js:

var express = require('express');
var app = express();
app.get('/', function (req, res) {
res.send('Hello World');
})
var server = app.listen(8081, function () {
console.log("Server is Running on 8081 Port.")

});

Here we loaded express module and created instance of express assigned it to app variable. app. Listen is method is used to listen on a particular port of created instance. To run server.js type following command as shown below:

This shows your server is running and listening on port 8081.

Simple Hello World Program in Express.js

To print hello world in express just put following code in server.js and run it from terminal or cmd  as shown below:

var express = require('express');
var app = express();
app.get('/', function (req, res) {
res.send('Hello World');
})
var server = app.listen(8081, function () {
console.log("Server is Running on 8081 Port.")

});

Here app.getis function will respond hello world when GET request is made to homepage. It requires two parameter for GET request, first one is path to accept request and second is handler function of HTTP request. Handler function takes two argument, first is request which is done by browser or user and second is response will send as a response of request.

Open https://localhost:8081/ to see output of above program will be following as shown below:

How we embedded HTML page with Express.

Create login.html file and put following code in login.html file as shown below:

<form action="https://localhost:8081/get_details">
<table align="center">
<tr>
<td>Frist Name </td>
<td><input type="text" name="first_name" ></td>
</tr>
<tr>
<td>Last Name </td>
<td><input type="text" name="last_name" ></td>
</tr>
<tr>
<td>Email Id </td>
<td><input type="text" name="email" ></td>
</tr>
<tr>
<td> Password</td>
<td><input type="password" name="password" ></td>
</tr>
<tr align="center">
<td colspan="2"><input type="submit" name="submit" value="Submit" ></td>
</tr>
</table>
</form>

And put following code in server.js as shown below:

var express = require('express');
var app = express();
app.get('/login.html', function (req, res) {
res.sendFile( __dirname + "/" + "login.html" );
})

app.get('/get_details', function (req, res) {

// Prepare output in JSON format
response = {
first_name:req.query.first_name,
last_name:req.query.last_name,
email:req.query.email,
password:req.query.password,
};
console.log(response);
res.end(JSON.stringify(response));
})
var server = app.listen(8081, function () {
console.log("Server is Running on 8081 Port.")

});

Now run the server.js file from cmd or terminal and type https://localhost:8081/login.html will show html page, fill all required details will show as follows:

After Submitting it will redirect to https://localhost:8081/get_details as mentioned in form action will show following page:

We return response in JSON format if you want to convert then you can convert as desired format.

If you have any query regarding Express.js and want to know more about it. Feel free to comment below. We will publish another article on Express.js according your requirement.

Authored By Abhigyan Singh

He is a continuous blogger and has blogged on different topic. He loves to surf Internet and always trying to get new Idea about new Technology and Innovations and sharing these great information to all the technology lovers.

Also on DiscussDesk