Typed Request Handlers & Middleware

Express's own types describe the shape of a request/response, but leave req.body, req.params, and req.query as loosely typed by default. This lesson tightens that up and builds a reusable pattern for async route handlers.

Typing params, body, and query explicitly

import { Request, Response, NextFunction } from 'express';

app.get('/tasks/:id', (req: Request<{ id: string }>, res: Response) => {
  const id = req.params.id; // typed as string, not string | undefined
  res.json({ id });
});

Request's first generic parameter types req.params. Left as plain Request, req.params.id would be typed loosely, spelling it out here catches a typo like req.params.taskId at compile time instead of at 2am in production logs.

A reusable async handler wrapper

Express doesn't automatically catch a rejected Promise from an async route handler, an unhandled rejection just hangs or crashes the process.

function asyncHandler(
  fn: (req: Request, res: Response) => Promise<void>
) {
  return (req: Request, res: Response, next: NextFunction) => {
    fn(req, res).catch(next);
  };
}

app.get('/tasks/:id', asyncHandler(async (req, res) => {
  const task = await findTask(req.params.id);
  res.json(task);
}));

asyncHandler wraps any async function, catches whatever it throws or rejects with, and forwards it to next(err), Express's normal error-handling path, instead of letting it disappear silently.

Typed error-handling middleware

function errorHandler(err: unknown, _req: Request, res: Response, _next: NextFunction) {
  console.error(err);
  const message = err instanceof Error ? err.message : 'Unknown error';
  res.status(500).json({ error: message });
}

app.use(errorHandler);

Express recognizes error-handling middleware by its four parameters, err first, note it's typed unknown, not Error, anything can technically be thrown in JavaScript, so instanceof Error narrowing is what makes reading .message safe.