Django: Getting Started Transcripts
Chapter: HTML Templates
Lecture: Your first Django template
Login or
purchase this course
to watch this video and the rest of the course contents.
0:00
Now I'm going to go create a new template inside of the templates directory. For a first stab, I'm going to keep the HTML pretty vanilla.
0:18
Opening tags and here's an H1 for a title. The double braces here, sometimes called mustache operators, are your first bit of django templating.
0:31
Double braces mark a context variable to be replaced. In this case the rendering engine expects a variable named heading,
0:39
which it will insert into this spot. If there is no heading variable, this will get rendered as an empty string. I'll add some more HTML
0:54
and since alexandria is a library, I'm going to include a list of books here. and this is your first django tag.
1:03
The brace % combination indicates a tag. The first word after that is the tag in question. In this case it's a for loop.
1:15
The structure of a tag is similar to a for loop in Python, book in books here says to loop through the contents of the books container and get
1:25
each item out one at a time. The book variable takes on the iterated item for each pass of the loop,
1:33
similar to the heading variable before the book's value is in the rendering context. If there's no such variable, this loop gets skipped.
1:43
Everything inside of the for tag gets rendered once per loop iteration, Let me add some content.
2:05
Everything inside of the for tag gets rendered once per loop iteration. In this case you'll get an li item for each book in books.
2:14
Each li will contain a title in italics because I've used the mustache operator.
2:19
Once again, this time I'm using book the value of the current iteration Like in Python you can get at attributes of a variable through the dot operator
2:29
Here, I'm accessing the title attribute of the book value. Unlike Python, the dot operator is used both for attributes and indexes.
2:39
You can use 0.3 to get at the fourth item in a container and dot name to get at a key in a dictionary.
2:47
The pipe operator inside of this same variable is a filter. This modifies the contents to the left of the pipe before they are rendered.
2:55
The upper filter is similar to Python's upper method on a string. It converts everything to uppercase.
3:04
So line 10 is the book's title in italics all upper case. After that on line 11 is the author's name.
3:15
This time without a filter, line 12 is a conditional. This is like an if statement in Python,
3:21
if the value of book.recommended evaluates to true the content inside the tag is rendered. When rendered, this page will show a header,
3:31
a welcome message, and a bullet list of books. Each bullet will have a title in uppercase italics the author
3:38
and a suffix of exclamation marks, if the book is recommended. That's your first template. Let's write a view that uses it.