1. From Raw HTML Strings to Jinja2

Returning multi-line HTML from Python views becomes hard to maintain. Flask uses the Jinja2 template engine so HTML lives in separate files and Python only prepares data and calls render_template.

2. Why Jinja2 Helps

• Render external .html files instead of hardcoded strings
• Pass dynamic variables from Python into templates
• Reuse layouts with template inheritance

3. Jinja2 Syntax

• {{ variable }} — expression / placeholder for values from Python
• {% block content %} ... {% endblock %} — editable section in a layout
• {% extends "base.html" %} — inherit a parent template

4. DRY Principle

Don't Repeat Yourself: put shared structure (headers, nav) in a base template once and extend it from child pages instead of copying HTML on every view.

5. Dynamic Data with render_template

from flask import Flask, render_template

app = Flask(__name__)

@app.route("/")
def home():
    return render_template("home.html", name="Abdullah")

if __name__ == "__main__":
    app.run(debug=True)

In home.html:

Welcome, {{ name }}

Browser shows: Welcome, Abdullah.

6. Template Inheritance

base.html (parent):

My Flask App
{% block content %}
{% endblock %}

about.html (child):

{% extends "base.html" %}
{% block content %}
This is the about page
{% endblock %}

@app.route("/about")
def about():
    return render_template("about.html")

Visiting /about shows the base heading plus the about paragraph.

7. Stopping the Server

Press Ctrl + C in the terminal to stop the development server before restarting with new routes or templates.