Introduction to Express.js
Express.js is a fast, unopinionated, and minimalist web framework for Node.js. It's a powerful tool for building web applications and APIs, and it's widely used due to its simplicity and flexibility. In this tutorial, we'll go through the basics of setting up an Express.js application.
Prerequisites
Before we begin, make sure you have Node.js installed on your system. You can download it from https://nodejs.org/en, node.js comes with npm, which is the package manager we'll use to install Express.js. Additionally, you'll need Postman to test your API endpoints. You can download Postman from https://www.postman.com/downloads.
STEP 1: Set Up Your Project
1.Install Node.js: If you haven't installed Node.js yet, download and install it from the official Node.js website (https://nodejs.org/en).
2.Download Postman: Download and install Postman from the official Postman website (https://www.postman.com/downloads).
3.create a new project directory: Open your terminal (Git bash for windows user) and create a new directory for your project.
Terminal:
mkdir MyExpressApp
Navigate to this directory.
Terminal:
cd MyExpressApp
4.Initialize a new Node.js project: This will create a package.json file.
Now you might ask what is "package.json" file? It is a file which holds various metadata relevant to the project and is used to manage the project's dependencies, versions, and more. If a developer wants to see the what are the versions do you have used in your project then he/she can navigate to your package.json directly.
Terminal:
npm init -y
this command will simply create a package.json file.
STEP 2: Install Express.js
1. Now that we have our project set up, we need to install Express.js
Terminal:
npm install express
This command will install Express.js in your file named as MyExpressApp.
2. Now create a file named as "index.js" or you can keep the name as per your choice. for that write the below command on your terminal or Git Bash.
Terminal:
touch index.js
It will create a file named as "index.js"
3. Now open the file "MyExpressApp" on Visual Studio Code by writing the below command.
Terminal:
code .
It will open the file on Visual Studio Code.
You can check out the process till step 2 that I have done using Git Bash on this GitHub Gist: https://gist.github.com/Sahilll94/d4c834597cdc0fc93bde5171c86f367d
STEP 3:Create Your First Express Application
1. Open "index.js".
2. Require Express: at the top of your "index.js" file, requires the Express module.
JavaScript:
const express = require ("express");
3. Create an instance of Express: This instance will be our application.
JavaScript:
const app=express();
Step 4: Define Routes
What is Routes? It is how we define the different endpoints of our application. Let's create a simple route that responds with "Hello World!" when accessed.
领英推荐
1. Create a GET route: Now I think you all are familiar with the METHOD like POST, GET, PUT, DELETE, etc. These are the most common HTTP methods used to send data, request data, update the data, and delete the data. for instance, When a client sends a 'GET' request to the server, it asks for data from the server. The server processes the request and sends back the data in the form of HTML page, JSON format, etc.
JavaScript:
app.get('/home', function(req,res){
res.send('Hello World!");
});
Step 5: Listen to a Port
Finally, we need to tell our application to listen to a specific port. we will use port 3000 for this example.
Now you might ask what is a port? it is a communication endpoint used by a host like me in a network to differentiate multiple services running on the same machine. Suppose, I am running 5 servers like same as index.js with different task then I can't use a single port for it right? Therefore, we use various ports for various services/tasks.
JavaScript:
app.listen(3000);
OR
app.listen(3000,() => {
console.log('server is listening on https://localhost:3000');
});
There are two methods, but I like the first one more.
Now, on the Visual Studio Code, On the top left side, there will be a "terminal" option, click on it and click on "New Terminal" and then write the below command on it and make sure you are into your "MyExpressApp" directory.
Terminal:
node index.js
It will run your server locally at 3000 port.
The below might be visible on the terminal after running the command:
PS E:\MyExpressApp> node index.js
Server is running on https://localhost:3000
This starts the server and makes it listen for incoming connections on port 3000. When the server is running, you can open a web browser and navigate to "https://localhost:3000/home" to see the response.
Here, you will find the complete code for "index.js" file : https://gist.github.com/Sahilll94/c6d212c6e10fba772494103f0debb53b
TESTING THE GET request with Postman
1. Open Postman: Launch the Postman application.
2. create a new GET request:
- Select 'GET' from the dropdown menu.
- Enter 'https://localhost:3000/home' in the request URL field.
3. Send the request: Click the Send Button. You should see the response "Hello World!" in the response body.
To check how to use postman and get the whole process click on the link where you will see the overview of what I have done on the Postman: https://drive.google.com/file/d/1JWpAcpdmrep92O10xMlXGIu7yRpToG2b/view?usp=sharing
This process demonstrates how to set up and handle a 'GET' request in a express.js application, and how to test it using Postman.
There is an another module named as "Next.js" which is also useful for handling backends but both the modules have it's own advantages.
CONCLUSION
In conclusion, Express.js provides a robust framework for building web applications with Node.js. Its simplicity and flexibility make it a popular choice among developers for handling server-side logic and routing. By understanding the basics of routing and middleware, you can effectively create powerful APIs and web applications.
Thank you for reading! I hope this introduction to Express.js has been helpful in understanding its core concepts and getting started with your own projects.
~ Sahil