django-htmx - Django Extensions for Working with HTMX

[@gulledhaydar]

This is actually the first HTMX video I've watched from beginning to end. Why? Because it demonstrated real-world issues. Thanks all the way from Somalia!

[@bugbytes3923]

Thanks a lot for watching, and greetings from Scotland!

[@立法院很忙]

Always happy to see Django + HTMX content. Thanks!

[@bugbytes3923]

Thanks a lot! Glad to hear it!

[@vivaldi-qo7xj]

I watch all videos with django and htmx very carefully. Thanks.

[@bugbytes3923]

Thank you, hope they were helpful!

[@bitemouth]

Thanks for the video. Please don’t skip frames of copy paste and editing... it becomes more easy to follow and understand... thanks again for the video🎉

[@gichukimike]

Thank you for the tutorials, I had not looked into that Django-htmx that deeply. Thank you for simplifying for us. Your tutorial has made my current project awesome

[@bugbytes3923]

Thanks Michael - great to hear that, I’m glad it’s helped!

[@AmoahDevLabs]

This library maintained by Adams Chainz is quiet interesting. Thanks for showing the in-depths of django-htmx.

[@bugbytes3923]

Thanks!

[@AliHassan-wc6nb]

This guy is another champ! Very academy, code holic, django Mastery, codewithstein, and bugbytes!! But for htmx! One and only bugbytes.

[@bugbytes3923]

Haha thanks a lot! Some great channels there.

[@CristianMolina]

Love it, thanks for sharing about htmx. I'm new to Django but long time Rails dev and it's nice to see this htmx nice companion package.

[@bugbytes3923]

Thanks a lot! Great thing about HTMX is that it works well with anything, so these examples translate easily to Rails and other frameworks!

[@GavinElie]

Your videos are always very clear and concise. Thank you for these very useful tutorials.

[@bugbytes3923]

Thanks a lot!

[@banka990]

Thank you for the content you produce. And thank you for the Scottish accent! 😀 I was supposed to move to Scotland recently but some unfortunate events stopped me, so this will help ease the pain. I'm in the beginning of my Django learning journey, so I will definitely come to your videos many times. Good luck!

[@bugbytes3923]

Thank you very much - glad you like the content (and accent) 😄Sorry to hear the move to Scotland didn't work out. If you have any requests for content, feel free to let me know, and good luck!

[@banka990]

@@bugbytes3923 GeoDjango is something I'm interested in. It's still too early for me to jump right there, but hopefully in the future I can use your videos to get familiar with it. Thanks!

[@Bartburger02]

Thank you again for making me aware of another useful library and providing an informative introduction 🎉

[@bugbytes3923]

You’re welcome, thanks a lot for viewing!

[@ChrisPatti]

I really enjoyed this video. Thank you for making it! It’s an excellent romp through some of the possibilities, HTMX and Django offer.

[@bugbytes3923]

Thanks a lot Chris!

[@dymastro788]

Thanks again for the HTMX content! Looking forward to course. Also thanks for explaining all the small steps you do in your video. Really helpfull.

[@bugbytes3923]

Thanks - glad the explanations are useful! Will hopefully start recording the course in the next few weeks.

[@dymastro788]

@@bugbytes3923 Cool thanks for the effort. Question: Are you planning a video with HTMX + Leaflet? :)

[@sovfren]

Im so glad I found your channel. Im an aspiring django developer and ive made some static pages however I was dreading taking on JavaScript and discovered HTMX. Your content is precise and has already got me going. Thanks all the way from Sunderland 😁

[@bugbytes3923]

Thanks a lot! Glad it’s helping, and greetings from Glasgow 😄

[@МаксимБалашов-м3г]

HTMХ again! This is wonderful! Thanks for the videos!

[@bugbytes3923]

You're welcome, thanks a lot for the view!

Good morning from Argentina 😊

[@bugbytes3923]

Hello from Scotland !😎

[@seydinaoumarsamabaly1806]

What more can I say other than thank you Master for everything you do. A real treat your tutorials 😌

[@bugbytes3923]

Thank you so much, Seydina! 😃

[@iloveloam276]

This is awesome dude. I'm learning HTMX/Hyperscript and it's a massive help to be able to reference your videos along with the documentation, especially as i'm more of a Django person than a Javascript wizard!

[@bugbytes3923]

