Building Data-Driven Web Apps with Flask and SQLAlchemy Transcripts
Chapter: Jinja2 templates
Lecture: Concept: Jinja2 templates

Login or purchase this course to watch this video and the rest of the course contents.
0:00 Let's review this Jinja template HTML file as a concept.
0:04 Here are the basics, we've got standard HTML
0:08 and in here, we've added a couple of things.
0:10 We have the {%.
0:12 And that indicates small bits of Python sprinkled in here.
0:16 And then for each one of those we need a closing block.
0:18 So, we have a % for, and a % endfor.
0:21 And we have a % if, so we have a % endif.
0:26 The first thing that we wanted to do
0:27 was loop over all packages.
0:29 How do you do that in Python?
0:30 You say for thing in container.
0:34 So we do the same thing here
0:35 except for that we don't include the colon at the end.
0:37 The percent stuff does the block for us.
0:40 And we have the {% on both ends.
0:43 We also wanted to get some of the text out
0:45 and just drop that in the page as HTML.
0:47 This is what it looks like as static data
0:50 for the users viewing this page.
0:52 So, we want to put the project ID here.
0:55 Which is going to be the name.
0:56 We get to the database, the name is the ID.
0:59 So we don't have a separate field for that.
1:00 So we say that by {{ expression here
1:05 this can be either just a straight value
1:07 or as you saw you can even call functions here.
1:09 Also, we want to have an if statement.
1:11 So at the bottom we're going to say
1:12 only show this span with a summary
1:15 if the summary is actually set.
1:17 We didn't do this in our demo, but you get the idea right?
1:20 So, we can say we only want to show this bottom part
1:22 by doing some Python evaluation on the % if.
1:26 Pretty straight forward, right?
1:27 We run this with some set of data
1:30 it will come out looking more or less like this.
1:32 We have little hyperlinks, and then the summaries
1:34 that kind of trail off so we don't show you all the text.
1:37 All right, so, pretty straight forward.
1:39 These are the main working elements of the Jinja templates.