Activity 3.19

app.py

from flask import Flask

# Create a Flask application
app = Flask(__name__)

# Define a route (URL endpoint)
@app.route('/')
def home():
    return "Hello, World! This is my first Flask app!"

# Run the application
if __name__ == '__main__':
    app.run(debug=True)

app.py (version 2)

from flask import Flask

app = Flask(__name__)

@app.route('/')
def home():
    return "<h1>Welcome to My Website!</h1><p>This is the home page.</p>"

@app.route('/about')
def about():
    return "<h1>About Me</h1><p>I'm a PCTI student learning Flask!</p>"

@app.route('/contact')
def contact():
    return "<h1>Contact</h1><p>Email me at: [e-mail]</p>"

@app.route('/hobbies')
def hobbies():
    return """
    <h1>My Hobbies</h1>
    <ul>
        <li>Programming</li>
        <li>Reading</li>
        <li>Gaming</li>
        <li>Music</li>
    </ul>
    """

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

What is Flask?

Flask is a web framework - think of it as a translator between your Python code and web browsers. When someone types a URL into their browser, Flask figures out which Python function should respond and what content to send back.

The Magic Formula:

URL + Route + Function = Web Page

Understanding the Web Request Cycle

Before we dive into code, let's understand what happens when you visit a website:

1. User types URL → http://mysite.com/about

2. Browser sends request → "Hey server, I want the /about page"

3. Flask receives request → "I need to find which function handles /about"

4. Flask finds matching route → "Found it! The about() function handles this"

5. Function runs → Returns HTML content

6. Flask sends response → Browser displays the page

The Homepage: Your Website's Front Door

The homepage is the first page visitors see. In Flask, it's typically the route that responds to / (the root URL).

Basic Homepage Structure

from flask import Flask

app = Flask(__name__)

@app.route('/')          # This is the ROUTE DECORATOR
def homepage():          # This is the FUNCTION NAME
    return "Welcome!"    # This is what the USER SEES

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

Breaking it down:

• @app.route('/') - The decorator that tells Flask "when someone visits the root URL, run the function below"

• def homepage(): - The function that gets executed (you can name this anything you want)

• return "Welcome!" - The content that gets sent to the user's browser

Deep Dive: Route Decorators

Routes are like address labels for your functions. Let's explore different types:

1. Basic Routes

from flask import Flask

app = Flask(__name__)

# Homepage - responds to yoursite.com/
@app.route('/')
def home():
    return "<h1>This is the Homepage!</h1>"

# About page - responds to yoursite.com/about
@app.route('/about')
def about_page():
    return "<h1>About Us</h1><p>We are awesome!</p>"

# Contact page - responds to yoursite.com/contact
@app.route('/contact')
def contact_info():
    return "<h1>Contact</h1><p>Email: [e-mail]</p>"

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

Important Notes:

• Route paths are case-sensitive: /About is different from /about

• Function names can be anything, but make them descriptive

• Routes must start with /

2. Multiple Routes to Same Function

Sometimes you want multiple URLs to show the same content:

@app.route('/')
@app.route('/home')
@app.route('/index')
def homepage():
    return "<h1>Welcome to our site!</h1><p>You can reach this page multiple ways!</p>"

Now all these URLs show the same page:

• yoursite.com/

• yoursite.com/home

• yoursite.com/index

3. Routes with Trailing Slashes

Flask handles trailing slashes intelligently:

# This route accepts both /about and /about/
@app.route('/about/')
def about():
    return "About page"

# This route only accepts /contact (no trailing slash)
@app.route('/contact')
def contact():
    return "Contact page"