htmx-interaction-patterns

What problem does it solve? Building interactive web UIs typically requires writing client-side JavaScript for AJAX calls, DOM updates, and state management. This Skill provides htmx patterns that deliver dynamic behavior—partial page updates, lazy loading, infinite scroll, and server-sent events—using only HTML attributes and server-rendered fragments. ## Core Features & Use Cases - Attribute-Driven Requests: Use hx-get, hx-post, hx-target, hx-swap, and hx-trigger to issue HTTP requests and update the DOM without JavaScript. - Common Interaction Patterns: Ready-made recipes for debounced search, inline editing, infinite scroll, lazy loading, confirmation dialogs, and server-sent events. - Server-Side Integration: Patterns for returning partial fragments vs full pages, using HX-Trigger/HX-Retarget response headers, and out-of-band swaps to update multiple elements. - Use Case: Add live search to a FastAPI app by wiring an input with hx-get and a 300ms debounce, then returning an HTML fragment from the endpoint—no frontend build step required. ## Quick Start Ask the AI to add an htmx-powered debounced search input that fetches results from a server endpoint and swaps them into a target div.