Python for Decision Makers and Business Leaders Transcripts
Chapter: Web development with Python
Lecture: Adding dynamic HTML
Login or
purchase this course
to watch this video and the rest of the course contents.
0:00
Hello World is fun, but it's not very realistic. We want HTML pages. These are the pages you see on the web, right? Not this silly little string.
0:09
So let's do a quick thing to change this. Notice I've added two directories static, where we're going to put some design things
0:15
like images and style sheets and so on and this template folder. So over here I'm going to add a file HTML file called index.html.
0:26
It has a title. Let's call this Guitary. That's going to be our little application. And let's put a little header like this.
0:34
Welcome to our guitar store. And what we want to do is we want to list out the guitars. We want to have some data and show it.
0:42
First of all, we're going to need to change this around. Instead of saying here's a string we have to go to Flask and say render_template
0:50
and we have to give it the name. And PyCharm knows about this convention so it's like, oh, here's one that looks like it might work.
0:56
If we rerun this and we check it out now woohoo, look, welcome to our guitar store. We look at it, there's exactly what you would expect.
1:09
That's pretty cool. However, we would like to pass some interesting data. We're going to get a bunch of guitars. How do we pass the guitars along?
1:16
Well, let's just say I've got a little bit of data here and it's a letter A, a letter B, a letter E, and a letter J. So we can come in down here
1:26
and just say values equal data or whatever. We could just make up this name as long as we know what to refer to over on our template.
1:33
And we can come down here and we can have a little section. We can have, like an unordered list that has a list item in it.
1:41
If you don't know HTML, don't worry about it. We're just going to put some repeating HTML in here real quick. So what we say is we say
1:48
it'll be % for letter and value's what I called it and then down at the end, we'll have to say N4.
1:56
And the middle, we're just going to put out the value. So let's put out the letter and let's say we want to make it uppercase
2:02
so we can do that if we like. Now, over here guess we'd better run it again. If we click on this, look at that, what we get.
2:10
A, B, E, J. And to be honest we're kind of done with Flask in a sense. Like, this is mostly what Flask does. And to give you a sense
2:20
that's why I wanted to go through this of what web frameworks do in Python is we get then started, get 'em running
2:26
we tell it what the URLs that it needs to process are what is the logic behind each one we're going to go and get some data
2:33
and we pass it over to an HTML file which has a way to take this data and an HTML template like this and we didn't really look at the outcome, did we?
2:43
Let's actually look at the view page source. And it turns it into just straight, static HTML. So this is what Flask does.
2:52
We're going to do two quick more things just to make this work better. We're going to go and get this data from a database or something like a database
3:00
instead of just making it up here. But this part doesn't change. We're also going to put a little web design on here.
3:06
But again, that's just HTML and CSS. That's kind of a separate thing. If you understand what's happening here you kind of know what Flask does.