URL parameters with angle brackets in Django - Mini Project: Build & Apply

URL Parameters with Angle Brackets in Django

📖 Scenario: You are building a simple Django web app that shows details for different products. Each product has a unique ID number. You want to create a URL pattern that captures this product ID from the URL using angle brackets.

🎯 Goal: Build a Django URL pattern that uses angle brackets to capture a product ID as a URL parameter, and create a simple view function that receives this parameter and returns a response showing the product ID.

📋 What You'll Learn

Create a URL pattern in urls.py using angle brackets to capture an integer parameter called product_id

Create a view function called product_detail in views.py that accepts product_id as an argument

Return an HTTP response from the view that includes the product_id in the text

Connect the URL pattern to the product_detail view

💡 Why This Matters

🌍 Real World

Capturing URL parameters is essential for building dynamic web pages that show different content based on user input or links.

💼 Career

Understanding Django URL routing and parameter capturing is a key skill for backend web developers working with Django.

1

Create the URL pattern dictionary

In urls.py, create a list called urlpatterns with one entry: a call to path with the route '' (empty string), the view product_detail, and the name 'product_detail'. Import path from django.urls and product_detail from views.

Django

from django.urls import path
from views import product_detail

urlpatterns = [
    # Your code here
]

Hint

Remember to import path and your view function before creating urlpatterns.

2

Add the URL parameter with angle brackets

Modify the path in urlpatterns to capture an integer parameter called product_id using angle brackets. Change the route from '' to 'product//'.

Django

from django.urls import path
from views import product_detail

urlpatterns = [
    # Change the route to capture  as an int
    # Your code here
]

Hint

Use <int:product_id> inside the route string to capture the integer parameter.

3

Create the view function to accept the parameter

In views.py, define a function called product_detail that takes request and product_id as parameters. Return an HttpResponse with the text "Product ID: {product_id}" using an f-string. Import HttpResponse from django.http.

Django

from django.http import HttpResponse

# Define product_detail view here
# Your code here

Hint

Make sure your function accepts product_id and uses it inside the response text.

4

Connect the URL pattern and view

Ensure that urls.py imports product_detail from views and that the urlpatterns list includes the path 'product//' connected to product_detail. This completes the URL parameter setup.

Django

from django.urls import path
from views import product_detail

urlpatterns = [
    # Add the URL pattern with parameter here
    # Your code here
]

Hint

Double-check your imports and that the URL pattern matches the view function.

Practice

1. What does the angle bracket syntax <int:id> in a Django URL pattern do?

easy

A. Creates a static URL segment named 'int:id'.

B. Specifies a query parameter instead of a URL segment.

C. Defines a string variable named 'id' without type conversion.

D. Captures a part of the URL as an integer variable named 'id'.

Solution

1. Step 1: Understand angle brackets in Django URLs

   Angle brackets capture parts of the URL as variables to pass to views.

2. Step 2: Recognize the converter and variable name

   The syntax <int:id> captures an integer named 'id'.

3. Final Answer:

   Captures a part of the URL as an integer variable named 'id'. -> Option D

4. Quick Check:

   URL parameter with <int:id> = integer variable capture [OK]

Hint: Angle brackets capture URL parts as typed variables [OK]

Common Mistakes:

• Thinking it creates a static URL segment
• Confusing query parameters with URL parameters
• Ignoring the type converter like int or str

2. Which of the following is the correct syntax to capture a slug parameter named 'post_slug' in a Django URL pattern?

easy

A. path('post/<str:post_slug>/', views.post_detail)

B. path('post/<slug:post_slug>/', views.post_detail)

C. path('post/<post_slug:slug>/', views.post_detail)

D. path('post/<slug>post_slug/', views.post_detail)

Solution

1. Step 1: Identify correct converter and variable order

   The correct syntax is <converter:variable_name>, so <slug:post_slug> is correct.

2. Step 2: Check the full path syntax

   path('post/<slug:post_slug>/', views.post_detail) uses path('post/<slug:post_slug>/', views.post_detail), which is valid Django syntax.

3. Final Answer:

   path('post/<slug:post_slug>/', views.post_detail) -> Option B

4. Quick Check:

   Converter before variable name = path('post/<slug:post_slug>/', views.post_detail) [OK]

Hint: Use <converter:variable> format for URL parameters [OK]

Common Mistakes:

• Swapping converter and variable name
• Missing colon between converter and variable
• Using invalid syntax like <slug>post_slug

3. Given this URL pattern: path('user/<int:user_id>/', views.profile), what will user_id be if the URL is /user/42/?

medium

A. A slug '42'

B. The string '42'

C. The integer 42

D. A syntax error occurs

Solution

1. Step 1: Understand the int converter effect

   The <int:user_id> converter converts the URL segment to an integer.

2. Step 2: Apply to the URL segment '42'

   The string '42' from the URL is converted to the integer 42 before passing to the view.

3. Final Answer:

   The integer 42 -> Option C

4. Quick Check:

   int converter converts URL part to integer [OK]

Hint: int converter makes URL part an integer, not string [OK]

Common Mistakes:

• Assuming the parameter is a string
• Confusing slug with int converter
• Expecting a syntax error for valid syntax

4. Identify the error in this Django URL pattern: path('article/<int:id>', views.detail)

medium

A. Missing closing angle bracket '>' after 'id'.

B. Using 'int' converter instead of 'str'.

C. View function 'detail' is not imported.

D. URL pattern should not use angle brackets.

Solution

1. Step 1: Check angle bracket syntax

   The pattern uses <int:id> without the closing '>' character, which is invalid syntax.

2. Step 2: Confirm correct syntax

   The correct syntax requires both opening and closing angle brackets: <int:id>.

3. Final Answer:

   Missing closing angle bracket '>' after 'id'. -> Option A

4. Quick Check:

   Angle brackets must be complete <int:id> [OK]

Hint: Always close angle brackets in URL parameters [OK]

Common Mistakes:

• Forgetting the closing '>'
• Confusing converter types
• Assuming view import errors cause syntax issues

5. You want to create a URL pattern that captures a username (letters, numbers, underscores) and a post ID (integer). Which of these is the best Django URL pattern?

hard

A. path('profile/<slug:username>/post/<int:post_id>/', views.post_view)

B. path('profile/<str:username>/post/<int:post_id>/', views.post_view)

C. path('profile/<int:username>/post/<int:post_id>/', views.post_view)

D. path('profile/<username>/post/<post_id>/', views.post_view)

Solution

1. Step 1: Choose correct converter for username

   Usernames usually contain letters, numbers, underscores, so 'slug' converter fits best.

2. Step 2: Confirm integer converter for post ID

   Post ID should be an integer, so <int:post_id> is correct.

3. Step 3: Evaluate options

   path('profile/<slug:username>/post/<int:post_id>/', views.post_view) uses <slug:username> and <int:post_id>, matching requirements perfectly.

4. Final Answer:

   path('profile/<slug:username>/post/<int:post_id>/', views.post_view) -> Option A

5. Quick Check:

   Slug for username + int for post ID = path('profile/<slug:username>/post/<int:post_id>/', views.post_view) [OK]

Hint: Use slug for usernames, int for numeric IDs in URLs [OK]

Common Mistakes:

• Using str converter which allows spaces
• Using int converter for username
• Omitting converters causing string default