Paul FEVRE

Qu'est-ce que la JAMstack ?

La JAMstack pour Javascript/Api/Markup est une méthode de génération de site statique. L'ensemble des pages du site est construit au déploiement de celui-ci et il n'y a donc plus besoin de serveur dynamique pour l'héberger. Cette stack permet de générer un site très simple, mais permet aussi de faire des sites bien plus complexes.

Vous imaginez aller au resto et attendre pour commander que le serveur écrive la carte à chaque fois devant vous avant de vous la donner ? C'est ce qu'il se passe sur votre site quand vous n'utilisez pas la JAMstack...

Un peu d'histoire

Le concept a été posé par Mathias Biilmann (le PDG de Netlify) en 2015 et son entreprise est d'ailleurs une solution idéale pour héberger vos sites JAMstack. On retrouve maintenant la possibilité de générer statiquement un site dans la plupart des framework frontend JavaScript, un petit npm run generate avec Nuxt par exemple.

Avantages

Vous générez vos pages lors du déploiement, le site en production est statique :

  • Pas de BDD, pas de serveur dynamique, vous n'hébergez que des fichiers statiques (HTML/CSS/IMG) ;
  • De fait, les performances sont inégalées ;
  • Niveau sécurité, il n'y a rien à attaquer, on est donc encore au maximum ;
  • Aucun soucis de scalabilité, votre site supportera n'importe quelle charge ;
  • Vous pouvez aussi l'impliquer dans votre démarche RSE, grâce aux autres points ;
  • Pour tout ça, des frais d'hébergement et maintenance bien moindre que le classique serveur/base de donnée ou que des micro-services.

Inconvénients

Mais bien sûr, il y a quelques contraintes :

  • La JAMstack ne peut pas servir à la création d'application métier ;
  • Ajouter du dynamisme à votre site est possible, mais moins trivial qu'avec un site classique ;
  • Le moindre appel API en production et la résilience de votre site en dépendra. Mais si tout es bien fait, cela peut ne toucher qu'un unique composant, et surtout, cela sera forcément moindre que de faire tomber l'entièreté du site.

Outils & Prestataires

Générateurs de site statique

De très nombreux outils permettent maintenant de générer statiquement votre site, vous en trouverez une liste ici, parmis eux citons :

  • Next.js, le plus populaire sur GitHub, sur base de React ;
  • Hugo, l'historique, celui par lequel beaucoup de choses ont commencées ;
  • Nuxt, basé sur Vue.js que je recommande ;
  • Eleventy (11ty), mon chouchou, tellement simple, rapide et puissant, mais basé sur aucune techno "à la mode" et donc bien moins répandu.

Gestionnaires de contenu

Mais pour générer un site, il faut bien des données en entrée ? Ici deux camps se distinguent :

  • Les CMS API-driven, le classique WordPress en headless et tout les petits nouveau développés spécifiquement pour ça ;
  • Le CMS "Git-based", là c'est la folie car pas besoin de serveur non plus pour l'administration... Au lieu d'enregistrer des données en BDD on fait des commit directement dans notre gestionnaire Git favori via son API, ça mérite bien un petit article à venir ça.

Vous trouverez donc une nouvelle liste ici et mes propositions :

  • Decap CMS (anciennement Netlify CMS), que je recommande, par les créateurs de Netlify ;
  • Strapi, le plus populaire sur GitHub ;
  • Directus, celui que j'utilisais avant de découvrir les Git-based et Netlify CMS.

Hébergeurs

Pour héberger votre site, votre prestataire habituel a forcément une offre d'hébergement de fichiers statiques, cherchez une offre "bucket like" comme Amazon S3, et je citerai :

  • Netlify, l'origine de tout ça, un premier déploiement en quelques minutes et plus encore ;
  • Clever Cloud, si vous voulez que tout reste en France, la société est basée sur Lyon et votre site ne se retrouvera pas à l'autre bout du monde.

Et si vous voulez partir sur un CMS API-driven :

Conclusion

La JAMstack mérite de se retrouver partout sur le web, énormément de cas d'usage s'y prêtent. Pour certains, cela est évident, pour d'autres, il faut mettre en place des spécificités, mais dans tous les cas, on y gagne en résilience !

Imaginez un site de vente en ligne JAMstack et une API attaquée et tombée... Avec un site dynamique, tout le site serait hors ligne, en JAMstack, il resterait tout de même le catalogue produit. Et dans tous les cas, l'API est bien moins sollicitée, car pour afficher la page d'un produit, il n'y a qu'à demander à l'API si le produit est en stock vu que tout le reste est déjà généré.

Bref, vive la JAMstack ! Et n'hésitez pas à me contacter si vous voulez que je vous aide à l'implémenter.