talkpython / htmx-python-course

Student details, source code, and more for our HTMX + Flask: Modern Python Web Apps, Hold the JavaScript course.

HTMX + Flask: Modern Python Web Apps, Hold the JavaScript

Course Summary

htmx is one of the hottest properties 🔥 in web development today, and for good reason. This framework, along with the libraries and techniques introduced in this course, will have you writing the best Python web apps you've ever written: clean, fast, and interactive without all that frontend overhead.

If you are a Python web developer that has wanted to build more dynamic, interactive apps, but just don't want to (or can't) write a significant portion of your app in a rich frontend JavaScript framework, you'll absolutely love htmx. This library lets you write Python code you love and still add that client-side interactive aspect.

What's this course about and how is it different?

htmx is a very compelling technology. It's one of the first legitimate libraries that delivers on the promise of dynamic, interactive web applications without complex JavaScript. htmx allows us to write server-side code in any language (Python in our case) and, through a few simple HTML attributes, bring our pages to life.

This is the only course (that we're aware of) that shows you the full lifecycle of building Python and Flask-based applications centered around htmx. Unlike basic tutorials where you'll find only just quick coverage of a simple feature, we take a full-fledged web app and extend it by adding three real-world features all building upon htmx.

Moreover, we show you the right way to use htmx with Flask and Python. The resulting code is incredibly clean and would impress almost any professional web developer.

What topics are covered

In this course, you will:

• See how htmx differs from common JavaScript front-end frameworks such as Vue and React.
• Understand the server-side exchange enabled by htmx attributes (e.g. hx-trigger).
• Add click to edit to an existing data-driven Flask application.
• Learn about the jinja-partials package to refactor our jinja2 templates (with or without htmx).
• Add deep linking to our dynamic web application, allowing us to share links into interactive segments.
• Add active search to an existing data-driven Flask application.
• Implement browser history for htmx actions (allowing back and forth navigation).
• Add infinite scroll to our app.
• Distinguish between full page requests and partial htmx requests within a single view method in Flask.
• And lots more

View the full course outline.

Take the course

Visit the Talk Python Training course page to sign up today.

htmx-python-course's Issues

Make Django HTMX course

I’ll love to see how things play in Django

typo in infrastructure/request_dict.py?

Lines 24-26 of https://github.com/talkpython/htmx-python-course/blob/main/code/ch4_app/ch4_starter_video_collector/infrastructure/request_dict.py read:

form = request.form
if isinstance(request.args, MultiDict):
    form = request.form.to_dict()

Should request.args in line 25 be changed to request.form so it reads:

form = request.form
if isinstance(request.form, MultiDict):
    form = request.form.to_dict()

?

sys.gettrace() is not being used anymore

Hi there,

While going through the course, I have noticed that the debugging mode in Pycharm doesn't activate the debugging mode in Flask anymore. However, if I replace the code below

htmx-python-course/code/ch4_app/ch4_final_video_collector/app.py

Line 50 in d9cc19e

being_debugged = sys.gettrace() is not None

with

    being_debugged = sys.monitoring.get_tool(sys.monitoring.DEBUGGER_ID) is not None

It now works again.

If maintainers approve of this change I will prepare a PR :) I can also keep it backward compatible.

What do you think?

Blueprint Error running the sample app

Tried to run the app from the ch4_starter_video_collector folder. I'm using anaconda, had to install pydantic but when I tried to run the app I got the error that Blueprint does not have a get method. I replace get with route in all 3 view files - and not the app is running fine. Just as a hint for others stumbling at this point. Excited to move this app to htmx. Thx for the course.