Resource-based URL design in Express - Step-by-Step Execution

Concept Flow - Resource-based URL design

Client sends HTTP request

↓

Server matches URL to resource

↓

Identify HTTP method (GET, POST, PUT, DELETE)

↓

Perform action on resource

↓

Send response back to client

This flow shows how a server handles requests by matching URLs to resources and HTTP methods to actions.

Execution Sample

Express

app.get('/books', (req, res) => {
  res.send('List of books');
});

This code handles a GET request to the /books URL and sends back a list of books.

Execution Table

Step	HTTP Method	URL	Matched Resource	Action	Response Sent
1	GET	/books	books	Retrieve list	'List of books'
2	POST	/books	books	Create new book	'Book created'
3	GET	/books/123	book with id 123	Retrieve single book	'Book details for 123'
4	PUT	/books/123	book with id 123	Update book	'Book 123 updated'
5	DELETE	/books/123	book with id 123	Delete book	'Book 123 deleted'
6	GET	/authors	authors	Retrieve list	'List of authors'
7	GET	/books/abc	book with id abc	Invalid ID	'Error: Invalid book ID'
8	GET	/unknown	none	No match	'404 Not Found'

💡 Requests stop after response is sent or 404 if no resource matches.

Variable Tracker

Variable	Start	After 1	After 2	After 3	After 4	After 5	After 6	After 7	After 8
Matched Resource	none	books	books	book 123	book 123	book 123	authors	book abc	none
Action	none	Retrieve list	Create new book	Retrieve single book	Update book	Delete book	Retrieve list	Invalid ID	No match
Response Sent	none	'List of books'	'Book created'	'Book details for 123'	'Book 123 updated'	'Book 123 deleted'	'List of authors'	'Error: Invalid book ID'	'404 Not Found'

Key Moments - 3 Insights

Why does the server use different HTTP methods (GET, POST, PUT, DELETE) for the same URL path?

Because the same URL path represents a resource, and the HTTP method tells the server what action to perform on that resource, as shown in execution_table rows 1-5.

What happens if the URL does not match any resource?

The server responds with a 404 Not Found error, as shown in execution_table row 8 where the URL '/unknown' has no matched resource.

Why is '/books/abc' considered invalid in the example?

Because 'abc' is not a valid book ID format, so the server returns an error message instead of resource data, as shown in execution_table row 7.

Visual Quiz - 3 Questions

Look at the execution table, what response is sent when a DELETE request is made to '/books/123'?

A 'List of books'

B 'Book 123 updated'

C 'Book 123 deleted'

D '404 Not Found'

💡 Hint

Check the row where HTTP Method is DELETE and URL is '/books/123' in the execution_table.

At which step does the server respond with 'Error: Invalid book ID'?

A Step 5

B Step 7

C Step 3

D Step 8

💡 Hint

Look for the row with URL '/books/abc' in the execution_table.

If a new resource '/magazines' is added, which part of the flow changes?

A Matched Resource and Action steps

B Client sends HTTP request step

C Send response back to client step

D No change needed

💡 Hint

Adding a new resource affects how the server matches URLs and performs actions, as shown in the concept_flow.

Concept Snapshot

Resource-based URL design uses URLs to represent resources.
HTTP methods (GET, POST, PUT, DELETE) define actions on these resources.
URLs like /books or /books/123 identify collections or single items.
Server matches URL and method to perform the correct action.
Responses depend on resource and action.
Unmatched URLs return 404 errors.

Full Transcript

Resource-based URL design means using URLs to represent things like books or authors. The server looks at the URL and the HTTP method to decide what to do. For example, GET /books asks for a list of books, POST /books creates a new book, GET /books/123 gets one book, PUT /books/123 updates it, and DELETE /books/123 removes it. If the URL does not match any resource, the server sends a 404 error. If the ID is invalid, it sends an error message. This design helps organize web APIs clearly and predictably.

Practice

1. What is the main idea behind resource-based URL design in Express?

easy

A. Combine all actions into one URL

B. Use random URLs for each action

C. Avoid using HTTP methods in URLs

D. Organize URLs around data items like users or books

Solution

