How to Use Express.js in Node.js

Beginner’s Guide to Using Express.js with Node.js

Continuing our earlier discussion on how to make your own server, let’s dive deeper into Express.js, a popular framework that simplifies this process. If you’ve been experimenting with building your own Node.js server, you’ll notice that while Node.js is powerful, handling requests, routing, and middleware can get messy. Express.js was built to simplify this.

Photo by Denny Müller on Unsplash

Overview

1. What is Express.js?
2. Why Choose Express.js?
3. Inside Express.js: How It Powers Your Applications
4. Key Points to Note:
5. Lesser-Known Information About Express.js
6. Getting Started with Express.js — The Basics
7. Common Developer Questions and Solutions and Doubts
8. Conclusion

What is Express.js?

Express.js is a simple and flexible web framework built on Node.js. It helps you create web applications and APIs easily. Whether you’re building a single-page, multi-page, or mixed web app, Express.js makes writing server-side code faster and simpler.

Solving Common Node.js Challenges with Express.js

To understand the problems Express.js solves, let’s first consider the challenges developers faced when building web-server and API’s with pure Node.js.

1. Complex Routing: In vanilla Node.js, routing (directing requests to the appropriate request handler) requires manual parsing of URL and HTTP methods. As your application gets bigger, this can get messy and difficult to manage.
2. Lack of Standardization: Without the framework, the developer might implement the same functionality or features in different ways. This can make it hard for other developers to understand and make it more complex to keep the code organized.
3. Repetitive Boilerplate Code: Many common tasks or features in web development require a similar code structure. Writing these from scratch for each project is time-consuming.
4. Middleware Integration: Integrating third-party or creating custom middleware can be complex without a standardized system.
5. Performance Optimized: Optimizing a Node.js app for performance requires deep knowledge and careful implementation.

Express.js addresses these issues by providing:

• A Simple and easy-to-implement routing System.
• A Standardized structure for building an optimized web application.
• Build-in methods for common HTTP operations.
• Build-in middleware support.
• Performance optimizations out of the box.

Here’s a quick comparison of handling a simple GET request in Node.js vs Express.js:

// Node.js
const http = require('http');

const server = http.createServer((req, res) => {
  if (req.method === 'GET' && req.url === '/hello') {
    res.writeHead(200, { 'Content-Type': 'text/plain' });
    res.end('Hello, World!');
  } else {
    res.writeHead(404, { 'Content-Type': 'text/plain' });
    res.end('Not Found');
  }
});

server.listen(3000, () => {
  console.log('Server running on port 3000');
});

---------------------------------------------------------------------------

// Express.js
const express = require('express');
const app = express();

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

app.listen(3000, () => {
  console.log('Server running on port 3000');
});

As you can see, Express.js significantly reduces the amount of code needed and provides a more intuitive API. As you can see above example.

Why Choose Express.js?

So, why do developers like Express.js? Here are some reasons:

• Flexibility: You can easily adjust it to fit your application’s needs.
• Ease of Use: Its simple design helps you start quickly and build even complex apps with ease.
• Efficient Development: It makes handling requests, routing, and adding features faster and simpler.

Here’s a real-world example of how Express.js simplifies API development:

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

// Middleware for parsing JSON bodies
app.use(express.json());

// Simple in-memory database
let users = [];

// GET all users
app.get('/users', (req, res) => {
  res.json(users);
});

// POST a new user
app.post('/users', (req, res) => {
  const newUser = req.body;
  users.push(newUser);
  res.status(201).json(newUser);
});

// GET a specific user
app.get('/users/:id', (req, res) => {
  const user = users.find(u => u.id === parseInt(req.params.id));
  if (!user) return res.status(404).send('User not found');
  res.json(user);
});

app.listen(3000, () => console.log('Server running on port 3000'));

This simple API demonstrates how easy it is to set up routes, handle different HTTP methods, and manage data with Express.js.

Inside Express.js: How It Powers Your Applications

So, let’s take some time to understand how Express.js works.

To understand how Express.js works internally, we need to dive into its architecture and core components. Express.js builds upon Node.js’s event-driven, non-blocking I/O model, adding layers of abstraction to simplify web application development.

Core Concepts :

1. Application Object: The express() function sets up an Express application, which is the core part of an Express.js app. This application object provides tools for:

