Express.js tutorial for Beginners

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

You can make web application very quickly by using Express.js. It simplifies and reduce 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 to set up middleware to handle HTTP (Like GET, 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 are 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 to 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 light weight 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 server.

When we should use it?

1.    When you want to make application in which counting of concurrent user is very high then you can choose express.js as 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 are using it?

Many Organization 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 our previous Article to install node. To check Node.js is install or not type 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'); // loading express module
var app = express(); // assign express module functionalities to app variable to create 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 http://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="http://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 http://localhost:8081/login.html will show html page, fill all required details will show as follows:

After Submitting it will redirect to http://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.

 

Share this Article on Social Media

All of my Scripts are ready to customized as per your requirement. Feel free to contact for script customization.

Contact me at discussdesk@gmail.com

"Note : It will be charged as per your customization requirement :)"

Get Updates, Scripts & Other Tutorials to Directly to your Email

Over 20000+ Happy Readers already subscribed. (We don't send spam email). Every email subscriber can get our latest updates and download our 100+ scripts.

Comments