Hyvä How To

Alpine и Hyvä для Magento

Alpine выучивается за вечер, а собрать на нём рабочий блок магазина всё равно тяжело. Документация показывает счётчики и переключатели, а в жизни попадаются кешируемые страницы, чужие перерисовки и десяток директив в одном компоненте.

Этот справочник закрывает разрыв между «понял синтаксис» и «умею собрать» .

А это мне?

Три входа — по тому, что вы уже знаете

Пришёл с Luma Знаешь x-magento-init, observable и uiRegistry, но не знаешь, чем их заменили Бэкендер на Magento Пишешь PHP, а фронт приходится трогать. Нужно понять, а не выучить Начинаешь с нуля Alpine видишь впервые. Термины объясняются при первом появлении

Справочник

когда нужно вспомнить синтаксис

Директивы Двадцать три директивы с живыми примерами и разбором модификаторов Магические свойства Готовые значения и функции, доступные в любом выражении Теги HTML Браузерные теги с готовым поведением, работают без кода Ещё

Устройство

когда нужно понять, почему это работает так

Что такое Hyvä Сравнение с Luma и Vue, что выиграли и что потеряли Как читать код Собачка, двоеточие, точка, откуда берутся методы Подключение JavaScript Как файл попадает на страницу и в каком порядке Как элементы общаются Четыре способа связать компоненты и когда какой брать Словарь Термины каталога с короткими определениями Ещё

Практика

когда уже пишешь и не хочешь наступить на грабли

Как делать правильно Правила из практики Alpine, Hyvä и собственных шишек Отладка Приёмы для консоли, дерево компонентов, слушатель событий Расширение Инструмент разработчика для браузера и что он даёт Чего не хватает Пробелы относительно Luma и чем их закрыть Ещё

x-magento-init → x-data

Синтаксис поменялся, задачи остались те же.

Все директивы →

Alpine 3

Hyvä 1.3

Magento 2.4

Если здесь не нашлось alpinejs.dev docs.hyva.io github.com/hyva-themes developer.mozilla.org