The Rugged, Minimal Framework for Composing JavaScript Behavior in Your Markup
Add dropdowns, modals and live UI to server-rendered HTML with 15kB of JavaScript: no build step, no framework rewrite.
Alpine.js is a tiny JavaScript framework for adding behavior to server-rendered HTML. You declare state and interactions as attributes, x-data, x-show, x-on:click, and the library makes them work, with no build step, no virtual DOM and no component architecture to learn. It is the opposite of a frontend framework: a sprinkle of reactivity that respects the page you already have.
Why it matters to an indie builder: most product pages are server-rendered and need only pockets of interactivity, a dropdown, a modal, a live counter, an inline edit. Rebuilding those as a SPA is a tax with no payoff. Alpine keeps the backend in charge and adds exactly the behavior the page needs, which is why it anchors the TALL stack alongside Laravel and Livewire.
A realistic use: a pricing page with a monthly/annual toggle that updates all price labels and a comparison table. Markup stays readable, SEO sees real HTML, and the interaction is a dozen attributes. No bundler, no hydration mismatch, no JavaScript framework upgrade treadmill for a toggle.
Trade-offs: it is not built for large client-side state or routing; when a screen needs complex derived state, a real framework earns its place. Debugging attribute soup also gets harder as a page grows, so extract components (Alpine supports them) before the markup becomes unreadable. Compare with htmx if you prefer server-driven events, or with Vue if the interactivity is the app rather than a garnish.
Who it's for
Developers who want reactive UI behaviour sprinkled into server-rendered pages without a build step.
Official links
Keep exploring
Concepts in the glossary
1 in catalog
Alpine.js is written in
1 in catalog
Alpine.js is a component of
1 in catalog