- Handling different types of web requests.

- Setting up middleware (extra functions that run during requests).

- Displaying HTML pages.

- Using a template engine for dynamic content.

- Changing app settings.

2. Router: A Router is a tool in web development that helps organize and handle different URLs in your application. It acts like a mini-app that decides what to do when users visit specific paths, and it can use middleware to perform tasks before sending users to their final destination.

3. Middleware: These functions work with the request (req), response (res), and a next function to control what happens next in handling a web request.

4. Request and Response Objects: Express.js extends Node.js’s native request and response objects, adding helpful properties and methods.

Now We will understand the flow of Express.js.Let’s walk through it step by step:

1. Client Request: It is an HTTP request sent from the client (e.g. a browser or API consumer). The request could be for data (like fetching user details) or resources (like downloading files).
2. Express Application: The request reaches to Express.js application, which is the core of the server handling requests and sending responses. In Express, we create the app using const app = express();.\
3. Middleware: Middleware is a function that processes the request before it reaches the actual route handler. Express middleware can modify the request or response object, terminate the request-response cycle, or pass control to the next middleware function.

• Middleware can handle tasks such as logging, authentication, and parsing request bodies.
• The decision here is whether to proceed to the next middleware or route or return a response (e.g. if authentication fails).

Flow Options:

• If no errors occur, the request is passed along (via next()) to the next middleware or reaches the routing phase.
• If there is an error during middleware execution, it skips to the Error Handling Middleware.

4. Routing: Once middleware processing is done, Express checks the request path and HTTP method (GET, POST, etc.) to match it with the defined routes.

Decision Branches:

• Match: If a route matches, the request is passed to the appropriate Route Handler.
• No Match: If no route matches, the request is passed to a 404 Handler, which handles Not Found responses (i.e., the requested resource doesn’t exist).

5. Route Handler: If the request matches a route, the corresponding route handler processes the request. This is where the actual business logic is applied (e.g., fetching data from a database or performing operations based on the request).

6. 404 Handler: If no route is found for the request, it is passed to a 404 handler that informs the client that the requested resource does not exist.

• This handler typically sends a response with a 404 Not Found status.

7. Error Handling Middleware: If an error occurs at any point (in middleware or a route handler), the request is passed to this special type of middleware that deals specifically with errors.

• Error-handling middleware usually has four arguments: err, req, res, and next. It allows you to send a proper error response (like a 500 Internal Server Error) or handle the error gracefully.

8. Response: Whether it’s a successful route handler, a 404 error, or an error handler, the response is eventually sent back to the client. This response could be data (JSON, HTML), a file, or an error message.

9. Client Receives Response: Finally, the client receives the response. If the process is completed successfully, the client gets the desired data or confirmation. If an error occurs, the client receives an appropriate error message.

Key Points to Note:

Middleware: The heart of Express’s extensibility. They are like layers that can inspect, modifyor terminate a request before it reaches its destination.

Error Handling: Errors are handled separately by special middleware functions that ensure the client gets proper error responses instead of the server crashing or hanging.

Routing: Express relies on route matching to process requests, making it easy to handle different types of requests (e.g., /users, /products).

Lesser-Known Information About Express.js

Built-in Middleware: Express.js has predefined middleware functions that you may not know about. For instance, use express.static() to serve static files, and express.json() to parse JSON request bodies.

Numerous App Instances: It is possible to generate multiple Express application objects in a single Node.js process. This can be utilized for updating your API version or operating various applications on separate ports.

Sub-applications: Express.js enables the creation of sub-applications using express.Router(). These can be considered small Express applications that are used for creating modular, mountable route handlers.

Error Handling: Express.js utilizes a specific type of middleware design for managing errors. Should you create a middleware function with the parameters (err, req, res, next), Express will identify it as an error-handling middleware.

Trust Proxy: Express.js includes a trust proxy feature, which, when activated, instructs the framework to trust the X-Forwarded-* headers. This is essential if your app is located behind a reverse proxy.

Getting Started with Express.js — The Basics

Now that we’ve covered the theory, let’s get our hands dirty with some code! We’ll create a simple Express.js application that demonstrates routing, middleware, and error handling.

First, make sure you have Node.js installed on your system. Then, follow these steps:

1. Create a new directory for your project and navigate into it:

mkdir express-demo
cd express-demo

