🚂 Introduction to Express

What Is Express?

Express is a small, unopinionated web framework for Node.js. "Unopinionated" means it gives you a handful of powerful tools — routing, a middleware system, and response helpers — but doesn't force you into a particular folder layout, database, or template engine. You assemble the pieces you need and leave the rest.

It has been the default choice for Node web servers for over a decade. Countless tutorials, tools, and hosting guides assume it, and its middleware ecosystem is enormous. Learning Express is the fastest on-ramp to writing real backends and APIs in JavaScript.

What Express actually gives you

• Routing — match a URL path and HTTP method to a function, without hand-writing if chains.
• Middleware — a pipeline of functions that each request flows through, for logging, parsing, auth, and more.
• Response helpers — res.json(), res.status(), res.redirect(), and friends, so you rarely touch raw headers.
• Static file serving and view rendering built in.

Express vs. Raw Node

The quickest way to feel Express's value is to build the same tiny server twice. Here is a server that answers a few routes using only the http module you met last lesson.

Raw Node.js

// server-vanilla.js — the http module, no framework
const http = require('http');

const server = http.createServer((req, res) => {
  // We must parse and branch on the URL ourselves:
  if (req.url === '/' && req.method === 'GET') {
    res.writeHead(200, { 'Content-Type': 'text/html' });
    res.end('<h1>Hello, World!</h1>');
  } else if (req.url === '/api/users' && req.method === 'GET') {
    const users = [{ id: 1, name: 'Ada' }, { id: 2, name: 'Grace' }];
    res.writeHead(200, { 'Content-Type': 'application/json' });
    res.end(JSON.stringify(users));   // manual stringify + manual header
  } else {
    res.writeHead(404, { 'Content-Type': 'text/html' });
    res.end('<h1>404 Not Found</h1>');
  }
});

server.listen(3000, () => console.log('Server on http://localhost:3000'));

Express

// server-express.js — the same behaviour, far less plumbing
const express = require('express');
const app = express();

app.get('/', (req, res) => {
  res.send('<h1>Hello, World!</h1>');   // sets 200 + Content-Type for you
});

app.get('/api/users', (req, res) => {
  const users = [{ id: 1, name: 'Ada' }, { id: 2, name: 'Grace' }];
  res.json(users);                        // stringifies + sets JSON header
});

// Anything unmatched falls through to this catch-all 404:
app.use((req, res) => {
  res.status(404).send('<h1>404 Not Found</h1>');
});

app.listen(3000, () => console.log('Server on http://localhost:3000'));

Both listen on port 3000 and return the same bytes. But notice what disappeared in the Express version: no manual URL string comparisons, no writeHead with hand-typed content types, no JSON.stringify. Every route reads like a plain sentence — "on a GET to /api/users, send this JSON."

Setting Up a Project

Express is a single npm package. Setup is three commands.

Step 1 — Create and initialise the project

mkdir express-demo
cd express-demo
npm init -y

npm init -y writes a package.json with sensible defaults (the -y means "yes to every prompt"). That file is the manifest of your project — its name, scripts, and dependency list.

Step 2 — Install Express

npm install express

This downloads Express into node_modules/ and records it under "dependencies" in package.json:

// package.json (excerpt)
{
  "name": "express-demo",
  "version": "1.0.0",
  "type": "commonjs",
  "scripts": {
    "start": "node app.js",
    "dev": "node --watch app.js"
  },
  "dependencies": {
    "express": "^4.21.0"
  }
}

Step 3 — A dev script that restarts on save

Node 18+ ships a built-in --watch flag that reloads your server whenever a file changes, so you no longer need nodemon for basic work:

npm run dev   # runs: node --watch app.js

Your First Server

Create app.js. This version shows the pieces you'll use every day: the built-in JSON parser, static file serving, a couple of routes, and a route with a URL parameter.

// app.js
const express = require('express');
const app = express();
const PORT = process.env.PORT || 3000;

// --- Middleware (runs on every request, top to bottom) ---
app.use(express.json());              // parse JSON bodies into req.body
app.use(express.static('public'));    // serve files from ./public

