Welcome!
Everything is fine.

Flask Part 2: Templates

Today, we'll continue to work with Flask and start to learn Templating

Goal

By the end of today, you will be able to debug Flask applications, build URLs, and use templating. You'll be ready for both the Forms assignment and even the Lookup assignment.

Plan

  1. Announcements
  2. PyMySQL:
    • Prepared Queries
    • SQL injection
  3. Breakout: Pet Lookup v2

New Material

  1. Templating
  2. Quiz Questions
  3. Breakout

Announcements

  1. Heavy reading next, but not a lot of new material
    • people_app puts all the pieces together
    • students like it
  2. Today: we'll revisit Pet Lookup

Breakout: Pet Lookup v2

To get my solution working, you'll need the owner9 and pet9 tables. Here's how to do that:

First, get the mysql5-refinteg materials, if you don't already have them. You can copy/paste each of these blocks into your terminal. There's a "copy" button in the upper right.

cd ~/cs304
cp -r ~cs304flask/pub/downloads/mysql5-refinteg .

Then, you'll need to source those two files:

cd ~/cs304/mysql5-refinteg
mysql < vet-setup.sql
mysql < vet-data.sql

Then, go back to your pymysql folder and run the example:

cd ~/cs304
source venv/bin/activate
cd pymysql
python petLookup_solution.py snow
python petLookup_solution.py crook
python petLookup_solution.py a
  1. Modify the solution to print the owner's name as well.
  2. Modify the solution to sort the results by pet's name

Code versus Data

It's reasonable to have trouble understanding prepared queries, because you've never dealt with code that runs code before. I also think there's a confusion about CODE versus DATA.

How many "if" statements in the following Python function?

def foo(x,y):
   if len(x) > 3:
      return 'if y < 2'
   else:
      return 'if y > 2'

How about the following function invocation?

foo('if',4)

Will the following function get a divide by zero error?

def bar():
    y = 4
    z = '1/0'
    return y+z

(It will get an error for concatenating a number and a string.)

In the cases above, there is Python "code" in strings, but they will never get executed. They are not treated as code.

Questions on Prepared Queries

I'll answer your questions on prepared queries

Reminder: How to Run a Flask App

  1. Activate your virtual environment: source ~/cs304/venv/bin/activate
  2. Navigate to the folder with your app (the one with app.py)
  3. Run app.py using Python: python app.py
  4. Click on the given URL to go to your browser. Something like http://149.139.15.5:wxyz/

Using URL_FOR

Go to your cs304 folder and look at the examples from last time. 

source ~/cs304/venv/bin/activate
cd ~/cs304/flask1
python example2.py

See example2

Note that example2.py does not use url_for, but it should.

Summary:

  • Use url_for anytime you need to write a URL from your app. It's cumbersome, but important.
  • in templates, in hyperlinks, in redirects (later), etc.

Static Files

We can deliver static files (CSS, JS, images) by

  • putting them in a static folder (or any other name) and
  • using url_for('static', filename = some_value)

For example, in an HTML template:

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

This example is from flask-starter.

The REQUEST Object

  • Flask creates an object storing information about the request
  • Flask puts the object in a "global" variable called request
  • we must import that variable from Flask (add it to our import statement)
  • The app.py in flask-starter does that for us.
  • The request object has a method property that has values like GET and POST
  • It also has:
    • request.form holds form data from a POST request
    • request.args holds form data from a GET request
  • We list the request methods that a given endpoint handles. Default is just GET

Quiz Questions

I'll answer your quiz questions

Today's Examples

Go to your cs304 folder and copy the examples for today:

cd ~/cs304
cp -r ~cs304flask/pub/downloads/flask2 flask2

Template Example

Here's an example of a Jinja2 template file, from the flask2/templates/things.html file:

<!doctype html>
<html>
    <head>
        <title>Things</title>
    </head>
    <body>
        <h1>Favorite Things</h1>

        <ul>
            {% for thing in things %}
            <li>{{ thing }}</li>
            {% endfor %}
        </ul>
    </body>
</html>

We'll run the example4.py file and talk through the Jinja2 templating examples.

Exercise

Practice with Flask and Jinja2 by doing the following.

Create a web app to display information about Fred Weasley.

You can find starter code in the fred_ex folder.

  • make the link work to the fred route
  • the fred page should look like this:

page about fred

To do that, you'll need to

  • modify the template file to provide places to fill in the data, and
  • modify the app.py file to fill the data in

Summary

You know about

  • url_for
  • URL patterns
  • templates
  • static files