Route matching order matters in Express - Mini Project: Build & Apply

Route matching order matters

📖 Scenario: You are building a simple Express server that responds to different URL paths. The order in which you define routes affects which response the server sends.

🎯 Goal: Learn how to define routes in Express so that the server matches the correct route based on the order they are written.

📋 What You'll Learn

Create an Express app with three routes: a specific route, a parameter route, and a catch-all route

Define a variable to hold the port number

Use the correct order of route definitions so the server responds properly

Add the final line to start the server listening on the port

💡 Why This Matters

🌍 Real World

Web servers often have many routes. Defining them in the right order ensures users get the correct pages.

💼 Career

Backend developers must understand route matching to build reliable APIs and web servers.

1

Set up Express app and routes

Create an Express app by requiring express and calling it to get app. Then define three routes in this order: /about that sends "About page", /user/:id that sends "User ID: " plus the id parameter, and a catch-all * route that sends "Page not found".

Express

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

// Your code here

Need a hint?

Remember to require Express and create the app first. Then add the three routes in the order given.

2

Add port configuration

Create a constant called port and set it to 3000.

Express

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

app.get('/about', (req, res) => {
  res.send('About page');
});

app.get('/user/:id', (req, res) => {
  res.send('User ID: ' + req.params.id);
});

app.get('*', (req, res) => {
  res.send('Page not found');
});

// Your code here

Need a hint?

Just add a constant named port and assign it the number 3000.

3

Reorder routes to show matching order importance

Move the catch-all app.get('*', ...) route to be the first route defined, before /about and /user/:id. Keep the rest of the code unchanged.

Express

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

// Your code here to move the catch-all route first

const port = 3000;

Need a hint?

Cut the catch-all route and paste it before the other two routes.

4

Start the server listening

Add app.listen(port) with a callback that sends console message Server running on port 3000.

Express

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

app.get('*', (req, res) => {
  res.send('Page not found');
});

app.get('/about', (req, res) => {
  res.send('About page');
});

app.get('/user/:id', (req, res) => {
  res.send('User ID: ' + req.params.id);
});

const port = 3000;

// Your code here to start the server

Need a hint?

Use app.listen with port and a callback that logs the message.