Built-in Middleware (express.json express.urlencoded)

Express comes with some built-in middleware functions that handle common web development tasks. Think of them as ready-made tools that save you from writing repetitive code. The most commonly used built-in middleware are express.json() and express.urlencoded().

Why Do We Need Body Parsing Middleware?

When a client sends data to your server (like a form submission or JSON data), that data comes in the request body. Without middleware to parse this data, it would be difficult to access. Built-in middleware automatically parses incoming requests and makes the data available in req.body.

express.json() – Parsing JSON Data

This middleware parses incoming requests with JSON payloads. It's essential when building REST APIs that accept JSON data.

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

// Use express.json() middleware
app.use(express.json());

app.post('/api/users', (req, res) => {
  // Now req.body contains the parsed JSON data
  console.log(req.body); // { name: "John", email: "john@example.com" }
  res.send('User created');
});

app.listen(3000);

Now, when a client sends a POST request with JSON data like:

{
  "name": "John",
  "email": "john@example.com"
}

Express will parse it and make it available in req.body.

express.urlencoded() – Parsing Form Data

This middleware parses incoming requests with URL-encoded payloads, typically sent by HTML forms (with content-type application/x-www-form-urlencoded).

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

// Use express.urlencoded() middleware
// extended: true allows parsing of nested objects
app.use(express.urlencoded({ extended: true }));

app.post('/submit-form', (req, res) => {
  // Now req.body contains the parsed form data
  console.log(req.body); // { name: "John", message: "Hello" }
  res.send('Form submitted');
});

The extended option determines how nested objects are parsed. With extended: true, you can handle rich objects and arrays.

express.static() – Serving Static Files

Another useful built-in middleware is express.static() which serves static files like HTML, CSS, images, and JavaScript.

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

// Now files in the 'public' folder are accessible
// http://localhost:3000/style.css serves public/style.css

Combining Multiple Built-in Middleware

You can use multiple built-in middleware together. Order matters!

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

// Parse JSON data
app.use(express.json());

// Parse form data
app.use(express.urlencoded({ extended: true }));

// Serve static files
app.use(express.static('public'));

// Now your app can handle all these types of requests!

Two Minute Drill

express.json() parses incoming JSON requests and populates req.body.
express.urlencoded() parses form submissions and populates req.body.
express.static() serves static files from a directory.
These are built-in, so no need to install additional packages.
Use them at the beginning of your app to ensure all routes have access to parsed data.

Practice Exercises Interview Questions

Need more clarification?

Drop us an email at career@quipoinfotech.com

Welcome to Quipoin

Quipoin Menu

Built-in Middleware (express.json express.urlencoded)

Need more clarification?