What is Flask - Visual Explanation

Concept Flow - What is Flask

Start Flask App

↓

Define Routes

↓

Receive HTTP Request

↓

Match Route

↓

Run View Function

↓

Return Response

↓

Send Response to Browser

This flow shows how Flask starts, listens for requests, matches routes, runs code, and sends back responses.

Execution Sample

Flask

from flask import Flask
app = Flask(__name__)

@app.route('/')
def home():
    return 'Hello, Flask!'

This code creates a simple Flask app that shows 'Hello, Flask!' when you visit the home page.

Execution Table

Step	Action	Details	Result
1	Create Flask app	app = Flask(__name__)	App instance ready to handle requests
2	Define route '/'	@app.route('/')	Route '/' linked to home() function
3	Receive HTTP GET request	Browser visits '/' URL	Request received by Flask
4	Match route	Request URL '/' matches route '/'	home() function selected
5	Run view function	Execute home()	Returns string 'Hello, Flask!'
6	Send response	Send 'Hello, Flask!' back to browser	Browser displays 'Hello, Flask!'
7	End	No more actions	Request cycle complete

💡 Request handled and response sent, Flask waits for next request

Variable Tracker

Variable	Start	After Step 1	After Step 2	After Step 5	Final
app	None	Flask instance	Flask instance with route '/'	Flask instance with route '/'	Flask instance with route '/'
request	None	None	None	HTTP GET '/' processed	None
response	None	None	None	'Hello, Flask!'	'Hello, Flask!' sent

Key Moments - 2 Insights

Why do we use @app.route('/') before the function?

The @app.route('/') tells Flask which URL should run the function. See execution_table step 2 where the route is linked to the function.

What happens when the browser visits the URL '/'?

Flask receives the request, matches it to the route '/', runs the linked function, and sends back the response. See steps 3 to 6 in the execution_table.

Visual Quiz - 3 Questions

Look at the execution_table, what is the result after step 4?

A Response is sent to browser

B home() function is selected to run

C Flask app is created

D Route '/' is defined

💡 Hint

Check the 'Result' column in row for step 4 in execution_table

At which step does Flask send the response back to the browser?

A Step 3

B Step 5

C Step 6

D Step 2

💡 Hint

Look for the step where 'Send response' action happens in execution_table

If we add another route, how would variable 'app' change after step 2?

A It would have multiple routes linked

B It would lose the first route

C It would become None

D It would not change

💡 Hint

See variable_tracker for 'app' after step 2 and think about adding routes

Concept Snapshot

Flask is a small web framework in Python.
You create an app with Flask(__name__).
Use @app.route('path') to link URLs to functions.
Functions return responses sent to browsers.
Flask listens for requests and runs matching functions.
Simple and flexible for web apps.

Full Transcript

Flask is a lightweight web framework for Python. You start by creating a Flask app instance. Then you define routes using the @app.route decorator to connect URLs to Python functions. When a browser sends a request to a URL, Flask matches it to a route, runs the linked function, and sends back the function's return value as the response. This process repeats for each request, allowing you to build web applications easily.

Practice

1. What is Flask primarily used for?

easy

A. Creating desktop applications

B. Building web applications with Python

C. Managing databases directly

D. Designing mobile apps

Solution

1. Step 1: Understand Flask's purpose

   Flask is a tool that helps developers create web applications using Python.

2. Step 2: Compare options with Flask's role

   Options A, C, and D describe other types of software development, not Flask's main use.

3. Final Answer:

   Building web applications with Python -> Option B

4. Quick Check:

   Flask = Web apps with Python [OK]

Hint: Flask = Python + web apps, not desktop or mobile [OK]

Common Mistakes:

• Thinking Flask is for desktop apps
• Confusing Flask with database tools
• Assuming Flask builds mobile apps

2. Which of the following is the correct way to start a basic Flask app?

easy

A. from flask import Flask
app = Flask(__name__)

@app.route('/')
def home():
return 'Hello, Flask!'

B. import flask
app = flask()

@app.route('/')
def home():
print('Hello, Flask!')

C. from flask import app
app = Flask()

@app.route('/')
def home():
return 'Hello, Flask!'

D. import Flask
app = Flask(__name__)

@app.route('/')
def home():
return 'Hello, Flask!'

Solution

1. Step 1: Check import and app creation

   from flask import Flask app = Flask(__name__) @app.route('/') def home(): return 'Hello, Flask!' correctly imports Flask and creates an app with Flask(__name__). Others have wrong imports or app creation.

2. Step 2: Verify route and return statement

   from flask import Flask app = Flask(__name__) @app.route('/') def home(): return 'Hello, Flask!' uses @app.route('/') and returns a string, which is correct Flask syntax.

3. Final Answer:

   Correct Flask app start code -> Option A

4. Quick Check:

   Correct import and route = from flask import Flask app = Flask(__name__) @app.route('/') def home(): return 'Hello, Flask!' [OK]

Hint: Import Flask and create app with Flask(__name__) [OK]

Common Mistakes:

• Using wrong import statements
• Calling flask() instead of Flask()
• Printing instead of returning response

3. What will this Flask route return when accessed?

from flask import Flask
app = Flask(__name__)

@app.route('/greet')
def greet():
    return 'Welcome to Flask!'

medium

A. Nothing, the route is not defined

B. A syntax error because of missing parentheses

C. A server error due to missing return statement

D. A web page showing 'Welcome to Flask!'

Solution

1. Step 1: Analyze the route definition

   The route '/greet' is defined with a function that returns the string 'Welcome to Flask!'.

2. Step 2: Understand Flask response behavior

   Flask sends the returned string as the response body, so visiting '/greet' shows that message.

3. Final Answer:

   A web page showing 'Welcome to Flask!' -> Option D

4. Quick Check:

   Route returns string response = A web page showing 'Welcome to Flask!' [OK]

Hint: Returned string is sent as web page content [OK]

Common Mistakes:

• Thinking return must be HTML tags
• Assuming missing parentheses cause error
• Believing route is undefined

4. Identify the error in this Flask app code:

from flask import Flask
app = Flask(__name__)

@app.route('/hello')
def hello():
    print('Hello World')

medium

A. Wrong app creation syntax

B. Incorrect import of Flask

C. Missing return statement in route function

D. Route decorator syntax error

Solution

1. Step 1: Check the route function body

   The function prints 'Hello World' but does not return anything, so Flask gets no response to send.

2. Step 2: Understand Flask route requirements

   Flask route functions must return a response string or object; printing does not send data to the client.

3. Final Answer:

   Missing return statement in route function -> Option C

4. Quick Check:

   Route must return response, not just print [OK]

Hint: Route functions must return, not print, response [OK]

Common Mistakes:

• Using print instead of return
• Assuming print sends response
• Ignoring missing return causes error

5. You want to create a Flask app that responds differently based on the URL path. Which feature helps you do this?

hard

A. Using multiple @app.route decorators with different paths

B. Using print statements inside one route

C. Creating multiple Flask app instances

D. Changing the Flask import statement

Solution

1. Step 1: Understand Flask routing

   Flask uses @app.route decorators to map different URL paths to different functions.

2. Step 2: Evaluate options for handling multiple paths

   Using multiple @app.route decorators with different paths allows different responses for each URL.

3. Final Answer:

   Using multiple @app.route decorators with different paths -> Option A

4. Quick Check:

   Multiple routes = different URL responses [OK]

Hint: Use multiple @app.route for different URLs [OK]

Common Mistakes:

• Thinking print changes URL response
• Creating multiple app instances unnecessarily
• Modifying import does not affect routing