Say No To Complexity With AlpineJS
summary
A tiny reactive framework that ships as 7.5 kilobytes served from a CDN and requires no build, AlpineJS exposes 13 directives and 6 magic properties to compose behavior in markup. Examples include a working counter, a 20‑character tweet box with real‑time length and conditional class binding, and a one‑line integration of Pikaday date picker via X‑init/X‑ref. It uses MutationObserver and direct DOM updates (no virtual DOM), supports X‑show with .away .window and transition modifiers, and pairs well with server‑rendered apps.
AI-written summary · about
chapters (4)
- 0:00Start
- 17:07listening for key down events
- 19:02extract some of this logic into a separate javascript file
- 24:12create a virtual dom framework
related talks
52mAlpine js Declare and React with Simplitcy
21mYou Really Don't Need All That JavaScript, I Promise
41mYou Really Don't Need All That JavaScript I Promise
23mParty like it's 1999, write JavaScript like it's 2012
36mKeep it simple! How to apply KISS principle in modern frontend
41mLow-budget JavaScript: composable frontends that are fun and friendly
47m2017 DevFestMN Eric Brandes
38m"Design Patters for Modern JavaScript"