CF

HTMX - The Practical Guide

4h 5m
English
Paid

HTMX - The Practical Guide is a 60-lesson 4 hours 5 minutes self-paced course by Academind Pro (Maximilian Schwarzmüller). Are you tired of picking the right JS library from a vast sea of libraries?

Course facts

Lessons
60
Duration
4 hours 5 minutes
Level
All levels
Language
English
Updated
Instructor
Academind Pro (Maximilian Schwarzmüller)
Price
Premium

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

Who teaches HTMX - The Practical Guide? 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.

What lessons are included in HTMX - The Practical Guide?

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

What courses are similar to HTMX - The Practical Guide?

More courses by Academind Pro (Maximilian Schwarzmüller)

Frequently asked questions

What prerequisites are needed before taking this course?
The course does not assume any prior knowledge of HTMX, making it accessible to beginners. However, a basic understanding of HTML and general web development concepts would be beneficial to follow along with the lessons effectively.
What kind of projects will I work on during the course?
Throughout the course, you will engage in practical projects that involve setting up HTMX, sending GET and POST requests, handling responses with HTMX-specific attributes, and implementing features like form validation and automatic progressive enhancement with hx-boost.
Who is the target audience for this course?
This course is designed for web developers who are looking to simplify their frontend development process by reducing the amount of JavaScript they write. It is ideal for those interested in AJAX requests and DOM manipulation without the complexity of traditional JavaScript libraries.
How does this course compare to courses on other JavaScript libraries?
Unlike courses focused on comprehensive JavaScript libraries, this course emphasizes HTMX's ability to extend HTML with new attributes for handling AJAX requests and updating the DOM. It highlights the library's potential to simplify frontend development by minimizing client-side JavaScript.
What tools or platforms will be covered in this course?
The course centers around HTMX and its core features, such as hx-target, hx-trigger, hx-select, and hx-confirm. It also covers integrating HTMX with server-side settings, handling HTMX-specific events, and working with extensions to enhance functionality.
What topics are not covered in this course?
The course does not focus on traditional JavaScript frameworks or libraries for building single-page applications (SPAs). Instead, it explores how HTMX can be used to achieve similar goals with less complexity and JavaScript code.
What is the expected time commitment for completing the course?
The course consists of 60 lessons, each designed to be digestible and practical. Although the exact runtime is not specified, students should be prepared to dedicate several hours per week to complete the lessons, exercises, and projects.