Інтерактив на Alpine.js для серверних сайтів

Додаю легкий інтерактив на сторінки, які рендерить ваш сервер, за допомогою Alpine.js — щоб сайт ожив без важкого фреймворку та без збірки. Якщо бекенд вже відправляє нормальний HTML, а вам потрібні вишиковані меню, вкладки, модальні вікна, акордеони, перемикачі, живі лічильники або трохи реактивного стану, то це саме та задача, ради якої Alpine й придуманий. Пишу рівно стільки JavaScript, скільки потрібно, прямо у вашій розмітці — так, щоб будь-який розробник команди потім прочитав код і одразу зрозумів, що він робить.

Мій підхід — тримати все малим та чесним: ніякого бандлера, ніякого node_modules, за яким треба присматривати, ніяких проблем з гідрацією. Підключаю один тег script, розставляю по вашим шаблонам кілька директив x-data, x-show, x-on та x-model — і інтерфейс откликається миттєво. Стан живе поруч з елементом, яким управляє, тому поведінка очевидна та легко відлагоджується. Не забуваю про доступність: навігацію з клавіатури, управління фокусом, aria-атрибути та розумну поведінку, коли скрипт завантажується повільно або вимкнений. При необхідності зв'язую компоненти з вашими ендпоїнтами: живий пошук, валідація форм, підгрузка фрагмента за потребою.

— Вишиковані меню, вкладки, модалки, акордеони, підказки
— Реактивні форми, валідація та живі лічильники
— Підгрузка фрагментів за потребою та простий живий пошук
— Доступні компоненти з управлінням з клавіатури