Chapter: HTML template partials
Lecture: Partials: A more realistic example
0:00 Let me give you a slightly more realistic, more complicated example where we get bigger winds with this partial concept.
0:08 We haven't talked about installing it yet. It's really easy to use, and we'll see in just a moment. But let's just look at one thing.
0:13 This is the final version of the app that we're building towards and there's going to be this infinite scroll section. So over here,
0:20 notice that we've got our recent videos and as I scroll, it's pulling more and more of them in.
0:25 Okay. So this implementation of, I need to show some of the videos right at the beginning and then as I scroll, I need to bring more and more in.
0:33 Well, that's a beautiful htmx thing that we're going to add. But what I want to show you is what does the code look like. This page
0:44 is the page we were just looking at, all of it. That's all of the HTML right there.
0:49 Now there is this partial section that's going to show you the videos. So here are the videos that are going to show up, and we're gonna show, we're
1:00 gonna go through each one, and we have a way to show the video. So there's these three levels of these partials, but taken as a whole,
1:07 they're quite simple and that is the entire HTML that we need to write to make that cool infinite scroll happen with zero
1:15 HTML duplication. Fantastic, right? Well, probably it's complicated on the server, right? Nope. That is the entire server-side implementation.
1:24 Here's the one that loads up the original page and then when it comes back, when htmx comes back, it just, it's going to ask for a partial and
1:33 say what page, what section it needs to get in this partial scroll and then directly render one of the smaller pieces.
1:41 Amazing, so this is the kind of code we're going to be able to write and we will write later as we adopt this Jinja Partials package.