Understanding Routing in Express.js

Welcome to the world of Express.js, where building dynamic web applications becomes a seamless experience. In this article, we'll dive into the fundamental concepts of routing, unraveling the 'why' and 'how' with clear syntax and code structure examples.

In the end of this article you will understand :

• Routing in Express

• Why we do routing?

• How to do?(Syntax and code structure)

Before we embark on our journey through Express.js routing, it's crucial to grasp the basic concepts. If you haven't already, consider reading this mini-article on basic routing in Express

What is Routing?

In Express, routing is like creating a map for your website. It's the way we tell the website how to react when someone visits a particular URL or clicks on a link. Just as roads guide you to different places in a city, routing in Express guides users to different parts of your web application. It's like having a set of instructions that helps everything run smoothly and ensures users end up where they intend to go.

Why Do We Do Routing in Express?

Imagine your website is like a big, bustling city, and every page on your website is like a different place in that city. Now, think about how people find their way around a city – they follow streets and signs.

Routing in Express is like creating those streets and signs for your website. It's a way to tell your website how to react when someone goes to a specific web address or clicks on a link. Just like roads guide you to different places in a city, routing helps users find their way to different parts of your website.

Terms We Need to Know:

1. Route Method:

   • The type of HTTP request that a route should respond to, such as GET, POST, DELETE, and others. Each method corresponds to a specific action.

2. Route Paths:

   • The specific URLs or paths that routes are associated with. For example, /users could be a route path that handles actions related to users.

3. Route Parameters:

   • Variables in the route path that capture values from the URL. They are denoted by a colon (:) followed by a parameter name. For instance, /users/:userId captures the user's ID from the URL.

4. Route Handlers:

   • Functions that define what happens when a specific route is accessed. These functions receive the request (req) and response (res) objects and execute actions accordingly.

5. Response Methods:

   • Functions provided by the response (res) object to send data back to the client. For instance, res.send() sends a simple response, while res.json() sends a JSON response.

In simpler terms, routing ensures that when someone wants to go to a particular place on your website, they get there smoothly without getting lost. It's like giving clear directions so that visitors reach the right destination on your site, making their experience pleasant and easy.

How We Do Routing

Let's demystify routing in Express by examining a simple example:

const express = require('express');
const app = express();

// Define route handlers
app.get('/', (req, res) => {
  res.send('Hello, World!');
});

app.post('/users', (req, res) => {
  // Handle POST request to /users
  res.send('Creating a new user');
});

// Start the server
const port = 3000;
app.listen(port, () => {
  console.log(`Server is listening on port ${port}`);
});

Let's break down the step-by-step process for setting up routing in an Express.js application:

Step 1: Import Express

const express = require('express');

• Import the Express.js framework to have access to its features.

Step 2: Create an Express Application Instance

const app = express();

• Create an instance of the Express application using the express() function. This instance (app) will be used to define routes and configure the application.

Step 3: Define Route Handlers

app.get('/', (req, res) => {
  res.send('Hello, World!');
});

app.post('/users', (req, res) => {
  // Handle POST request to /users
  res.send('Creating a new user');
});

• Use the app.get and app.post methods to define route handlers.

• The first route handler responds to a GET request at the root path ('/') with the message 'Hello, World!'.

• The second route handler responds to a POST request at the '/users' path with the message 'Creating a new user'.

Step 4: Start the Server

const port = 3000;
app.listen(port, () => {
  console.log(`Server is listening on port ${port}`);
});

• Specify a port number (e.g., 3000) for the server to listen on.

• Use the app.listen method to start the server and listen for incoming requests.

• The callback function logs a message to the console once the server is running.

  Explanation:

  1. const port = 3000;:

     • This line defines a variable port and sets it to the value 3000. The port variable represents the port number on which your Express server will listen for incoming requests. Port 3000 is commonly used during development, but you can choose any available port.

  2. app.listen(port, () => { ... });:

     • The app.listen method starts the Express application and makes it listen for incoming HTTP requests on the specified port.

     • port: The first argument is the port number (in this case, the variable port that we defined earlier).

     • () => { ... }: The second argument is a callback function that will be executed once the server starts listening. This callback is optional, and it's common to use it to log a message indicating that the server is running.

  3. console.log(Server is listening on port ${port});:

     • Inside the callback function, there's a console.log statement that prints a message to the console. This message indicates that the server is now listening on the specified port.

And there you have it! If the explanation above makes sense to you, consider yourself well-versed in the fundamentals of routing within Express.js. Bravo! You've successfully grasped the essentials of Express.js routing.