URL building with url_for in Flask - Mini Project: Build & Apply

URL building with url_for in Flask

📖 Scenario: You are creating a simple Flask web app that has multiple pages. You want to build URLs dynamically using Flask's url_for function instead of hardcoding links. This helps keep your app flexible and easy to maintain.

🎯 Goal: Build a Flask app with two routes: / and /about. Use url_for to generate the URL for the about page inside the home page's HTML link.

📋 What You'll Learn

Create a Flask app with two routes: home and about

Use url_for inside the home route to build the URL for the about page

Return simple HTML strings from both routes

The home page should have a link to the about page using the URL built by url_for

💡 Why This Matters

🌍 Real World

Web developers use url_for to build URLs dynamically so links stay correct even if routes change. This avoids hardcoding URLs and reduces bugs.

💼 Career

Understanding url_for is essential for Flask developers to write maintainable and flexible web applications.

1

Set up the Flask app and home route

Import Flask from flask. Create a Flask app called app. Define a route for / with a function called home that returns the string 'Home Page'.

Flask

# Your code here

Hint

Start by importing Flask and creating the app instance. Then add a route for the home page that returns a simple string.

2

Add the about route

Define a new route for /about with a function called about that returns the string 'About Page'.

Flask

from flask import Flask

app = Flask(__name__)

@app.route('/')
def home():
    return 'Home Page'

# Your code here

Hint

Add a new route for the about page that returns a simple string.

3

Import url_for and build URL in home route

Import url_for from flask. Inside the home function, use url_for('about') to get the URL for the about page. Return an HTML string with an anchor tag linking to this URL and the text 'About'.

Flask

from flask import Flask

app = Flask(__name__)

@app.route('/')
def home():
    # Use url_for to build the about page URL
    # Your code here

@app.route('/about')
def about():
    return 'About Page'

Hint

Import url_for and use it inside the home function to create a link to the about page.

4

Add app run block

Add the standard Flask app run block at the bottom: if __name__ == '__main__': and inside it call app.run(debug=True).

Flask

from flask import Flask, url_for

app = Flask(__name__)

@app.route('/')
def home():
    about_url = url_for('about')
    return f'About'

@app.route('/about')
def about():
    return 'About Page'

# Your code here

Hint

Add the block to run the Flask app when the script is executed directly.

Practice

1. What is the main purpose of Flask's url_for function?

easy

A. To start the Flask server

B. To directly write HTML links in templates

C. To build URLs using the names of route functions

D. To handle form data submission

Solution

1. Step 1: Understand what url_for does

   url_for creates URLs by using the function names of routes, not hardcoded strings.

2. Step 2: Compare with other options

   Starting the server or handling forms are unrelated to URL building. Writing HTML links manually is not what url_for does.

3. Final Answer:

   To build URLs using the names of route functions -> Option C

4. Quick Check:

   url_for builds URLs = C [OK]

Hint: Remember: url_for uses function names, not raw URLs [OK]

Common Mistakes:

• Thinking url_for starts the server
• Confusing url_for with form handling
• Assuming url_for writes HTML links directly

2. Which of the following is the correct syntax to build a URL for a route function named profile with a dynamic user ID parameter user_id using url_for?

easy

A. url_for(profile, 42)

B. url_for('profile', id=42)

C. url_for('profile', 42)

D. url_for('profile', user_id=42)

Solution

1. Step 1: Recall url_for syntax for dynamic parts

   Dynamic parts are passed as keyword arguments matching the route parameter names, e.g., user_id=42.

2. Step 2: Check each option

   url_for('profile', user_id=42) correctly uses the function name as a string and keyword argument. Passing the function name without quotes like url_for(profile, 42) fails. Passing a positional argument like url_for('profile', 42) doesn't map to the parameter. url_for('profile', id=42) uses wrong parameter name id instead of user_id.

3. Final Answer:

   url_for('profile', user_id=42) -> Option D

4. Quick Check:

   Keyword args match route params = B [OK]

Hint: Use function name string and keyword args for dynamic parts [OK]

Common Mistakes:

• Passing positional arguments instead of keyword arguments
• Using variable names instead of strings for function names
• Mismatching parameter names in url_for

3. Given this Flask route:

@app.route('/post/')
def show_post(id):
    pass

What will url_for('show_post', id=5) return?

medium

A. '/post/5'

B. '/post?id=5'

C. '/show_post/5'

D. '/post/'

Solution

1. Step 1: Understand the route pattern

   The route expects an integer id in the URL path as /post/<id>.

2. Step 2: What url_for returns

   Calling url_for('show_post', id=5) replaces <id> with 5, so the URL is /post/5.

3. Final Answer:

   '/post/5' -> Option A

4. Quick Check:

   Dynamic URL part replaced = D [OK]

Hint: Dynamic parts appear in URL path, not query string [OK]

Common Mistakes:

• Expecting query string instead of path parameter
• Using function name as part of URL
• Missing the dynamic part in the URL

4. What is wrong with this code snippet?

@app.route('/user/<username>')
def profile(username):
    pass

url = url_for('profile', name='alice')

medium

A. The parameter name 'name' does not match the route parameter 'username'

B. The function name 'profile' is incorrect

C. url_for cannot be used outside a request context

D. The route URL should not have dynamic parts

Solution

1. Step 1: Check route parameter name

   The route expects a parameter named username.

2. Step 2: Check url_for arguments

   The call uses name='alice', which does not match username. This causes a runtime error.

3. Final Answer:

   The parameter name 'name' does not match the route parameter 'username' -> Option A

4. Quick Check:

   Keyword args must match route params = A [OK]

Hint: Match keyword argument names exactly to route parameters [OK]

Common Mistakes:

• Using wrong parameter names in url_for
• Assuming function name is wrong without checking
• Thinking url_for can't be called outside requests (it can with app context)

5. You have these routes:

@app.route('/item/')
def item(id):
    pass

@app.route('/item//edit')
def edit_item(id):
    pass

How do you build the URL for editing item with ID 10 using url_for?

hard

A. url_for('item', id=10) + '/edit'

B. url_for('edit_item', id=10)

C. url_for('edit_item', item_id=10)

D. url_for('item') + '/edit/10'

Solution

1. Step 1: Identify the correct route function for editing

   The route /item/<id>/edit is handled by edit_item.

2. Step 2: Use url_for with correct function and parameter

   Call url_for('edit_item', id=10) to build the URL correctly. Other options either misuse parameter names or try to concatenate strings manually, which is error-prone.

3. Final Answer:

   url_for('edit_item', id=10) -> Option B

4. Quick Check:

   Use function name and matching params = A [OK]

Hint: Use the exact route function name with matching parameters [OK]

Common Mistakes:

• Concatenating URLs manually instead of using url_for
• Using wrong parameter names like 'item_id'
• Calling url_for with the wrong function name