Work Session - v0.2.0

Read the directions for the Project

  • View the assignment in Canvas
  • Canvas > Modules > Week 3 > What to Do in Week 3

Sketch the interactions

The goal is to sketch each user interaction, indicating pseudo code and access to data along the way.

Let’s try this once together, then you can try the rest of the interactions on your own:

Using pen and a piece of paper, with the paper in landscape, divide the paper into three sections.

  • Label the first section index.html
  • Label the second section app.py
  • Label the third section flowers.html

sketch of an interaction from project v0.2.0

index.html

In the first section, representing index.html, the user clicks on a link in the navigation. Add the link “Flowers” to this column on your page, and add how you would write this link using HTML and Jinja in the template. Do we need to send any data through to the app? If so, indicate that too. (This time, for “Flowers”, we do not.)

Draw an arrow from the link to the middle section representing app.py.

app.py

In the second section app.py indicate:

  • Route: /flowers/
  • Function definition: flowers()
  • Template to render: flowers.html
  • Is there any data coming in? no
  • Is there any that needs to be processed or gathered? flowers.csv
  • Is there any data to send on to the HTML template? yes, “all_flowers”

Don’t worry about writing the full route code here. We just want to write down the important bits.

Draw an arrow to the final section.

flowers.html

In the third section, representing flowers.html, indicate the variables name(s) for any data passed to the template (all_flowers), and note what the resulting page is for (e.g. it’s the Flowers page)

Repeat this process for each route we have asked you to create. Reference your interaction sketches as you code.

Begin coding

Begin coding for Project v0.2.0, keeping in mind the entire user interaction: from (1) a click on a link, to (2) the route in app.py, to (3) the resulting rendered HTML template.