w3resource

How to Build Web Servers using Express.js


Using Express.js with Node.js

Express.js is a minimal and flexible web application framework for Node.js. It simplifies the process of building web servers and APIs by providing robust features such as routing, middleware support, and HTTP utility methods. Express.js is widely used due to its scalability and ease of integration with various tools, making it an excellent choice for developing modern web applications.


Syntax:

To use Express.js, you first need to install it and then create an application. The basic structure is:

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

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

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

Examples and Code

1. Installing Express.js

Before starting, ensure that Node.js is installed on your system.

Code:

# Initialize a new Node.js project
npm init -y

# Install Express.js
npm install express

Explanation:

  • npm init -y creates a package.json file for managing dependencies.
  • npm install express adds Express.js to the project.

2. Creating a Basic Express.js Server

Code:

// Import the express module
const express = require('express');

// Create an instance of express
const app = express();

// Define the port to listen on
const port = 3000;

// Handle GET requests to the root URL
app.get('/', (req, res) => {
    // Send a response to the client
    res.send('Welcome to Express.js!');
});

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

Explanation:

  • app.get: Defines a route for handling GET requests to the / endpoint.
  • res.send: Sends a simple string response to the client.

3. Handling Multiple Routes

Code:

// Import express
const express = require('express');
const app = express();
const port = 3000;

// Define routes
app.get('/', (req, res) => {
    res.send('Welcome to the Home Page!');
});

app.get('/about', (req, res) => {
    res.send('This is the About Page.');
});

app.get('/contact', (req, res) => {
    res.send('Contact us at: [email protected]');
});

// Start the server
app.listen(port, () => {
    console.log(`Server running at http://localhost:${port}`);
});

Explanation:

  • Each route is defined using app.get with different URLs (/, /about, /contact).
  • Responses vary depending on the route.

4. Middleware in Express.js

Middleware functions are executed during the request-response lifecycle.

Code:

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

// Middleware function to log request details
app.use((req, res, next) => {
    console.log(`${req.method} request for '${req.url}'`);
    next(); // Pass control to the next middleware/route handler
});

// A simple route
app.get('/', (req, res) => {
    res.send('Middleware example in Express.js!');
});

app.listen(port, () => {
    console.log(`Server running at http://localhost:${port}`);
});

Explanation:

  • app.use: Adds a middleware function that logs incoming requests.
  • next: Ensures the request proceeds to the next middleware or route handler.

5. Handling JSON Data in Requests

Code:

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

// Middleware to parse JSON data
app.use(express.json());

// Route to handle POST requests
app.post('/api/data', (req, res) => {
    const data = req.body; // Access parsed JSON data
    res.send(`Received data: ${JSON.stringify(data)}`);
});

app.listen(port, () => {
    console.log(`Server running at http://localhost:${port}`);
});

Explanation:

  • express.json: Middleware to parse JSON payloads in incoming requests.
  • req.body: Holds the parsed data sent by the client.

Advanced Features of Express.js

    1. Routing with Parameters:

    Code:

    app.get('/user/:id', (req, res) => {
        const userId = req.params.id;
        res.send(`User ID is: ${userId}`);
    });
    
    • req.params: Access route parameters (e.g., :id).

    Displays a list of all available Node.js versions.

    2. Static Files:

    Serve static files like images, CSS, and JavaScript.

    Code:

    app.use(express.static('public'));
    

    Place files in the public folder to serve them directly.

    3. Error Handling:

    Code:

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

    Handles errors gracefully.


Benefits of Using Express.js

    1. Lightweight: Adds minimal overhead to Node.js.

    2. Scalability: Easily supports large-scale applications.

    3. Middleware Ecosystem: Supports a wide range of prebuilt and custom middleware.

    4. Integration: Works seamlessly with databases, templating engines, and other libraries.


Best Practices

    1. Use environment variables to manage configuration (e.g., dotenv library).

    2. Validate incoming data to prevent security vulnerabilities (e.g., using Joi or express-validator).

    3. Implement proper error handling for better debugging and user experience.

    4. Use HTTPS in production environments for secure communication.

Practical Guides to Node.js Snippets and Examples.



Follow us on Facebook and Twitter for latest update.