Route parameters in Express - Step-by-Step Execution

Concept Flow - Route parameters

Client sends request to URL with parameter

↓

Express matches route pattern with :param

↓

Extract parameter value from URL

↓

Pass parameter value to route handler

↓

Route handler uses parameter to respond

↓

Send response back to client

Express checks the URL for parts marked as parameters, extracts their values, and passes them to the handler to create a response.

Execution Sample

Express

const express = require('express');
const app = express();
app.get('/user/:id', (req, res) => {
  res.send(`User ID is ${req.params.id}`);
});

This code sets up a route that captures the user ID from the URL and sends it back in the response.

Execution Table

Step	Request URL	Route Pattern Matched	Extracted param	Handler Action	Response Sent
1	/user/42	/user/:id	id = '42'	Send 'User ID is 42'	'User ID is 42'
2	/user/abc	/user/:id	id = 'abc'	Send 'User ID is abc'	'User ID is abc'
3	/user/	No match	N/A	No handler called	404 Not Found

💡 Execution stops when no route matches or response is sent.

Variable Tracker

Variable	Start	After Request 1	After Request 2	After Request 3
req.params.id	undefined	'42'	'abc'	undefined

Key Moments - 2 Insights

Why does the route not match when the URL is '/user/'?

Because the route pattern '/user/:id' expects a value after '/user/', so '/user/' without a parameter does not match (see execution_table row 3).

How does Express know which part of the URL is the parameter?

Express uses the colon ':' in the route pattern to mark a parameter, so it extracts the corresponding part from the URL (see execution_table rows 1 and 2).

Visual Quiz - 3 Questions

Look at the execution table, what is req.params.id when the request URL is '/user/abc'?

A undefined

B '42'

C 'abc'

D null

💡 Hint

Check the 'Extracted param' column for step 2 in the execution_table.

At which step does the route pattern fail to match the request URL?

A Step 2

B Step 3

C Step 1

D None

💡 Hint

Look for 'No match' in the 'Route Pattern Matched' column in the execution_table.

If the route was changed to '/user/:id/profile', what would happen to the request URL '/user/42'?

A It does not match because '/profile' is missing

B It matches and extracts id = '42'

C It matches but id is undefined

D It matches and extracts id = 'profile'

💡 Hint

Think about the exact pattern matching shown in the execution_table and how extra path parts affect matching.

Concept Snapshot

Express route parameters use ':' to mark parts of the URL as variables.
When a request matches, Express extracts these values into req.params.
Handlers access parameters via req.params.paramName.
If the URL part is missing, the route does not match.
This allows dynamic URLs like '/user/123' to be handled easily.

Full Transcript

In Express, route parameters let you capture parts of the URL as variables. When a client sends a request like '/user/42', Express matches it to a route pattern like '/user/:id'. The ':id' means Express will take the '42' from the URL and put it in req.params.id. The route handler can then use this value to create a response, such as sending back 'User ID is 42'. If the URL does not have the parameter part, like '/user/', the route won't match and Express will not call the handler. This way, you can create flexible routes that respond differently based on URL parts.

Practice

1. What does req.params represent in an Express route handler?

easy

A. An object containing route parameter values from the URL

B. A function to send responses to the client

C. A middleware to parse JSON bodies

D. A method to define static file paths

Solution

1. Step 1: Understand route parameters

   Route parameters are parts of the URL defined with a colon, like /user/:id.

2. Step 2: Accessing parameters in Express

   Express stores these dynamic values in req.params as an object with keys matching parameter names.

3. Final Answer:

   An object containing route parameter values from the URL -> Option A

4. Quick Check:

   req.params = route parameters object [OK]

Hint: Remember: req.params holds URL dynamic parts [OK]

Common Mistakes:

• Confusing req.params with req.body
• Thinking req.params is a function
• Using req.query instead of req.params

2. Which of the following is the correct way to define a route with a parameter named postId in Express?

easy

