Route matching order matters in Express - Interactive Code Practice

Practice - 5 Tasks

1fill in blank

easy

Complete the code to define a route that responds to GET requests at the root URL.

Express

app.[1]('/', (req, res) => {
  res.send('Home page');
});

Drag options to blanks, or click blank then click option'

Aget

Bpost

Cput

Ddelete

Attempts:

3 left

💡 Hint

Common Mistakes

Using post instead of get for a route that should respond to GET requests.

Confusing HTTP methods like put or delete for simple page retrieval.

The get method defines a route for HTTP GET requests, which is used to retrieve data like the home page.

2fill in blank

medium

Complete the code to define a route that matches any URL starting with '/user/'.

Express

app.get('/user/[1]', (req, res) => {
  res.send('User profile');
});

Drag options to blanks, or click blank then click option'

A*

B+

C?

D:id

Attempts:

3 left

💡 Hint

Common Mistakes

Using '*' which matches everything but is less specific.

Using '?' or '+' which are regex quantifiers, not route parameters.

The :id syntax defines a route parameter that matches any value in that part of the URL.

3fill in blank

hard

Fix the error in the route order so that the specific route is matched before the general one.

Express

app.get('/[1]', (req, res) => {
  res.send('Specific route');
});

app.get('/:id', (req, res) => {
  res.send('General route');
});

Drag options to blanks, or click blank then click option'

Auser/:profile

Buser/profile

C:user/profile

D*

Attempts:

3 left

💡 Hint

Common Mistakes

Defining general parameter routes before specific routes causes the specific routes to never match.

Using parameter syntax in the specific route unnecessarily.

The specific route /user/profile must be defined before the general /:id route to match correctly.

4fill in blank

hard

Fill both blanks to create a middleware that logs requests only for routes starting with '/api'.

Express

app.[1]('/[2]', (req, res, next) => {
  console.log('API request:', req.method, req.url);
  next();
});

Drag options to blanks, or click blank then click option'

Ause

Bget

Capi

Duser

Attempts:

3 left

💡 Hint

Common Mistakes

Using 'get' instead of 'use' for middleware.

Using the wrong path prefix like '/user' instead of '/api'.

Middleware uses app.use and the path /api to apply to all routes starting with '/api'.

5fill in blank

hard

Fill all three blanks to define routes so that '/about' shows the about page, and all other paths show a 404 message.

Express

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

app.[2]((req, res) => {
  res.status(404).send('[3]');
});

Drag options to blanks, or click blank then click option'

Aabout

Buse

CPage not found

Dget

Attempts:

3 left

💡 Hint

Common Mistakes

Defining the 404 handler with 'get' instead of 'use'.

Placing the 404 handler before the specific routes.

Using the wrong message for 404.

The route '/about' is defined with get. The 404 handler uses app.use without a path to catch all unmatched routes and send a 'Page not found' message.