CF

HTMX - The Practical Guide

4h 5m
English
Paid

Are you tired of picking the right JS library from a vast sea of libraries? And do you sometimes feel like frontend JavaScript development & code became unnecessarily complex?

HTMX might just be the right solution for you!

Because HTMX is an amazing JavaScript library that helps you avoid writing client-side JavaScript code!

It's a library that extends HTML by adding new attributes which you can use to add & control element behavior. Specifically, HTMX is a library that simplifies the process of sending AJAX requests and updating the DOM based on the response.

But you'll learn all about the core HTMX features as well as advanced HTMX concepts you need to know in detail in this course!

HTMX is a such an amazing library that allows you to write efficient client-side code that I simply had to create a course on it - even though I originally didn't plan to do that!

Therefore, in this course, I'll walk you through all core HTMX concepts step-by-step, without any prior HTMX knowledge assumed!

In detail, you'll learn:

  1. What HTMX is & how it works
  2. How to add HTMX to a website
  3. How to use HTMX for sending AJAX HTTP requests
  4. How to control request data
  5. How to control where the response will be rendered
  6. How to control which part of the response will be rendered
  7. How to handle responses with multiple content elements
  8. How to configure requests & responses
  9. How to build single-page-applications (SPAs) with HTMX
  10. And much, much more!

And you'll learn all that by working on multiple demo projects which allow you to dive deeper and deeper into HTMX.

Therefore, by the end of the course, you'll be able to add HTMX to your next web projects and reap its benefits!

Additional

https://github.com/academind/htmx-course-resources

About the Author: Academind Pro (Maximilian Schwarzmüller)

Academind Pro (Maximilian Schwarzmüller) thumbnail

Academind is the teaching brand of Maximilian Schwarzmüller (Max) and Manuel Lorenz, two German developers whose Udemy catalog has become one of the largest single-instructor presences on that platform. Max in particular is widely cited as one of the clearest teachers of the JavaScript framework landscape — his Angular, React, Vue, and Node.js courses have collectively taught millions of students.

The Academind Pro platform extends beyond Udemy with deeper, more comprehensive courses aimed at developers building real applications rather than picking up syntax. Course material covers the full modern web stack: React (including Next.js), Vue, Angular, Node.js, NestJS, TypeScript, Docker, AWS, React Native, Flutter, and the broader full-stack JavaScript ecosystem.

The CourseFlix listing under this source carries over 25 Academind Pro courses spanning that range. Material is paid; Academind Pro runs on per-course pricing on the original platform. Courses are taught in Max's signature thorough, build-an-application-with-me style — long-form, deeply project-based, and continuously updated as the underlying frameworks evolve.

Watch Online 60 lessons

This is a demo lesson (10:00 remaining)

You can watch up to 10 minutes for free. Subscribe to unlock all 60 lessons in this course and access 10,000+ hours of premium content across all courses.

View Pricing
0:00
/
#1: Welcome!
All Course Lessons (60)
#Lesson TitleDurationAccess
1
Welcome! Demo
01:47
2
What Is HTMX? And Why Would You Use It?
02:23
3
Module Introduction
01:02
4
Project Setup
05:09
5
Installing HTMX
03:24
6
Using HTMX & Sending GET Requests
09:02
7
Deep Dive: Where & How Can You Use HTMX?
03:43
8
Defining Response Target with hx-target
04:29
9
Changing the Request Trigger with hx-trigger
04:10
10
From GET to POST with hx-post
04:02
11
Submitting Data with HTMX
04:37
12
Handling POST Requests & Responses with HTMX
06:54
13
Picking Parts of a Response with hx-select
03:47
14
Time to Practice!
12:43
15
Module Introduction
01:32
16
Starting Project
01:16
17
Sending DELETE Requests
08:59
18
Avoiding Client-Server Sync Issues
05:59
19
HTMX Inheritance
03:13
20
Reusing HTML Fragments
03:30
21
Advanced Targeting with hx-target
04:28
22
Requesting Confirmation with hx-confirm
02:12
23
Listening to Events with hx-on (
03:20
24
Working with HTMX-specific Events
05:05
25
Disabling Elements During Requests
03:06
26
Onwards To A New Project & Sending A POST Request Without A Form
04:08
27
Adding Extra Request Values
03:24
28
Returning a List Fragment in the Response
02:43
29
Setting HTMX Attributes Dynamically (On The Server)
06:42
30
Performing Out Of Band Swaps
06:26
31
Out Of Band Swaps & Delete Requests
02:18
32
Advanced Swapping Configuration: Scrolling Content Into View
05:27
33
Adding Separate JavaScript Files & Code
07:42
34
Updating The UI Without HTMX (With Custom JavaScript Code)
05:32
35
Using HTML Element Data With Help Of HTMX
03:33
36
Handling Default Events With JavaScript
01:49
37
Pausing & Resuming HTMX Requests
03:51
38
Preparing The Project For The Next Steps
06:05
39
Revisiting HTMX Requests & Event Handling
06:30
40
Implementing Polling
03:02
41
Configuring HTMX Globally
03:28
42
Working with HTMX Extensions
02:55
43
Module Introduction
01:35
44
Starting Project
02:16
45
Sometimes, HTMX Doesn't Submit The Data We Need
03:04
46
Controlling Attached Data to Outgoing Request with hx-params
04:10
47
Adding Headers to Outgoing Requests
02:40
48
Implementing Form Validation With HTMX
04:06
49
Synchronizing Multiple Requests
04:07
50
Triggering "Real Redirects"
04:29
51
Retargeting Responses & Reconfiguring Response Handling
06:29
52
Handling Multi-Response Cases With A Special Extension
05:35
53
Module Introduction
01:44
54
From Multi-Page Application (MPA) to Single-Page-Application (SPA)
03:30
55
Using HTMX Attributes To Fetch & Render Entire Pages
02:36
56
Updating the URL & Saving Previous Page State
02:26
57
Unlocking Automatic & Progressive Enhancement with hx-boost
02:37
58
Boosting Forms & Post Requests
03:13
59
Summary
00:56
60
Course Roundup
04:00
Unlock unlimited learning

Get instant access to all 59 lessons in this course, plus thousands of other premium courses. One subscription, unlimited knowledge.

Learn more about subscription

Related courses

Frequently asked questions

What is HTMX - The Practical Guide about?
Are you tired of picking the right JS library from a vast sea of libraries? And do you sometimes feel like frontend JavaScript development & code became unnecessarily complex? HTMX might just be the right solution for you! Because HTMX is…
Who teaches this course?
It is taught by Academind Pro (Maximilian Schwarzmüller). You can find more courses by this instructor on the corresponding source page.
How long is the course?
It contains 60 lessons with a total runtime of 4 hours 5 minutes. Every lesson is available to watch online at your own pace.
Is it free to watch?
It is part of CourseFlix's premium catalog. A subscription unlocks the full video player; the course description, table of contents, and preview information are available to everyone.
Where can I watch it online?
The course is available to watch online on CourseFlix at https://courseflix.net/course/htmx-the-practical-guide. The page hosts every lesson with the integrated video player; no download is required.