Thanks a lot! Glad they have helped - and yeah, I think a lot of us would prefer to do the lifting in Django rather than JavaScript 😄

[@iloveloam276]

@@bugbytes3923 haha In my learning I went from Python (yay), Django (yay), JS....wtf is this! ;) HTMX/Hyperscript, is actually making me look at a lot more JS but it's hard when you are as used to Python.

[@martincronje5242]

As always a good systematic explanation.

[@bugbytes3923]

Thank you!

[@keenoogodlike]

I love HTMX already, great content!!!

[@bugbytes3923]

Thanks a lot!

[@IqbalArain-io3du]

You explained really really well. Thank you soooooo much ❤

[@bugbytes3923]

Thanks a lot, much appreciated!

[@JustinSpryce]

Thank you sir, for the htmx lesson

[@bugbytes3923]

You're welcome, thanks for watching Justin!

[@jgibs1]

Truly helpful videos. Thank you for the time you put into them.

[@bugbytes3923]

Thanks !

[@WebDevTrailblazer]

Great work 👍

[@bugbytes3923]

Thanks!

[@repotranstech]

Cool video as always 👍

[@bugbytes3923]

Thank you!

[@Yarkanlaki]

🎉 i had headaches with htmx cuz it swapped same element in every htmx request

[@sudoscientist255]

You're my favorite channel for modern django and tooling for it. I've been getting into htmx and hyperscript a lot. Would you please make a video on the htmx extension 'client-side-templates' with django for more dynamically templating partial endpoints (specifically api-like endpoints just returning data)? A couple months ago I'd been learning XSLT and XSD (XML) with ideas of using it with XHTML in django projects. It seems like overkill using it though just to template incoming data from an api endpoint yet this htmx extension seems like a much better fit. I'm also interested in where to put the mustache/handlebars templates if doing this (in static or templates?) as well as the ease of integration and compared performance to the normal template partials. Keep up the content! Always enjoy it, especially the django stuff with an extra bonus for all django + htmx topics

[@bugbytes3923]

Thanks a lot! I'll have a look into your suggestion!

[@genesisguerrero7151]

Great summary!

[@bugbytes3923]

Thanks!

[@keyton_weissinger]

Great video. You mentioned that in prod you’d not use CDN to pull in htmx. Why not and what would you do instead?

[@bugbytes3923]

Thanks Keyton. You're better to serve the static content such as vendor libraries (HTMX, Alpine, etc) directly from the server, rather than from a CDN. Good article on why here: blog.wesleyac.com/posts/why-not-javascript-cdn On prod, you have a few options: 1. Download the HTMX source code directly to your repository, and serve it from the static root. You could, for example, just copy the source code from the CDN to a local file called 'htmx.min.js' and add that file to your static resources in the Django project. 2. Use NPM and a tool like Webpack or Vite, and manage your JavaScript resources through this bundler tool. Better to do this if you're using a lot of external JavaScript libraries, perhaps. Maybe this should be a video :D

[@keyton_weissinger]

@@bugbytes3923 Fantastic. THank you for the answer AND the link to WHY. Awesome!

[@unknown-fd1yz]

Hey really nice video About htmx, it seems like code readability and maintenance wise it would be a disaster since now (perceived) client side and server side is a lot more dependent on each other. So you cannot guess what the client side is doing without checking other partial templates.

[@bugbytes3923]

I agree with those points, to an extent. HTMX can simplify a lot of the development/deployment process, and is a great tool for developers who aren't necessary front-end engineers - but at some point with a large app, it may be difficult to maintain. The trade-off between the two approaches is interesting to me, but I still don't fully know my own opinion on it all :D

[@ec_789]

You're great, thanks,

[@bugbytes3923]

Thank you!

[@TomislavMiletic]

Thank you very much

[@bugbytes3923]

Thanks for watching!

[@LegionLeague]

That's an easy like from me. Quick question. Around 10-minute mark. What method should I overload in class-based views for `if request.htmx` part? Is it `def get`?

[@bugbytes3923]

Thanks a lot! Yes, for this example, you can overload the get() method. If you're using a FormView, it could be done in the form_valid() method too.

[@LegionLeague]

@@bugbytes3923 great, thank you! As a general feedback, it would be very useful if you could at least verbally mention the implementation in the class based views for those of us who prefer it :) what you wrote in this reply is absolutely enough. Looking forward to your next videos!

