Returning HTML templates in Django

Introduction

Returning HTML templates lets your web app show nice pages to users. It connects your data with a design to make web pages.

When you want to show a homepage with text and images.

When you need to display a list of items from a database.

When you want to show a form for users to fill out.

When you want to create a user profile page with dynamic info.

When you want to build a blog post page with content from your app.

Syntax

Django

from django.shortcuts import render

def view_name(request):
    context = {'key': 'value'}  # data to send to template
    return render(request, 'template_name.html', context)

render is a Django shortcut that combines loading a template and returning an HTTP response.

The context is a dictionary with data you want to show in the template.

Examples

Returns a simple template without extra data.

Django

from django.shortcuts import render

def home(request):
    return render(request, 'home.html')

Sends user info to the template to show dynamic content.

Django

from django.shortcuts import render

def profile(request):
    user_info = {'name': 'Alice', 'age': 30}
    return render(request, 'profile.html', user_info)

Passes a list to the template to display multiple items.

Django

from django.shortcuts import render

def items_list(request):
    items = ['apple', 'banana', 'cherry']
    return render(request, 'items.html', {'items': items})

Sample Program

This view sends a name to the greeting.html template to show a personalized message.

Django

from django.shortcuts import render

def greeting(request):
    context = {'name': 'Friend'}
    return render(request, 'greeting.html', context)

Important Notes

Make sure your template files are in the correct folder (usually templates/ inside your app).

Context keys become variables you can use inside the HTML template with {{ key }} syntax.

Use Django's template language to add logic like loops and conditions inside your HTML.

Summary

Use render() to return HTML pages from views.

Pass data as a dictionary to show dynamic content in templates.

Templates and views work together to create user-friendly web pages.

Practice

1. What is the primary function used in Django views to return an HTML template to the user?

easy

A. render()

B. redirect()

C. HttpResponse()

D. get_template()

Solution

1. Step 1: Understand Django view response methods

   Django views can return HTML using several methods, but the most common and convenient is render().

2. Step 2: Identify the method that combines template rendering and response

   render() takes the request, template name, and context data, then returns an HttpResponse with the rendered HTML.

3. Final Answer:

   render() -> Option A

4. Quick Check:

   Use render() to return HTML templates [OK]

Hint: Remember: render() combines template and response [OK]

Common Mistakes:

• Confusing render() with redirect()
• Using HttpResponse() without rendering template
• Trying to use get_template() directly in views

2. Which of the following is the correct syntax to return a template named home.html with an empty context in a Django view?

easy

A. return render(request, 'home.html', {})

B. return render('home.html', request, {})

C. return render(request, 'home.html')

D. return render({}, request, 'home.html')

Solution

1. Step 1: Recall the render() function signature

   The correct order is render(request, template_name, context).

2. Step 2: Match the syntax with the correct order and parameters

   return render(request, 'home.html', {}) matches the correct order and includes an empty dictionary for context.

3. Final Answer:

   return render(request, 'home.html', {}) -> Option A

4. Quick Check:

   render(request, template, context) syntax [OK]

Hint: render() needs request, template, then context [OK]

Common Mistakes:

• Swapping the order of arguments
• Omitting the context dictionary
• Passing context before request

3. Given the following Django view code, what will be displayed in the rendered template if the template uses {{ greeting }}?

def hello_view(request):
    context = {'greeting': 'Hello, Django!'}
    return render(request, 'hello.html', context)

medium

A. {{ greeting }}

B. Hello, Django!

C. greeting

D. Error: greeting not defined

Solution

1. Step 1: Understand context dictionary usage

   The context dictionary passes variables to the template. Here, 'greeting' is set to 'Hello, Django!'.

2. Step 2: Template variable rendering

   The template uses {{ greeting }}, which will be replaced by the value from context, 'Hello, Django!'.

3. Final Answer:

   Hello, Django! -> Option B

4. Quick Check:

   Context variables render their values in templates [OK]

Hint: Context keys become template variables [OK]

Common Mistakes:

• Expecting template to show variable name literally
• Forgetting to pass context dictionary
• Using wrong variable names in template

4. Identify the error in this Django view code snippet:

def index(request):
    return render('index.html', request, {'title': 'Home'})

medium

A. Template name should be a variable, not string

B. Missing import for render()

C. Context dictionary is not allowed

D. Arguments to render() are in wrong order

Solution

1. Step 1: Check render() argument order

   The correct order is render(request, template_name, context). Here, the template name and request are swapped.

2. Step 2: Identify the impact of wrong argument order

   Swapping arguments causes a TypeError or unexpected behavior because render expects request first.

3. Final Answer:

   Arguments to render() are in wrong order -> Option D

4. Quick Check:

   render() needs request first, then template [OK]

Hint: render() always starts with request argument [OK]

Common Mistakes:

• Swapping request and template arguments
• Forgetting to import render
• Passing context as a list instead of dict

5. You want to display a list of products dynamically in your Django template. Which is the best way to pass this list from your view to the template?

hard

A. Use redirect('products.html') with products_list as argument

B. Return HttpResponse(products_list) directly without template

C. Use render(request, 'products.html', {'products': products_list}) and loop in template

D. Embed the list in the URL and parse it in the template

Solution

1. Step 1: Understand passing data to templates

   To show dynamic data like a list, pass it in the context dictionary to the template using render().

2. Step 2: Use template loops to display list items

   The template can loop over products to display each product. Other options do not properly render HTML with data.

3. Final Answer:

   Use render(request, 'products.html', {'products': products_list}) and loop in template -> Option C

4. Quick Check:

   Pass data in context dict for dynamic templates [OK]

Hint: Pass data via context dict and loop in template [OK]

Common Mistakes:

• Trying to send data via redirect
• Returning raw data without template
• Embedding data in URL instead of context