1. Step 1: Understand resource-based URL design

   This design organizes URLs by resources such as users or books, making them clear and meaningful.

2. Step 2: Compare options

   Options B, C, and D do not follow this clear organization principle.

3. Final Answer:

   Organize URLs around data items like users or books -> Option D

4. Quick Check:

   Resource-based URLs = Organize by data items [OK]

Hint: Think: URLs should name data items clearly [OK]

Common Mistakes:

• Thinking URLs should be random or unclear
• Ignoring HTTP methods in design
• Putting all actions under one URL

2. Which Express route correctly follows resource-based URL design to get a user by ID?

easy

A. app.get('/user/:id', handler)

B. app.get('/getUser', handler)

C. app.post('/user/:id', handler)

D. app.delete('/user', handler)

Solution

1. Step 1: Identify correct HTTP method and URL pattern

   To get a user by ID, use GET method and URL with resource and ID: '/user/:id'.

2. Step 2: Check options

   app.get('/user/:id', handler) uses GET and '/user/:id' which is correct. Others use wrong methods or URLs.

3. Final Answer:

   app.get('/user/:id', handler) -> Option A

4. Quick Check:

   GET + /resource/:id = correct get route [OK]

Hint: GET method + resource path with :id for fetching [OK]

Common Mistakes:

• Using POST instead of GET for fetching
• Using generic paths like '/getUser'
• Missing :id parameter in URL

3. What will be the response if the following Express route is called with DELETE /books/123?

app.delete('/books/:bookId', (req, res) => {
  res.send(`Deleted book ${req.params.bookId}`);
});

medium

A. 404 Not Found error

B. "Deleted book :bookId"

C. "Deleted book 123"

D. SyntaxError

Solution

1. Step 1: Understand route and HTTP method

   The route listens for DELETE requests on '/books/:bookId'. The parameter bookId will be '123' from the URL.

2. Step 2: Check response behavior

   The handler sends a string with the bookId inserted, so response is 'Deleted book 123'.

3. Final Answer:

   "Deleted book 123" -> Option C

4. Quick Check:

   DELETE /books/:id returns message with id [OK]

Hint: Route param replaces :bookId in response [OK]

Common Mistakes:

• Confusing parameter name with literal string
• Expecting 404 if route exists
• Thinking syntax error occurs

4. Identify the error in this Express route for updating a user:

app.put('/users', (req, res) => {
  const id = req.params.id;
  res.send(`Updated user ${id}`);
});

medium

A. req.params.id should be req.body.id

B. Missing :id parameter in URL path

C. res.send should be res.json

D. Using PUT instead of POST

Solution

1. Step 1: Check URL path and parameter usage

   The route URL is '/users' but code tries to read req.params.id which requires ':id' in path.

2. Step 2: Identify mismatch

   Since ':id' is missing in URL, req.params.id will be undefined causing error or wrong behavior.

3. Final Answer:

   Missing :id parameter in URL path -> Option B

4. Quick Check:

   URL must include :id to access req.params.id [OK]

Hint: Check if URL path matches params used in code [OK]

Common Mistakes:

• Ignoring missing :id in URL
• Confusing req.params with req.body
• Thinking PUT is wrong method here

5. You want to design Express routes for a blog API with posts and comments. Which URL design best follows resource-based principles for updating a comment with ID 45 on post with ID 10?

hard

A. app.put('/posts/10/comments/45', handler)

B. app.put('/updateComment', handler)

C. app.put('/comments/45', handler)

D. app.put('/posts/comments', handler)

Solution

1. Step 1: Understand nested resource URLs

   Comments belong to posts, so URL should reflect this hierarchy: '/posts/:postId/comments/:commentId'.

2. Step 2: Check options for correct pattern

   app.put('/posts/10/comments/45', handler) uses full nested path with IDs, matching resource-based design. Others miss nesting or IDs.

3. Final Answer:

   app.put('/posts/10/comments/45', handler) -> Option A

4. Quick Check:

   Nested resource URLs = /posts/:postId/comments/:commentId [OK]

Hint: Nest related resources in URL with IDs [OK]

Common Mistakes:

• Using generic action names in URL
• Omitting parent resource ID
• Ignoring resource hierarchy