// --- Routes ---
app.get('/', (req, res) => {
  res.send('<h1>Welcome to Express!</h1>');
});

// A dynamic segment: :id becomes req.params.id
app.get('/users/:id', (req, res) => {
  res.send(`User ID: ${req.params.id}`);
});

app.get('/api/info', (req, res) => {
  res.json({ name: 'Express Demo API', version: '1.0.0', status: 'active' });
});

// Reads the JSON body that express.json() parsed for us
app.post('/api/echo', (req, res) => {
  res.status(201).json({ youSent: req.body });
});

// --- Start listening ---
app.listen(PORT, () => {
  console.log(`Server running on http://localhost:${PORT}`);
});

Run it and visit the routes:

node app.js
# then open http://localhost:3000/  and  http://localhost:3000/api/info
# stop the server with Ctrl+C

Test the POST route from another terminal with curl:

curl -X POST http://localhost:3000/api/echo \
  -H "Content-Type: application/json" \
  -d '{"hello":"world"}'

{"youSent":{"hello":"world"}}

The Request Pipeline

The single most important mental model in Express is the pipeline: every incoming request flows through your registered middleware functions in order, then into a matching route handler, which sends a response. This is the diagram to burn into memory.

Each middleware function receives (req, res, next). It can inspect or modify the request, and then either call next() to pass control down the pipeline, or end the cycle by sending a response. A route handler is just the final middleware that sends the response.

// A middleware is a function of (req, res, next)
app.use((req, res, next) => {
  console.log(`${req.method} ${req.url}`);   // do some work...
  next();                                    // ...then hand off to the next stage
});

We'll spend the whole next lesson on middleware. For now, the key takeaway is order matters: middleware you register earlier runs earlier. That's why the JSON parser goes near the top and the 404 catch-all goes at the very bottom.

Project Structure

A single app.js is perfect while you're learning. As an app grows, you split it into folders so each part has one job. You'll build up to this over the coming lessons — here's the destination:

express-demo/
├── node_modules/
├── public/            # static assets served as-is (css, images)
├── src/
│   ├── routes/        # route definitions (express.Router)
│   ├── controllers/   # the functions that handle each route
│   ├── middleware/    # custom middleware (auth, logging, errors)
│   └── models/        # data access
├── app.js             # wires everything together
└── package.json

The guiding idea is separation of concerns: routes say which URL, controllers say what to do, middleware handles cross-cutting work like auth. Don't build all of this today — just know it's where you're headed, so today's single file doesn't feel like the final shape.

Practice & Quiz

# Setup
mkdir greet-api && cd greet-api
npm init -y
npm install express

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

app.use(express.json());

app.get('/hello/:name', (req, res) => {
  res.json({ message: `Hello, ${req.params.name}!` });
});

app.post('/greet', (req, res) => {
  const { name } = req.body;
  if (!name) {
    return res.status(400).json({ error: 'name is required' });
  }
  res.status(201).json({ message: `Hello, ${name}!` });
});

app.listen(3000, () => console.log('Listening on http://localhost:3000'));

// Place this AFTER all your other routes:
app.use((req, res) => {
  res.status(404).json({ error: `No route for ${req.method} ${req.originalUrl}` });
});

Best Practices & Pitfalls

✅ Do

• Register body parsers (express.json()) and security middleware near the top of the file
• Read the port from process.env.PORT with a local fallback
• Use res.json() for data and res.status(code) to be explicit about outcomes
• Put a catch-all 404 handler last, after every real route
• Add a start and dev script to package.json so running the app is one command

❌ Don't

• Install body-parser — the built-in parsers replaced it years ago
• Send a response and call next() in the same handler — pick one
• Hard-code secrets or ports directly in source files
• Forget to stop an old server (Ctrl+C) before starting a new one on the same port

Error: listen EADDRINUSE: address already in use :::3000

Summary

📚 Additional Resources

• Express — Installing
• Express — Hello World example
• Express — Basic routing
• MDN — Express/Node introduction

🚀 What's Next?

You've stood up a server and seen requests flow through it. Next we go deep on the two mechanisms that make Express powerful: defining rich routes and building the middleware pipeline that every request passes through — Routing and Middleware.