Express Routing Basics

# CHAPTER 5

Express Routing Basics #

1. Introduction #

2. Learning Objectives #

• Map endpoints using GET, POST, PUT, and DELETE methods.

• Define dynamic route parameters (e.g., /users/:id).

• Extract data securely from req.params.

• Handle 404 "Not Found" scenarios for undefined routes.

3. Beginner-Friendly Explanation #

• Action (HTTP Method): "I want to READ." (GET)

• Location (The Path): "Drawer named 'Users'." (/users)

4. Basic Routing (The CRUD Verbs) #

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

// READ data
app.get('/api/articles', (req, res) => {
    res.send('Fetching all articles...');
});

// CREATE data
app.post('/api/articles', (req, res) => {
    res.send('Creating a new article...');
});

// UPDATE data
app.put('/api/articles', (req, res) => {
    res.send('Updating the article...');
});

// DELETE data
app.delete('/api/articles', (req, res) => {
    res.send('Deleting the article...');
});

*Notice how the URL path (/api/articles) is exactly the same! The only difference is the HTTP Method. This is the core principle of REST API design.*

5. Dynamic Route Parameters (req.params) #

// The ':id' acts as a wildcard placeholder
app.get('/api/users/:id', (req, res) => {
    
    // We extract the value from the req.params object
    const userId = req.params.id;
    
    res.send(`You requested the profile for user ID: ${userId}`);
});

*If a user visits /api/users/99, the browser will display "You requested the profile for user ID: 99".*

6. Multiple Route Parameters #

app.get('/api/users/:userId/posts/:postId', (req, res) => {
    const { userId, postId } = req.params; // ES6 Destructuring
    
    res.send(`Fetching Post #${postId} authored by User #${userId}`);
});

*(URL: /api/users/5/posts/10)*

7. Handling 404 Not Found #

// Define all your actual routes first...
app.get('/home', ...);
app.get('/about', ...);

// Catch-all 404 Route (MUST be at the bottom)
// The '*' means "match absolutely anything"
app.get('*', (req, res) => {
    res.status(404).send('404 Error: The page you are looking for does not exist.');
});

8. Backend Workflow: API Naming Conventions #

• Bad: app.get('/api/get-users')

• Good: app.get('/api/users')

• Bad: app.post('/api/create-post')

• Good: app.post('/api/posts')

9. Best Practices #

• Route Ordering: Because Express reads top-to-bottom, static routes MUST go before dynamic routes. If you place app.get('/users/:id') before app.get('/users/admin'), and a user visits /users/admin, Express will think the word "admin" is a dynamic ID and trigger the wrong route!

10. Common Mistakes #

• Testing POST/PUT/DELETE in a Browser: Beginners often write an app.post('/api/users') route, type that URL into Google Chrome, and get a "Cannot GET /api/users" error. Web browsers can only make GET requests via the address bar. To test POST, PUT, or DELETE routes, you must use HTML Forms or a tool like Postman.

11. Exercises #

1. 1. Explain the architectural benefit of using identical URLs (e.g., /api/products) with different HTTP methods (GET vs POST) rather than writing unique URLs for every action (e.g., /api/get-products and /api/create-product).

12. Coding Challenges #

• Challenge: Write an Express route that handles a DELETE request for a specific product. The URL should utilize a dynamic parameter for the product ID. Inside the route, use res.send() to return a message confirming the deletion of that specific ID.

13. MCQs with Answers #

14. Interview Questions #

• Q: Explain how Route Parameters (req.params) work in Express. Provide a use case where chaining multiple parameters in a single URL is necessary.

• Q: Why is the physical ordering of route definitions critical in an Express application, particularly concerning dynamic wildcards versus static endpoints?

15. FAQs #

16. Summary #

17. Next Chapter Recommendation #