Building Data-Driven Web Apps with Pyramid and SQLAlchemy Transcripts
Chapter: Chameleon templates
Lecture: Template demo
Login or
purchase this course
to watch this video and the rest of the course contents.
0:00
Now that we've opened this project it's right here in our recent projects so we'll come back to it. Notice also PyCharm says here's an unregistered
0:10
vcs or git root, so we can just add that and it'll turn on git integration. Notice here we've got our branching and stuff is now detected.
0:18
We won't do anything with that really but just typically a good thing to say yes add this GitHub root, or this git root, okay.
0:27
So we are ready to do some work here because when we created this project with Cookiecutter and it asked the question
0:34
what template language do you want to use and we said I want to use Chameleon we have these pt or page templates here. If we had chosen Jinja2
0:42
we would have I think it's just .html files but inside it's Jinja2. And Mako, I think there is mk or mak Anyway you'll see different extensions here.
0:54
So first of all, there are actually two layouts here but in the views, there is only one view what's the deal?
1:02
You notice we are actually pointing at this view. And the layout, this is not full HTML, but it's seeing there is a wrapper, standardized HTML
1:13
that is used for the whole site called layout which has all of our doctype, HTML, etc. on there, so we will come back to that later
1:22
but here's the contents of the page that we want to work with, there's Pyramid our application that was generated by Cookiecutter.
1:29
So what I want to do, I want to take data passed in here and render it. So let's just go and we'll
1:36
place this little h1 part, we'll just say this will be some packages and we are going to pass in some fake package data.
1:46
And I just put a div, and I'll say todo put packages here. Okay, great, so let's start by looking at the view I want to pass little data here
1:57
I mean this is mostly about the templates but the templates are not interesting without data.
2:02
So let's go over to our view, and instead of calling it this which drives me crazy, let's call it maybe home_index
2:08
or just index or something like this. I'll give you the same thing here this could just be home_index.
2:18
We can rename that here, but rename is under refactor so we'll just call it home_index. There we go, okay so you can sort
2:28
of see the tying together of all these here. So right now we are passing projects which wasn't actually used in the template
2:35
and we are going to pass something more aggressive. Let's call this packages and let's put some data here.
2:43
And I could just type it in, right, I can just put in package 1 package 2 and so on but let's give this a little sense
2:52
of some kind of data driven access here cuz that's where we are going and we are going to do this out of the database, right, this data would not
2:59
come from being hardcoded, that would be silly. So maybe just for now, I'll write a function up here that says get_test_packages.
3:07
It can return out list. Within this list we are going to have some dictionaries. And each dictionary represents the data of a package
3:15
that will have a name and a version. Okay, so we will come down here and we will say name: something and version: something else
3:26
and we want to have let's say 3 of those. So to have requests, I common I'll say 1.2.3 SQLAlchemy 2.0.0 and Pyramid
3:41
I think that's 1.9.1 or something like that. So down here we can just say this going to be just get test packages for our data.
3:49
So this thing we are going to be able to refer to remember stuff within the { } is going back to the template, that right there is our model
3:55
we can access its keys just by saying the name inside the template. So let's go down here, and I'll just say for now
4:05
the packages are, and I want to print them out so I can just say $packages like that and it will pull that array, and print it
4:14
it's not going to look like what we want but it will do it. So let's see what we get when we run that. So there we go, todo put some packages
4:26
whoa, there is a big fat list right there but it's working right, pretty cool. So what we want to do, not, let's not do this
4:34
we actually want to loop over those and print out requests is this version SQLAlchemy is that version and so on.
4:42
So let's go change this, so we will replicate this div. We'll give it a class package, something like that.
4:49
We want to replicate that for each one of the packages so we are going to say tal and then Chamelon tal is Template Attribute Language
4:57
so tal: I noticed the sweet, sweet integration of PyCharm here. I type tal and it tells me all the things I can do.
5:05
I can repeat, so I want to say p packages. This is like for p in packages. You drop the for, you drop the in
5:14
I kind of wish they kept it for historical reasons it didn't originate with Python, I don't think so that is why it is like this.
5:21
So anyway what I want to do, I want put a little span and maybe as a class title and then here I want to print out just
5:30
p.name if we look over here name and then let's do one that will be version and this will be p.version. So notice, we are defining a local variable
5:44
within this block by looping over it and then referring to it here. And now I can save, I don't have to rerun this code
5:51
just save it and the templates will automatically be reloaded. So now, look at that, boom, requests SQLAlchemy, Pyramid, we can even do a little test
6:02
we can say tal:condition p.version and only show the version section if it is like that. I can do like a say not let's just say
6:17
3 zeros if it's not there. So let's remove this version from one of them. Yeah, okay, so notice it shows the versions
6:25
when it's there, but Pyramid had none so we determined that, so we just said 0.0.0 as our default. You may have noticed one thing that I was rerunning
6:34
I was rerunning our app here I said you didn't have to do that before. When you change the templates, there's no need to rerun it.
6:41
But the Python code, however if I change this to 1.7.7 and I save but I do not rerun notice that it is still like this.
6:52
So we have to restart the Python bits, if those change now they did but the templates are automatically just reloaded every time.
7:01
So there we have it, a real, real simple bit of code we were able to go and pass some data and form a model which itself was a list of dictionaries.
7:14
It doesn't actually have to be dictionaries at that level. Like the list could be database objects but it happened to be dictionaries.
7:20
So we passed those back and then we used tal:repeat. We used the string print operator and we used tal:condition
7:30
on version to print out either the version or if it was missing we defaulted it just triple zeros. One final thing to look at before we move on
7:39
let's look at the raw HTML that was created by this. Okay, you'll see it's really super nice and clean. We come over here and do a quick view source.
7:50
There is a bunch of stuff that is put out by the layout. We will talk about that later. But this bit right here, where it says content.
7:55
That is from our template that we just worked on. Notice we wrote h1 some packages, and we said div here is the class package and this
8:04
this one right here, that is the one that one is the one that has tal:repeat on it so right that is this.
8:14
So it has tal:repeat but it is just that block of HTML replicated over and over and then we have this span with the title, raw text in there.
8:24
And then the span, this one has the tal:condition and it just drops it out, right? Either shows one bit or the other, it doesn't
8:32
actually show you any of that stuff. So you can see the HTML that comes out is as clean as you are willing to write it.
8:39
It's pristine HTML, very light weight, really nice.