Python Flask

Learning Objectives

Flask introduces an important new stage in your Python journey: building applications that communicate through the web.

What Is Flask?

Flask is a lightweight web framework written in Python.

It provides the fundamental tools required to receive HTTP requests, execute Python code, and return responses to users.

Flask is often described as a microframework because its core is intentionally small and flexible.

You can add additional libraries and components depending on what your application needs.

What Is a Web Framework?

A web framework provides tools and conventions that make building web applications easier.

Without a framework, you would need to handle many low-level web details yourself.

Flask does not force you into one large application architecture. This flexibility makes it useful for learning as well as building many types of web applications.

Installing Flask

Flask should normally be installed inside a virtual environment for your project.

python -m pip install flask

Verify that Flask is available:

python -m pip show flask

Your First Flask Application

Create a file named app.py.

from flask import Flask

app = Flask(__name__)

@app.route("/")
def home():
    return "Hello, PyLearn!"

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

Understanding the Code

• Flask is imported from the Flask package.
• Flask(__name__) creates the application.
• @app.route("/") connects the root URL to the home() function.
• The function returns the response.
• app.run() starts the development server.

Running the Development Server

From the project directory, run:

python app.py

Flask will start a local development server.

You will normally see an address similar to:

http://127.0.0.1:5000

The debug=True option enables useful development features such as automatic reloading and detailed error information.

Routes

A route maps a URL to a Python function.

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


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


@app.route("/contact")
def contact():
    return "Contact Page"

Now the application has three different URLs.

Routes are one of the central concepts of Flask.

HTTP Methods

HTTP defines several methods that describe what the client wants to do.

GET Route

@app.route("/products", methods=["GET"])
def products():
    return "Product List"

POST Route

@app.route("/products", methods=["POST"])
def create_product():
    return "Product Created"

A single route can also support multiple methods.

@app.route(
    "/products",
    methods=["GET", "POST"]
)
def product_handler():

    if request.method == "GET":
        return "Get Products"

    return "Create Product"

When using request, remember to import it:

from flask import Flask, request

Route Parameters

Dynamic route parameters allow part of the URL to become input for your Python function.

@app.route("/user/<username>")
def user_profile(username):
    return f"Welcome, {username}!"

Visiting a URL such as:

/user/Ali

passes "Ali" into the function.

Integer Parameters

@app.route("/product/<int:product_id>")
def product(product_id):
    return f"Product ID: {product_id}"

Query Parameters

Query parameters appear after a question mark in a URL.

/products?category=phones&page=2

Flask provides the request object for reading them.

from flask import Flask, request

@app.route("/products")
def products():

    category = request.args.get("category")
    page = request.args.get("page", default=1, type=int)

    return f"Category: {category}, Page: {page}"

request.args.get() is useful because you can provide a default value when a parameter is missing.

Returning Responses

Flask routes can return different kinds of responses.

Text

@app.route("/hello")
def hello():
    return "Hello World!"

HTML

@app.route("/welcome")
def welcome():
    return "<h1>Welcome to PyLearn</h1>"

For real applications, HTML should normally be placed in templates rather than embedded directly in Python strings.

HTML Templates

Flask uses a templates directory for HTML templates.

A simple project may look like:

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

Create index.html:

<!DOCTYPE html>
<html>
<head>
    <title>PyLearn Flask App</title>
</head>
<body>

    <h1>Welcome to PyLearn</h1>

</body>
</html>

Render it from Flask:

from flask import Flask, render_template

app = Flask(__name__)

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

Jinja Templates

Flask uses the Jinja template engine to generate dynamic HTML.

Jinja allows Python-generated values to be inserted into HTML templates.

Variable Example

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

Flask:

@app.route("/<name>")
def hello(name):
    return render_template(
        "hello.html",
        name=name
    )

Conditional Template Logic

{% if logged_in %}
    <p>Welcome back!</p>
{% else %}
    <p>Please log in.</p>
{% endif %}

Loops

<ul>

{% for product in products %}

    <li>
        {{ product }}
    </li>

{% endfor %}

</ul>

Passing Data to Templates

Flask can pass Python variables into an HTML template.

@app.route("/products")
def products():

    products = [
        "Laptop",
        "Phone",
        "Tablet"
    ]

    return render_template(
        "products.html",
        products=products
    )

The template can then loop through the data.

<h1>Products</h1>

<ul>

{% for product in products %}

    <li>{{ product }}</li>

{% endfor %}

</ul>

Static Files

Web applications commonly contain CSS, JavaScript, images, and other files that do not need to be generated dynamically.

Flask conventionally stores these in a static directory.

project/
│
├── app.py
│
├── templates/
│   └── index.html
│
└── static/
    ├── css/
    │   └── style.css
    │
    └── js/
        └── script.js

In the template:

<link
    rel="stylesheet"
    href="{{ url_for('static', filename='css/style.css') }}"
>

Flask's url_for() function generates the appropriate URL for the static file.

HTML Forms

Forms allow users to send information to a web application.

