Built-in middleware (json, urlencoded, static) in Express

Introduction

Built-in middleware helps your Express app understand and handle different types of data easily. It also helps serve files like images or stylesheets to users.

When you want to read JSON data sent from a web form or API.

When you need to process data sent from a form using URL-encoded format.

When you want to serve images, CSS, or JavaScript files directly to users.

Syntax

Express

app.use(express.json())
app.use(express.urlencoded({ extended: true }))
app.use(express.static('public'))

express.json() parses incoming JSON requests.

express.urlencoded() parses URL-encoded form data.

Examples

This lets your app read JSON data sent in the request body.

Express

app.use(express.json())

This parses simple URL-encoded form data.

Express

app.use(express.urlencoded({ extended: false }))

This serves files from the 'assets' folder to users.

Express

app.use(express.static('assets'))

Sample Program

This Express app uses built-in middleware to handle JSON and URL-encoded data. It also serves static files from the 'public' folder. You can test sending JSON to /json and form data to /form.

Express

import express from 'express'

const app = express()
const port = 3000

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

// Middleware to parse URL-encoded data
app.use(express.urlencoded({ extended: true }))

// Middleware to serve static files from 'public' folder
app.use(express.static('public'))

// Route to test JSON data parsing
app.post('/json', (req, res) => {
  res.send(`Received JSON with name: ${req.body.name}`)
})

// Route to test URL-encoded data parsing
app.post('/form', (req, res) => {
  res.send(`Received form data with email: ${req.body.email}`)
})

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

Important Notes

Use express.json() before routes that need JSON data.

Use express.urlencoded() to handle form submissions.

express.static() helps serve files like images or CSS without extra code.

Summary

Built-in middleware makes handling data and files easy in Express.

express.json() parses JSON request bodies.

express.urlencoded() parses form data.

express.static() serves static files.