Flask Rendering Templates

0 677

Introduction

When building web applications with Flask, serving plain text from view functions isn't enough. We need a way to render HTML pages that can also include dynamic data. Flask makes this possible using templates, powered by the Jinja2 engine. In this blog, we'll explore how template rendering works in Flask and how to pass variables to your HTML files.

What are Templates in Flask?

Templates in Flask are HTML files that can include placeholders for dynamic content. These placeholders are processed by Flask before the page is sent to the user’s browser. The Jinja2 templating engine allows you to use control structures, loops, and filters within these files to build rich and reusable front-end content.

Basic Folder Structure

To use templates in Flask, create a folder named templates in the same directory as your Python file. Flask will automatically search this folder when rendering HTML files.

project/
│
├── app.py
└── templates/
    └── home.html

Rendering a Template

Flask uses the render_template() function to render an HTML page. Here’s a simple example:

from flask import Flask, render_template

app = Flask(__name__)

@app.route('/')
def home():
    return render_template('home.html')

In this case, Flask looks for home.html inside the templates folder and renders it as the response.

Passing Data to Templates

You can also send data from your Python code to your HTML templates using keyword arguments:

@app.route('/user/<name>')
def user(name):
    return render_template('user.html', username=name)

In the user.html template, you can access this data like this:

<h1>Hello, {{ username }}!</h1>

Template Inheritance

Flask supports template inheritance, allowing you to define a base layout and extend it in other templates. This helps reduce code repetition and keeps your templates organized.

<!-- base.html -->
<html>
  <head><title>My Flask App</title></head>
  <body>
    <h2>Welcome</h2>
    {% block content %}{% endblock %}
  </body>
</html>

<!-- home.html -->
{% extends "base.html" %}
{% block content %}
  <p>This is the home page.</p>
{% endblock %}

Using Loops and Conditionals

Jinja2 allows you to use Python-like control flow inside templates. For example, you can loop through a list:

{% for item in items %}
  <li>{{ item }}</li>
{% endfor %}

You can also use conditionals:

{% if user %}
  <p>Hello, {{ user }}!</p>
{% else %}
  <p>Guest user.</p>
{% endif %}

Summary

Flask Rendering Templates allows developers to serve dynamic HTML content effortlessly using the Jinja2 engine. By using render_template() and organizing HTML files inside a templates folder, you can build responsive, reusable, and powerful front-end pages integrated directly with your Python logic.

If you’re passionate about building a successful blogging website, check out this helpful guide at Coding Tag – How to Start a Successful Blog. It offers practical steps and expert tips to kickstart your blogging journey!

For dedicated UPSC exam preparation, we highly recommend visiting www.iasmania.com. It offers well-structured resources, current affairs, and subject-wise notes tailored specifically for aspirants. Start your journey today!