Skip to main content

htmx

Overview​

htmx extends HTML with attributes (hx-get, hx-post, hx-swap, …) so servers return partial HTML instead of building a heavy client SPA. It pairs naturally with Django, Rails, Laravel, Go templates, or any backend that can render HTML fragments.

Key concepts​

  • Hypermedia-driven: UI state transitions as HTTP + HTML.
  • Partial swaps: Replace fragments of the DOM from responses.
  • Triggers: Events, polling, WebSockets/SSE extensions (htmx extensions).
  • Out-of-band swaps: hx-swap-oob for multi-fragment updates.
  • Security: CSRF tokens, proper Content-Type, and server-side validation remain required.

hx request flow​

Sample: button loads fragment​

<button hx-get="/fragments/stats" hx-target="#stats" hx-swap="innerHTML">
  Refresh stats
</button>
<div id="stats"></div>

References​