A. app.get('/post/:postId', (req, res) => { ... })

B. app.get('/post/postId', (req, res) => { ... })

C. app.get('/post/?postId', (req, res) => { ... })

D. app.get('/post/*postId', (req, res) => { ... })

Solution

1. Step 1: Syntax for route parameters

   Express uses a colon : before the parameter name to mark it as dynamic.

2. Step 2: Check each option

   app.get('/post/:postId', (req, res) => { ... }) uses /:postId correctly. Options A, B, and D use incorrect syntax for parameters.

3. Final Answer:

   app.get('/post/:postId', (req, res) => { ... }) -> Option A

4. Quick Check:

   Colon before param name = correct route param syntax [OK]

Hint: Use colon before param name in route path [OK]

Common Mistakes:

• Omitting the colon before parameter name
• Using query syntax instead of route params
• Using wildcard * incorrectly for parameters

3. What will be the output of the following Express route handler when a GET request is made to /user/42?

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

medium

A. User ID is undefined

B. User ID is 42

C. User ID is :id

D. Error: Cannot read property 'id' of undefined

Solution

1. Step 1: Identify the route parameter

   The route defines a parameter :id, so req.params.id will hold the value from the URL.

2. Step 2: Check the request URL and response

   The URL /user/42 sets id to '42', so the response sends 'User ID is 42'.

3. Final Answer:

   User ID is 42 -> Option B

4. Quick Check:

   req.params.id = '42' from URL [OK]

Hint: Route param value replaces :id in req.params [OK]

Common Mistakes:

• Expecting req.params to be undefined
• Using req.query instead of req.params
• Forgetting to use backticks for template literals

4. Consider this Express route:

app.get('/product/:productId', (req, res) => {
  const id = req.params.product;
  res.send(`Product ID: ${id}`);
});

What is the problem with this code?

medium

A. req.params is not accessible in GET routes

B. The route path is missing a colon before productId

C. res.send cannot send strings

D. The route parameter name and req.params key do not match

Solution

1. Step 1: Check route parameter name

   The route defines parameter productId, so req.params will have a key named productId.

2. Step 2: Check usage of req.params

   The code uses req.params.product, which does not exist, so id will be undefined.

3. Final Answer:

   The route parameter name and req.params key do not match -> Option D

4. Quick Check:

   Param name mismatch causes undefined value [OK]

Hint: Match param name exactly in req.params key [OK]

Common Mistakes:

• Using wrong key name from req.params
• Forgetting colon in route path
• Assuming req.params is always empty

5. You want to create an Express route that handles URLs like /order/123/item/456 to get both orderId and itemId. Which route definition and parameter access is correct?

hard

A. app.get('/order/:order/item/:item', (req, res) => { res.send(`Order: ${req.params.orderId}, Item: ${req.params.itemId}`); })

B. app.get('/order/:orderId/item/:itemId', (req, res) => { res.send(`Order: ${req.params.item}, Item: ${req.params.order}`); })

C. app.get('/order/:orderId/item/:itemId', (req, res) => { res.send(`Order: ${req.params.orderId}, Item: ${req.params.itemId}`); })

D. app.get('/order/:orderId/item/:itemId', (req, res) => { res.send(`Order: ${req.query.orderId}, Item: ${req.query.itemId}`); })

Solution

1. Step 1: Define route with two parameters

   The route must have :orderId and :itemId to capture both values from the URL.

2. Step 2: Access parameters correctly

   Use req.params.orderId and req.params.itemId to get the values inside the handler.

3. Final Answer:

   app.get('/order/:orderId/item/:itemId', (req, res) => { res.send(`Order: ${req.params.orderId}, Item: ${req.params.itemId}`); }) -> Option C

4. Quick Check:

   Route params and req.params keys must match [OK]

Hint: Use matching param names in route and req.params [OK]

Common Mistakes:

• Mixing req.params with req.query
• Using wrong parameter names in handler
• Defining route without all needed parameters