[@DwayneLofton]

Is there something similar for flask?

[@bugbytes3923]

There’s a package that’s similar for Flask, yes: github.com/edmondchuc/flask-htmx

[@DwayneLofton]

@@bugbytes3923 awesome! hope you do a video soon!

[@abbaskareem5281]

Last day someone on reddit was asking for best channels on youtube for django and htmx and everyone agree that BugBytes is the best ever !!!... thank you very much sir your content is very helpful and we use it a lot as a guide and best practice when using django and htmx .. I have a big project with djangorestframework as an api and react on frontend and I am rethinking of built it with django-htmx.. One question please, if we use hx_push_url it's only change the url I can't use for example to add active class base on url {% if request.path == 'aboutPage' %} bg-gray-600 text-green-400 {% endif %} .. what is the work around of this ?

[@bugbytes3923]

I didn't know that - nice to hear, thank you! I'm not sure about your problem there - you may need to write some custom JavaScript for this, perhaps - to check the current URL and add a class dynamically when the response is received. Will think about it and get back to you.

[@kennyPAGC]

Regarding the http response location, I really dislike using the target option on the view because of the coupling it creates between the backend and the frontend. Is there an alternative to control directly in the frontend where to load the response?

[@sudoscientist255]

Quick question, I've been using htmx in django without django_htmx and one of my views (submitting a form for an arbitrary content block model instance on the given page through a modal), when the form is valid, returns a simple HttpResponse with an 'HX-Trigger' parameter set to a custom htmx event I have configured on the client side. I am now wanting to use django_htmx to reduce my htmx-related configuration and hacks but am wondering regarding 'trigger_client_event', if I were to return a trigger_client_event with the response mentioned (having 'HX-Trigger'), would both events be fired or would the former one be overridden?

[@zackmcnelly]

Looking for methods to track page views. I have seen Django hitcount etc. But it requires the user is logged in and session data I believe. I wonder if there is a HTMX method. Great video as always! Thanks

[@bugbytes3923]

Thanks! Interesting suggestion, I'm not aware of any HTMX-based solutions at the moment, but will look into it.

[@zackmcnelly]

@@bugbytes3923 Thanks!

[@alcizonthebeatofficial6066]

Thanks for the video. But i have some questions, why is my local (src="js/htmx.min.js" ) not working, but the remote "src="http.........htmx....." is working ?

[@bugbytes3923]

I would guess your local path is incorrect - check the browser developer tools to see if you're getting any messages!

[@hamzabawumia]

How do you handle server errors like 500, 501 or 404 errors. During development, it is useful to see the actual django error in the browser rather than seeing it in the browser console.

[@codevalley9511]

Thanks brother, Make a video in which django views send the dictionary and we want render only some keys on ul And one e commerce using htmx

[@Septumsempra8818]

Anyone had hx-push problems with HTMX? I have a navbar with onclick animations. Whenever I use hx-push in my hx-get request, I lose the navbar animations. Only after a hard refresh does it all come back.

[@nson22]

A positive side of using HTMX for QA testing it because refer to ID attribute

[@Peterstavrou]

Love it! Is the only purpose of "boost" to send a boolean in a htmx request? Also, do you recommend using retarget as a general rule of thumb vs hx-target within the html or is it just a personal preference?

[@pss_crs]

please do alot of HTMLx and golang

[@bugbytes3923]

I’ll be doing more soon I think!

[@amjadalikhan1194]

Hi Please make video on localization how to work multi languages or bilanguages

[@bugbytes3923]

Added to the list - thanks Amjad.

[@Schlumpfpirat]

But why use retarget if you can just swatch OOB 🤔

[@bugbytes3923]

I think this comes down to preference. Two ways to achieve the same thing, essentially. OOB swaps are a little bit harder to reason about, in my opinion. Nothing wrong with them, but if I have django-htmx in my app, I'd probably opt for using the retarget() function.

[@Schlumpfpirat]

@@bugbytes3923 In my opinion refering HTML IDs within your Django code, couples the both interfaces a bit too tightly. Keeping frontend logic to the frontend makes maintenance easier and the overall architecture less complex.

[@bugbytes3923]

@@Schlumpfpirat That's a very good point on the other side of the argument, definitely!

[@frameff9073]

thank

[@bugbytes3923]

Thank you for watching!