2. Initialize a new Node.js project:

npm init -y

3. Install Express.js:

npm install express

4. Create a new file called app.js and add the following code:

const express = require('express');  // Import Express.js
const app = express();  // Create an Express application instance
const port = 5000;  // Set the port number

// Middleware to log incoming requests
app.use((req, res, next) => {
  console.log(`${new Date().toISOString()} - ${req.method} ${req.url}`);  // Log request method and URL
  next();  // Pass control to the next middleware/route
});

// Route for the home page
app.get('/', (req, res) => {
  res.send('Welcome to our Express.js demo!');  // Send response for the root URL
});

// Route with a URL parameter (e.g., /greet/John)
app.get('/greet/:name', (req, res) => {
  res.send(`Hello, ${req.params.name}!`);  // Send personalized greeting
});

// Custom error handler middleware
app.use((err, req, res, next) => {
  console.error(err.stack);  // Log the error stack trace
  res.status(500).send('Something broke!');  // Respond with a 500 Internal Server Error
});

// Start the server and listen on the specified port
app.listen(port, () => {
  console.log(`Server running at http://localhost:${port}`);  // Log when the server is up
});

5. Run your application:

node app.js

Now, open your browser and navigate to http://localhost:3000. You should see the welcome message.

Output of Index Route

Now, we will try other routes also like

Greet Route Output

Key Concepts:

• Middleware logs every request and passes it to the next handler.
• Routes handle specific paths (/ and /greet/:name).
• Error Handling catches and responds to errors.
• A server listens on port 5000 for incoming requests.

Common Developer Questions and Solutions and Doubts

Q1. How Does Express.js Leverage Node.js?

Event-Driven Nature

Express.js utilizes the event-driven, non-blocking I/O infrastructure of Node.js. This implies that it has the ability to manage multiple client requests at the same time without needing to wait for each request to finish, which makes it very scalable.

• Question: How does Express manage multiple requests at once?

Answer: Express uses Node.js’s event loop. When a request comes in, it’s processed asynchronously. Each request triggers an event, which is handled by an event listener, allowing Express to handle other requests while waiting for responses to come back.

Middleware Architecture

Middleware functions in Express.js are the core building blocks. They act as intermediaries that process requests before they reach the final route handler.

• Question: What exactly is middleware, and how does it work?

Answer: Middleware functions are functions that run during the request-response cycle. You can use them to:

• Modify request/response objects
• End the request-response cycle
• Pass control to the next middleware in the stack (using next()).

Q2. How do I define routes in Express.js?

Answer: Express routes define how an application responds to various HTTP requests. Here’s how you define a simple GET route:

// Route for the home page
app.get('/', (req, res) => {
  res.send('Welcome to our Express.js demo!');  // Send response for the root URL
});

Common Doubts:

• Why not use pure Node.js for routing? In Node.js, you would need to manually parse the URL and HTTP method, which is cumbersome and error-prone.
• Can I define multiple routes in one file? Yes, but you can also separate them into different files for better structure using express.Router(). For example:

const express = require('express');
const router = express.Router();

router.get('/about', (req, res) => {
  res.send('About Page');
});

module.exports = router;

Q3: How do middleware functions chain together in Express.js?

Answer: Middleware functions are executed in order, and they must call next() to pass control to the next middleware or route handler. Middleware can be global (applies to every request) or route-specific.

Example of middleware:

// Middleware to log incoming requests
app.use((req, res, next) => {
  console.log(`${new Date().toISOString()} - ${req.method} ${req.url}`);  // Log request method and URL
  next();  // Pass control to the next middleware/route
});

Common Doubts:

• What happens if next() is not called? The request will hang, and no response will be sent to the client.
• Can middleware handle errors? Yes, an error-handling middleware has four parameters: (err, req, res, next). Example:

// Custom error handler middleware
app.use((err, req, res, next) => {
  console.error(err.stack);  // Log the error stack trace
  res.status(500).send('Something broke!');  // Respond with a 500 Internal Server Error
});

Q4: How does Express handle HTTP requests?

Answer: Express abstracts handling of HTTP requests with methods like GET, POST, PUT, DELETE, etc. It processes the requests through middleware and routes to respond.

Common Doubts:

