The htmx Guide
By Flavio Copes
htmx guide: what htmx is, why hypermedia-driven apps beat SPA complexity for most projects, and how htmx fits the AHA Stack.
htmx is a small JavaScript library that lets you build dynamic web apps without writing JavaScript.
The idea: any HTML element can make an HTTP request, and the server responds with HTML that gets swapped into the page. A button can POST a form. A div can load its content lazily. A search box can fetch results as you type.
You express all of this with HTML attributes:
<button hx-post="/clicked" hx-swap="outerHTML">
Click me
</button>
When clicked, this button sends a POST request to /clicked and replaces itself with the HTML the server returns.
That’s the whole model. The server renders HTML, htmx swaps it in. No JSON APIs, no client-side state management, no build pipeline.
Why htmx matters
For years the default answer to “I need interactivity” was a full SPA framework. That brings a lot of complexity: client-side routing, state synchronization, hydration, huge bundles.
htmx pushes back on that. Your server stays the source of truth. Your pages stay HTML. You get the smooth, no-reload feel of an SPA while keeping the simplicity of server-rendered pages.
My advice: if your app is mostly forms, lists, and pages, htmx will get you there faster than React, and the result is easier to maintain.
htmx in the AHA Stack
htmx is the “H” in the AHA Stack: Astro, htmx, Alpine.
Astro renders pages on the server. htmx handles the client-server communication, swapping fragments of HTML. Alpine covers the purely client-side bits, like toggling a dropdown.
I wrote hub pages for the other two parts as well: the Astro guide and the Alpine.js guide.
Practical htmx posts
A few hands-on posts solving specific htmx problems:
- HTMX, perform something on page load using the
loadtrigger - htmx, redirect after request with the
HX-Redirectresponse header - htmx, send files using htmx.ajax() for programmatic uploads
Go deeper
I wrote a free ebook on htmx: the htmx Handbook. It covers the core attributes, triggers, swapping strategies, and how to structure a hypermedia-driven app. Free download, PDF and EPUB.
If you want to see the full picture, the AHA Stack Masterclass is my course on building complete applications with Astro, htmx, and Alpine working together.
All posts on this topic are in the htmx tag archive.
Related posts about htmx: