What you'll learn:
- HTMX core attributes and behavior
- How to build a CRUD app with Django & HTMX
- How to build a WebSocket-driven chat app with Django, HTMX and django-channels
- HTMX integration with tools like Alpine.js, GSAP and Sweetalert
- How to deploy Django apps (with django-channels and Redis) to Render cloud platform
- How to work with file uploads and cloud storage (Amazon S3)
Django is the most popular Python web framework, and an up-and-coming paradigm is to build Hypermedia based applications using tools like HTMX. These remove the complexity and bloat of JavaScript frameworks, providing a simpler and more stable model for building web apps.
In this course, we'll look at HTMX from the ground up, before eventually building a more complex chat-room application that uses django-channels to handle WebSocket functionality, and will integrate this with tools like Redis and the HTMX WebSocket plugin. We'll look at deploying this app to the Render cloud platform, and will look at at handling file uploads to cloud storage (Amazon S3) using Django & HTMX.
Throughout the course, we will look at the following concepts, among others:
Fundamental HTMX attributes - hx-get, hx-trigger, hx-target, etc
Hypermedia concepts - HTML over the wire, locality of behavior, AJAX requests
Building CRUD applications with HTMX and Django
HTMX integration with Sweetalert2 for confirmations
HTMX integration with GSAP for animations
HTMX integration with Alpine.js for interactive, sleek webpages
File uploads with HTMX and Amazon S3
HTMX WebSocket plugin
HTMX SSE (server-sent events) plugin
django-channels & Redis integration
Broadcasting messages to chat rooms with Channel Layers
Integrating HTMX with Django core features - Models, Forms, Views, Templates
Deploying Django apps to the Render cloud platform
HTMX Polling functionality
Server-Sent Events functionality with Django & HTMX
Implementing common HTMX patterns such as Active Search
Useful Django packages - django-htmx, django-template-partials, Whitenoise
Basic TailwindCSS and DaisyUI styling
