Documentation Hyva

Présentation de Alpine JS

Alpine JS

Alpine.js est une bibliothèque JavaScript légère conçue pour ajouter des fonctionnalités réactives à votre site web sans la complexité des frameworks plus lourds comme React ou Vue.js.

Comment ça fonctionne ?

Alpine.js utilise une syntaxe déclarative pour lier le HTML et le JavaScript. Vous pouvez ajouter des attributs spécifiques à vos éléments HTML pour définir leur comportement réactif. Par exemple, pour afficher ou masquer un élément en fonction d'une condition, vous pouvez utiliser l'attribut x-show :

<div x-data="{ open: false }">
  <button @click="open = !open">Toggle</button>
  <div x-show="open">Contenu visible</div>
</div>

Fini require JS ?

Avec le theme Hyva vous n'avez plus de requireJS, celà veut dire plus de data-mage-init.

Autre point important, le code JavaScript d'Alpine.js est écrit directement dans le HTML, ce qui simplifie la gestion des scripts et réduit le besoin de fichiers JavaScript séparés.