javascript
52 lines · 10 steps
Versioning an API with Express Routers
Two independent Express Routers hold v1 and v2 handlers, then mount under a parent router for clean URL versioning.
Explained by
highlit
1const express = require('express');
2
3const v1 = express.Router();
4
5v1.get('/users', async (req, res, next) => {
6 try {
7 const users = await req.db.users.findAll();
8 res.json(users.map(({ id, name }) => ({ id, name })));
9 } catch (err) {
10 next(err);
11 }
12});
13
14v1.post('/users', async (req, res, next) => {
15 try {
16 const user = await req.db.users.create({ name: req.body.name });
17 res.status(201).json({ id: user.id, name: user.name });
18 } catch (err) {
19 next(err);
20 }
21});
22
23const v2 = express.Router();
24
25v2.get('/users', async (req, res, next) => {
26 try {
27 const page = Number(req.query.page) || 1;
28 const perPage = 25;
29 const { rows, count } = await req.db.users.findAndPaginate({ page, perPage });
30 res.json({
31 data: rows.map(({ id, name, email }) => ({ id, name, email })),
32 meta: { page, perPage, total: count },
33 });
34 } catch (err) {
35 next(err);
36 }
37});
38
39v2.post('/users', validateUserPayload, async (req, res, next) => {
40 try {
41 const user = await req.db.users.create(req.body);
42 res.status(201).json({ id: user.id, name: user.name, email: user.email });
43 } catch (err) {
44 next(err);
45 }
46});
47
48const api = express.Router();
49api.use('/v1', v1);
50api.use('/v2', v2);
51
52module.exports = api;
01 / 01
STEP 01
‹ swipe to step through ›
Walkthrough
Space play
←→ step
click any line
Three takeaways
- 1Separate Router instances let you evolve an API version without touching older ones.
- 2Forwarding caught errors to next(err) keeps async route handlers from crashing the process.
- 3Mounting routers under path prefixes turns version names into a single composition step.
Related explainers
javascript
const ROLE_PERMISSIONS = { admin: ['users:read', 'users:write', 'billing:read', 'billing:write'], manager: ['users:read', 'billing:read'], member: ['users:read'],
Role-based permissions middleware in Express
authorization
middleware
rbac
Intermediate
9 steps
javascript
function attachThousandSeparators(input, { locale = 'en-US' } = {}) { const formatter = new Intl.NumberFormat(locale); const groupSep = formatter.format(11111).replace(/\d/g, '')[0] || ','; const decimalSep = formatter.format(1.1).replace(/\d/g, '')[0] || '.';
Live thousand separators without losing the caret
dom
intl
caret-preservation
Advanced
8 steps
go
package handlers import ( "net/http"
Serving embedded static meta files in Gin
embedding
static assets
http caching
Intermediate
6 steps
javascript
import { useReducer, useEffect } from "react"; const initialState = { status: "idle", data: null, error: null };
Building a data-fetching hook in React
custom-hooks
usereducer
data-fetching
Intermediate
9 steps
ruby
module Paginatable extend ActiveSupport::Concern private
A reusable pagination concern in Rails
pagination
concerns
http-headers
Intermediate
8 steps
javascript
const express = require('express'); const app = express(); app.get('/health', (req, res) => res.json({ status: 'ok' }));
Graceful shutdown in an Express server
graceful-shutdown
signal-handling
connection-tracking
Advanced
9 steps
Share this explainer
Here's the card — post it anywhere.
Made with highlit — turn any snippet into a walkthrough like this in about a minute.
Explain your code
Embed this explainer
Drop the interactive walkthrough into a blog or docs. Views never cost a credit.
<iframe src="https://highlit.co/explainers/versioning-an-api-with-express-routers-explained-javascript-5ad2/embed?autoplay=1" width="100%" height="520" loading="lazy" style="border:0"></iframe>
Autoplay is on by default — add ?autoplay=0 to start paused.