Un framework de plus ?

AlpineJS pourrait être vu comme un framework de plus dans ce monde de « brutes » qu’est le JavaScript mais c’est le framework qu’il manquait. Entre jQuery qui commence à être vieillissant et les autres frameworks pour réaliser des SPA (React, VueJS, Solid ou bien encore Svelte), c’est à dire très complet mais lourds, il en fallait un qui puisse réaliser l’entre-deux et c’est bien là que AlpineJS trouve sa raison d’être

Utiliser React pour réaliser un composant de Tabulation est un peu comme sortir un char d’assault pour tuer une mouche …

Un framework léger et rapide

D’une taille légère de quelques kilo-octets, cela en fait le framework parfait pour réaliser des composants facilement comme des modales, des compteurs dynamiques, ou bien encore des volets dynamiques

jQuery est comparativement à AlpineJS un monstre en terme de poids mais beaucoup plus complet et permet de réaliser plus d’opérations

Une syntaxe simple et intuitive

Pour réaliser un menu déroulant, la syntaxe est très simple :

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

Dans ce morceau de code qui permet la réalisation d’un menu déroulant, l’élément parent porte une variable nommée open et ayant une valeur à false

Dès qu’un clic est réalisé sur le bouton, on change la valeur de la variable open à l’inverse de sa valeur précédente, de sorte à ce que si celle-ci était à false, elle passe à true, vice-versa

L’élément portant la valeur Contents … s’affichera si la valeur de la variable est à true et en cas de clic hors de l’élément portant la valeur Contents, on passe la variable open à false

Nous pourrions réaliser la même chose avec jQuery mais cela demanderait beaucoup plus d’effort

Tout un monde de composants facilement réalisables

Sans forcément devoir sortir l’artillerie lourde comme React, nous avons besoin de temps à autre de réaliser simplement des petits composants comme des Slider, des tabulations, des accordéons ou bien d’autres composants.

AlpineJS vous permet simplement de les mettre en oeuvre sans code complexe et avec une maintenance facilitée.

AlpineJS vous propose une liste de composants. Vous pouvez également trouver plein d’exemple sur internet pour réaliser toute sorte de composant