HTMX + Flask: Modern Python Web Apps, Hold the JavaScript Transcripts
Chapter: HTML template partials
Lecture: Partials: A more realistic example

Login or purchase this course to watch this video and the rest of the course contents.
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.

Talk Python's Mastodon Michael Kennedy's Mastodon