Building Data-Driven Web Apps with Flask and SQLAlchemy Transcripts
Chapter: Jinja2 templates
Lecture: Template chapter introduction
Login or
purchase this course
to watch this video and the rest of the course contents.
0:00
It's time to dig in
0:01
to the HTML side of this whole web course.
0:04
We're going to focus on templates and HTML
0:06
and taking data and turning that into HTML.
0:10
As well as some patterns that make that
0:12
very much nicer than maybe the most straightforward way.
0:16
So, we're going to focus on templates
0:17
and these common views that share the layout
0:20
and the overall look and feel across our site.
0:22
Let's start with templates.
0:25
So, this is just a standalone example
0:28
it's not from our PyPI project that we're working on.
0:30
So, just to keep everything isolated.
0:32
And the goal is, if we're given a dictionary
0:35
a list of dictionaries like this.
0:36
So this is some form of data
0:38
could have got it from the database
0:39
we could've gotten it from the web service
0:41
hey, it can even come from a JSON file, who knows.
0:43
But we have this data
0:45
we want to loop over those three items
0:48
and we want to show a picture
0:50
and we want to show the category.
0:52
This is from like a bike example, like a bike store
0:55
and we have different categories of bikes
0:56
each category has a picture of it
0:58
encourages people to click on it.
1:00
And we're going to render this into some kind
1:02
of responsive grid or set of divs
1:04
or something to that effect.
1:06
It's going to look like this
1:07
and have little picture and the title.
1:10
Picture and the title, presumably they're going to be hyperlinks
1:12
something to that effect.
1:14
We might not replicate this exactly
1:15
'cause we don't want to go too much into the design
1:18
but this is kind of what we're aiming for, okay?
1:21
So we're going to see how we do that in Jinja