|
|
#  Templates
|
|
|
|
|
|
## Overview
|
|
|
|
|
|
This lesson teaches how to use templates in Flask. It walks through what templates are, then changes the students' existing apps to pass variables into their `index.html`. It ends with a You Do, prompting students to combine variables with templates.
|
|
|
|
|
|
---
|
|
|
|
|
|
## Important Notes and Prerequisites
|
|
|
Students are expected to have Flask 0.12 or later installed.
|
|
|
|
|
|
---
|
|
|
## Learning Objectives
|
|
|
In this lesson, students will:
|
|
|
- Create a template HTML document.
|
|
|
- Pass variables to a template HTML document via a Flask app.
|
|
|
|
|
|
---
|
|
|
|
|
|
## Duration
|
|
|
30 minutes
|
|
|
|
|
|
---
|
|
|
|
|
|
## Suggested Agenda
|
|
|
<!--- Provide a breakdown of what will happen in this lesson. --->
|
|
|
|
|
|
| Time | Activity | Purpose |
|
|
|
| --- | --- | --- |
|
|
|
| 0:00 - 0:03 | [Welcome](#activity-welcome-3-min) | Introduce the lesson’s objectives and agenda. |
|
|
|
| 0:05 - 0:10 | [Jinja Templates](#activity-jinja-templates-5-min) | High-level discussion on templates. |
|
|
|
| 0:10 - 0:20 | [Implementing Templates](#activity-implementing-templates-10-min) | Extending the `my_website.py` Flask app to pass variables into the template. |
|
|
|
| 0:20 - 0:28 | [File Variables and Templates](#activity-file-variables-and-templates-8-min) | Challenge to pull variables from a file into the template. |
|
|
|
| 0:28 - 0:30 | [Summary](#activity-summary-2-min) | Wrap up the learning and share next steps. |
|
|
|
|
|
|
---
|
|
|
|
|
|
## Differentiation and Extensions
|
|
|
- For more advanced students: Try adding `for` loop logic into template brackets.
|
|
|
- For more advanced students: Ask them to stylize their `html` files.
|
|
|
- For struggling students: Review variable assignment and Flask first principles.
|
|
|
|
|
|
|
|
|
---
|
|
|
---
|
|
|
|
|
|
## Lesson Procedure
|
|
|
|
|
|
---
|
|
|
|
|
|
### Activity: Welcome (3 min)
|
|
|
> Introduce the lesson’s objectives and agenda.
|
|
|
|
|
|
#### Teaching Tips:
|
|
|
- This lesson builds on our `my_website` app from earlier.
|
|
|
- This is a great moment to answer any outstanding questions about routes/variables.
|
|
|
- Students will need to firmly understand these concepts in order to apply templates well.
|
|
|
|
|
|
---
|
|
|
|
|
|
### Activity: Jinja Templates (5 min)
|
|
|
> High-level discussion on templates.
|
|
|
|
|
|
> **Teaching Tips:**
|
|
|
> - It's not absolutely crucial that students understand how Jinja2 works.
|
|
|
> - It is necessary that they understand the "why" of templates.
|
|
|
|
|
|
---
|
|
|
|
|
|
### Activity: Implementing Templates (10 min)
|
|
|
> Extending the `my_website.py` Flask app to pass variables into the template.
|
|
|
|
|
|
> **Teaching Tip:**
|
|
|
> - There should be sufficient time in this section to answer/clear up outstanding questions regarding the `Hello World` app.
|
|
|
|
|
|
---
|
|
|
|
|
|
|
|
|
### Activity: File Variables and Templates (8 min)
|
|
|
> Challenge to pull variables from a file into the template.
|
|
|
|
|
|
> **Teaching Tip:**
|
|
|
> - After giving students some time, go over the answer with them.
|
|
|
|
|
|
---
|
|
|
|
|
|
### Activity: Summary (2 min)
|
|
|
> Wrap up the learning and share next steps.
|
