 What's up guys this is John Hammond still looking at some of the Python flask module So in the last video we took a look at how we can create different URL routes in our flask application But now we're going to get into actually writing like stuff that you would require for a website right like HTML The cool stuff the stuff that actually makes it a web page So you can of course just include HTML tags and stuff that you want to have as like HTML stuff in your application So if I'm running this and I've got it loaded here if I had those header one tags You can open up and you'll see that okay now that hello world text We have before is much larger because it's a header tag if you wanted to use strike, etc. We could So we have like the option to use HTML in here But that's obviously not really the prettiest thing when you have HTML kind of embedded in your your Python code so flask offers up a solution and it's noted as templates and it uses the Jinja to Templating engine and you can essentially take advantage of it by using the function render template and we'll have to include that from Python Python's flask module atop We want to import not just the flask object But also this function render template right up top and we'll have to use it for our pet bait thing to go away So if you actually were to be using a template all of those files have to be stored in another directory That's inside the same directory as your own source code Whether or not it's a package with a Python init file or a script that we're working with like in our case So we will just have to create a directory templates. Let's go ahead and do that Just going to make directory templates cool and now let's create a new file called like base page dot HTML So we can use HTML normally here just like we would in any regular web page that we're trying to design So I'll just whip out some basic HTML here head title our flask app and title Meta car set equals utf 8. Okay Make sure we end that element So now if we wanted to rather than returning a string we can simply run Render template and we'll have to supply the template file name So base page on HTML is the name of our file and it's in this templates directory, right? Yep so if we wanted to say base page dot HTML we certainly could and then trying to load that website and Now we will have the full HTML here So we can view the source and we've got HTML great So that's neat, but the real benefit doesn't just come from okay. I can render HTML It's that we can control variables and things that actually go through this template. So in case we wanted to have a Application that would say names or say hello, right? We can say hello and We'll include a string name name And we'll say we can pass along that variable to our render template function Keyword being okay the name of the variable that will be present in The template that we can access with the ginger syntax of these two curly braces trying to note a variable and We'll pass in the variable that we want within Python. So if we had this like Identity that is still going to be here where you'll reach Name being the variable that you're using as a keyword argument right in that Python function so Let's change this back to name. I just don't want that that to be confusing I wanted you to understand the distinction between the two of them Okay, so Now whether or not we actually supply a name We can do the same test that they're displaying here in the documentation because Ginger is awesome and allows us to do some like logic determination not by using the two curly braces for this one But instead using a opening or ending curly brace with a percent sign. So that allows us to do Like for loops and if conditionals etc. etc. So it adds a little bit more program Programmatic functionality inside the templates so I can test if name and that case is just saying if name exists Or if it's actually supplied or has a length greater than one it'll display that Otherwise, we'll have an else statement here We can say hello world Just like they're doing kind of in that documentation here so we can see it in action Okay So now we have the same functionality that we had in our previous application with URL routing but we are using one URL and We're able to determine whether or not a name is supplied and it'll change the functionality within our template because our template is the one That's doing the logic. So let's check this out now. We'll get to our forward slash and Name is what we're going to have to define here. Oh We need to do an end if you have to specify what it is that you're ending in our template here This is the flask debugger. So again, we had the option to execute code from here But it will explain an actual error rather than just simply crashing the program. So that's good to know and that is One word and if is its own word a good note here is that in the documentation they specify another route for this same Function here. So if we wanted to not have that error on just the index page We can do that same without the name variable being supplied. We can just have it defined here So now back in the original application after that's been reloading we Will of course have to make that argument optional so we can set it to none in that case It doesn't have a value if it's not actually supplied and that same base page will be able to determine Okay, whether or not it's actually included here. So we can go ahead and run that And now we just have hello world, but if we were supply a name hello, John It'll go ahead and greet us. So perfect But even more power comes from this when we start to talk about actual template inheritance because we can explain and and kind of define a Template that will use as literally a base page like a header or a footer for our actual like content and Let's say we had okay. Here's our navigation that we want Here are the links that we want to actually include you well we can have pages for like Actually contacting us or about etc Let's actually leave these as blank links for now same thing for about Home etc. So you can have other lengths that you'll include only in your base page. So that way you don't have to Change that navigation scheme for every single page in your website You can only do it in one location as in the like actual Template that you want to use as both your header and your footer or your layout in this case So you can define a block You can see over off the side in the documentation That will actually be your content and it will be replaced with whatever you use or specify in another Template here. So if I wanted to include like home Dot HTML we can say that home will extend from the specific layout in our case base page You'll specify all the information that you actually want to have in here And you can use as many blocks as you particularly like but content is kind of just the same one that you see most often So it extends base page dot HTML We'll note our block Content Not our end block So we can have our own paragraph tags in here and Then define a simple page that may be the home page or whatever it may particularly like So when we render the template we can specify only home dot HTML But it will include or extend from that base page layout that we created So again, we can have our navigation or links to any CSS files or JavaScript files accessible from a global location So let's go ahead and see how that looks Check out Firefox here, and now we've got our navigation up top and we've got welcome to our page And we don't need any of these name functionalities for what we were just doing but That is the functionality that makes templates awesome because you can have essentially headers and footers in their own One file and easily modify that to make like site-wide changes as you need to so cool Thank you guys for watching. I do want to shout out my supporters here those individuals that send some love on patreon You are helping me so so much be inspired and motivated to make more content $1 a month on patreon will give you a shout out just like this at the end of every video $5 a month gives you early access to content videos that I record before I release them on YouTube If you did like this video, please do leave a like maybe a comment if you're willing to subscribe And hey, if you want to support me check me out on patreon. Thanks guys