• How can I send different types of responses? You can send responses using methods like res.send(), res.json(), res.render() (for rendering views), or res.sendFile() (for serving files).
• What if I need to handle file uploads or large payloads? Use middleware like body-parser or multer for parsing request bodies or handling file uploads.

Q5: How does Express handle errors?

Answer: Errors in Express are handled using a dedicated middleware. You can define an global error-handling function at the end of your middleware stack.

app.use((err, req, res, next) => {
  console.error(err.stack);
  res.status(500).send('Server Error!');
});

Common Doubts:

• What if an error occurs in a route? If an error occurs, pass it to the error middleware using next(err).
• How can I handle 404 errors? You can define a 404 handler using middleware:

app.use((req, res) => {
  res.status(404).send('Page Not Found');
});

Q6: How can I organize my Express project for large applications?

Answer: For large applications, it’s a good practice to use the Model-View-Controller (MVC) structure or organize routes, controllers, and services into separate folders.

Folder structure example:

└── src
    ├── controllers
    │   ├── userController.js
    │   └── productController.js
    ├── routes
    │   ├── userRoutes.js
    │   └── productRoutes.js
    └── app.js

Common Doubts:

• Can I load routes dynamically? Yes, you can load routes dynamically using fs.readdirSync() or create modules that export routes.

Q7: What are some performance considerations when using Express.js?

Answer: Express is fast, but you should be aware of performance bottlenecks in a large-scale app.

Common Issues:

• Blocking the Event Loop: Avoid heavy computations or synchronous code in middleware or route handlers, as this can block the event loop and slow down the server.
• Memory leaks: Be careful with improperly scoped variables and unnecessary object creation.

Q8: How can I implement authentication in Express.js?

Answer: You can implement authentication using middleware. A popular choice is JWT (JSON Web Tokens) for token-based authentication.

Example using jsonwebtoken:

const jwt = require('jsonwebtoken');
app.post('/login', (req, res) => {
  const token = jwt.sign({ userId: user._id }, 'secretKey');
  res.json({ token });
});

Common Doubts:

• How can I protect routes? You can create a middleware that checks for the token before accessing protected routes:

app.use('/dashboard', (req, res, next) => {
  const token = req.headers['authorization'];
  if (!token) return res.status(401).send('Unauthorized');
  jwt.verify(token, 'secretKey', (err, decoded) => {
    if (err) return res.status(403).send('Invalid token');
    req.userId = decoded.userId;
    next();
  });
});

Q9: What are some unknown facts about Express.js?

• Order of middleware matters: Middleware is executed in the order it is declared. Be mindful of where middleware appears in your code.
• Express is just an abstraction: Express doesn’t replace Node.js’s HTTP module; it enhances it by adding a layer of abstraction. Under the hood, Express uses http.createServer() from Node.js.

Potential Issues Developers Might Face:

1. Request hanging: If you forget to call next() in middleware, the request will hang.

• Solution: Always ensure you call next() if the middleware isn’t terminating the request.

2. Uncaught errors: If an error occurs in an asynchronous function but isn’t passed to the next() function, it can crash the server.

• Solution: Use try-catch blocks or async/await with error-handling middleware.

3. Misconfigured routes: Incorrect order of routes can lead to unexpected behavior.

• Solution: Ensure that specific routes come before wildcard routes (e.g., /api/users/:id should be defined before /api/*).

Conclusion

In conclusion, Express.js is a powerful and flexible framework that simplifies server-side development and takes your Node.js projects to the next level. By understanding its purpose, benefits, and inner workings, you can unlock the full potential of Express.js and build fast, scalable, and maintainable web applications.

Hey there! 😊 If you enjoyed this article, give it a 👏 and share it with your friends! Your support means a lot to me and really helps keep the content coming. If you’d like to show a little extra love, consider buying me a coffee! ☕️🥳 Your generosity fuels my passion for creating more awesome articles. Grab your coffee here: 👉 Buy Me a Coffee.

I’d love to hear your thoughts — please comment below and let me know what you think! 🤜💬 Let’s keep learning and growing together. 💡✨

🚀 Stay connected and follow me for more updates! Don’t miss out — like, share, and comment on my posts. Here’s where you can find me:

🔗 LinkedIn
📸 Instagram
🧵 Threads
📘 Facebook
✍️ Medium

Your support means the world to me! Thanks for being amazing! 🌟🚀