I am eager to learn a new stack that would add value to my django projects. My new friend is htmx, and I feel like sharing the resources on where to learn about using htmx with Django . In this article, I will look at online resources that I think are best for beginners to use htmx within their Django projects.

htmx is best to use in our django projects because it allows us to perform AJAX requests to our Django backend and swap out content in the DOM without writing any single line of JavaScript. According to htmx documentation, htmx gives you access to AJAX, CSS Transitions, WebSockets and Server Sent Events directly in HTML, using attributes, so you can build modern user interfaces with the simplicity and power of hypertext.

Motivation

• Why should only and be able to make HTTP requests?
• Why should only click & submit events trigger them?
• Why should only GET & POST methods be available?
• Why should you only be able to replace the entire screen?

Here’s a list of the places I know!

Documentation Sites

It is worth mentioning both django and htmx documentation in the article because it is a stepping stone for all developers if they want to learn django and htmx.

htmx Documentation

I find the documentation useful, and it will take you through the basic stuff that will give you a clear picture of what htmx is all about. Here is a link to the documentation: htmx.org

Django Documentation

Finding amazing frameworks for developing and maintaining fantastic web applications is a constant pursuit for web developers. By following the documentation, beginners can easily comprehend Django's fundamentals. Thanks to the documentation's clear writing style. Here is a official documentation docs.djangoproject.com/en/4.0

django-htmx documentation There is an excellent write-up by Adam Johnson in the documentation for jango-htmx. The documentation covers the requirements of using Django and htmx with examples. Besides their documentation, there is a small package that makes integrating Django with HTMX a little easier; here is a link to the package: pypi.org/project/django-htmx. Documentation link: django-htmx.readthedocs.io/en/latest. At the time of writing the package supports Python 3.7 to 3.11and Django 3.2 to 4.1.

Videos

I do both reading and watching video tutorials and i can’t say i watched all django + htmx videos, but I did watch a few of them available on youtube. There are some videos on YouTube that look promising. I have seen a few conference talks about django + htmx also.

1. BugBytes: Django & htmx youtube.com/watch?v=Ula0c_rZ6gk&list=PL..

2. Pretty Printed: Django + htmx Example App: Progress bar, infinite scroll and modal with NO JavaScript youtube.com/watch?v=vukzYCi2_yE&t=77s

3. JustDjango : Django Dynamic Forms Tutorial with htmx youtube.com/watch?v=KVq_DjIfnBo&t=1581s

4. DjangoCon Europe 2021: htmx Frontend Revolution by Thomas Güttler youtube.com/watch?v=Zs0DXR1S03M&t=1774s

Blog

There are many written articles that are worth reading. For the purpose of this blog I chose some online articles that provided some straightforward examples.

1. How to Build Templates for Django Applications with HTMX section.io/engineering-education/how-to-bui.. by Muhammed Ali

2. Learn how to build dynamic forms with Django and Htmx. justdjango.com/blog/dynamic-forms-in-django.. by Matthew Freire

3. Modal forms with Django+HTMX blog.benoitblanchon.fr/django-htmx-modal-form by Benoit Blanchon

4. Django and HTMX - List And Create Page (with no refreshes!) bugbytes.io/posts/django-and-htmx-list-and-..

5. Django, Bokeh and HTMX - Data Driven Line Charts bugbytes.io/posts/django-bokeh-and-htmx-dat..

Nothing beats Django and htmx

Hope the resources mentioned above help you start or improve your django + htmx skills. Good luck with your journey learning about using Django and htmx together. If you find any interesting new stories, please let me know!

P.S. Thanks to Adam Johnson for reviewing the post.