Why real-time matters in Flask - See It in Action

Why Real-Time Matters with Flask

📖 Scenario: You are building a simple Flask web app that shows live updates of a counter. This simulates how real-time data can keep users informed instantly, like live scores or chat messages.

🎯 Goal: Create a Flask app that holds a counter, updates it, and shows the current value on a web page. This will demonstrate why real-time updates matter in web apps.

📋 What You'll Learn

Create a Flask app with a counter variable

Add a configuration variable for the update interval

Write a route that updates the counter

Add a route to display the current counter value

💡 Why This Matters

🌍 Real World

Real-time updates are important in apps like live sports scores, chat apps, and stock tickers where users want instant information.

💼 Career

Understanding how to build real-time features with Flask is useful for backend web developers working on interactive web applications.

1

Set up the Flask app and counter

Create a Flask app called app and a global variable counter set to 0.

Flask

# Your code here

Need a hint?

Use Flask(__name__) to create the app and set counter = 0.

2

Add update interval configuration

Add a configuration variable UPDATE_INTERVAL to app.config and set it to 5 (seconds).

Flask

from flask import Flask

app = Flask(__name__)
counter = 0
# Your code here

Need a hint?

Use app.config['UPDATE_INTERVAL'] = 5 to set the update interval.

3

Create route to update counter

Write a route /update with a function update_counter that increases counter by 1 each time it is called.

Flask

from flask import Flask

app = Flask(__name__)
counter = 0
app.config['UPDATE_INTERVAL'] = 5

# Your code here

Need a hint?

Use @app.route('/update') and inside the function use global counter to modify it.

4

Create route to display counter

Add a route / with a function show_counter that returns the current counter value as a string.

Flask

from flask import Flask

app = Flask(__name__)
counter = 0
app.config['UPDATE_INTERVAL'] = 5

@app.route('/update')
def update_counter():
    global counter
    counter += 1
    return str(counter)

# Your code here

Need a hint?

Use @app.route('/') and return the counter as a string.