<form method="POST">

    <input
        type="text"
        name="username"
        placeholder="Enter your name"
    >

    <button type="submit">
        Submit
    </button>

</form>

Flask can receive the submitted form data.

from flask import Flask, request

@app.route("/login", methods=["GET", "POST"])
def login():

    if request.method == "POST":

        username = request.form.get("username")

        return f"Hello, {username}"

    return render_template("login.html")

The request Object

Flask's request object contains information about the incoming HTTP request.

from flask import request

Understanding the request object becomes particularly important when building APIs.

Redirects & URLs

A redirect tells the browser to visit another URL.

from flask import redirect, url_for

@app.route("/old")
def old_page():
    return redirect(url_for("home"))

url_for() is useful because it generates URLs from endpoint names instead of manually constructing paths.

Returning JSON

Flask can return JSON data, which is essential when building APIs.

from flask import jsonify

@app.route("/api/products")
def api_products():

    products = [
        {
            "id": 1,
            "name": "Laptop",
            "price": 1200
        },
        {
            "id": 2,
            "name": "Phone",
            "price": 800
        }
    ]

    return jsonify(products)

A client such as JavaScript, a mobile application, or another Python program can consume this JSON.

Error Handling

Web applications should handle common HTTP errors gracefully.

from flask import Flask

@app.errorhandler(404)
def page_not_found(error):
    return "Page not found", 404

The second value in the returned tuple is the HTTP status code.

Example

return {
    "error": "Product not found"
}, 404

Returning the correct status code allows clients to understand what happened.

Sessions

Sessions allow an application to remember information between requests for a user.

from flask import Flask, session

app = Flask(__name__)

app.secret_key = "change-this-in-a-real-project"

@app.route("/login")
def login():

    session["username"] = "Ali"

    return "Logged in"

The stored value can later be retrieved:

@app.route("/profile")
def profile():

    username = session.get("username")

    return f"User: {username}"

Professional Flask Project Structure

As applications grow, keeping everything in one Python file becomes difficult.

A small Flask application may start like this:

my_flask_app/
│
├── app.py
│
├── templates/
│   ├── index.html
│   ├── products.html
│   └── login.html
│
└── static/
    ├── css/
    │   └── style.css
    │
    ├── js/
    │   └── script.js
    │
    └── images/

Larger Flask applications can later use application factories, blueprints, configuration modules, services, database layers, and separate packages.

Flask & Databases

Real web applications frequently need persistent data such as users, products, orders, payments, and inventory.

Flask itself does not force you to use one particular database.

You have already learned SQLite earlier in this course. That knowledge can now be connected with Flask to create database-driven web applications.

Conceptual Flow

Browser
   ↓
Flask Route
   ↓
Python Logic
   ↓
Database
   ↓
Python Result
   ↓
HTML / JSON Response
   ↓
Browser

Practical Example — Product Catalog

Let's create a small Flask application that displays an ecommerce product catalog.

app.py

from flask import Flask, render_template

app = Flask(__name__)

products = [
    {
        "name": "Laptop",
        "price": 1200
    },
    {
        "name": "Phone",
        "price": 800
    },
    {
        "name": "Tablet",
        "price": 500
    }
]


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


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

templates/products.html

<!DOCTYPE html>
<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Product Catalog</title>

</head>

<body>

    <h1>Product Catalog</h1>

    <ul>

        {% for product in products %}

            <li>

                <strong>
                    {{ product.name }}
                </strong>

                - ${{ product.price }}

            </li>

        {% endfor %}

    </ul>

</body>

</html>

Flask sends the Python list to Jinja, and Jinja generates the HTML for each product.

Common Flask Mistakes

Practice Exercises

Mini Challenge — Flask Ecommerce Catalog

Build a small Flask ecommerce catalog that demonstrates the concepts from this lesson.

Suggested Starting Point

from flask import (
    Flask,
    render_template,
    request,
    jsonify
)

app = Flask(__name__)

products = [
    {
        "id": 1,
        "name": "Laptop",
        "price": 1200,
        "category": "Electronics"
    },
    {
        "id": 2,
        "name": "Phone",
        "price": 800,
        "category": "Electronics"
    },
    {
        "id": 3,
        "name": "Tablet",
        "price": 500,
        "category": "Electronics"
    },
    {
        "id": 4,
        "name": "Backpack",
        "price": 80,
        "category": "Accessories"
    },
    {
        "id": 5,
        "name": "Headphones",
        "price": 120,
        "category": "Accessories"
    }
]


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


@app.route("/products")
def product_list():

    keyword = request.args.get(
        "keyword"
    )

    filtered = products

    if keyword:
        filtered = [
            product
            for product in products
            if keyword.lower()
            in product["name"].lower()
        ]

    return render_template(
        "products.html",
        products=filtered
    )


@app.route("/api/products")
def api_products():

    return jsonify(products)


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

Knowledge Check

Test your understanding of Flask before moving forward.

Lesson Summary

Flask brings Python into web development. You can now connect Python functions to URLs, receive user requests, generate HTML, and return JSON.