Depuis quelques temps on ne cesse de voir le web évoluer. Pas mal de process ont été mis en place afin de révolutionner notre façon de faire ou de penser, tout en offrant une meilleure expérience utilisateur pour le développeur, de meilleures performances, des projets scalables et à moindre coût. De ce fait, ces derniers temps on entend parler beaucoup de la Jamstack. Je suis quasiment sur que avez déjà entendu parler de ce terme, sans pour autant en comprendre le sens ou même l’utilité de cette architecture dans les projets. Je vous propose donc dans cet article de découvrir ce qu’est la Jamstack, son utilité ainsi que les ressources nécessaires.

Introduction

Selon jamstack.org, la Jamstack (JavaScript,  API,  Markup) est une architecture de développement web moderne. Ce n’est en aucun cas un langage de programmation ou toute forme d’outil. Il s’agit plutôt d’une pratique de développement visant à obtenir de meilleures performances, une meilleure sécurité, une meilleure expérience de développement et une réduction des coûts de scalabilté. Cette architecture est basée sur du JavaScript côté client, des APIs réutilisables et un balisage (Markup) pré-construit.

Quand on parle de Jamstack on fait souvent référence aussi à du statique. La Jamstack permet de mettre en place des sites web statiques sans base de données. Contrairement aux sites web dynamiques, l’ensemble des pages servies et quelque soit l’utilisateur sont des pages HTML générées faciles à mettre en cache. Ces pages statiques sont souvent distribuées par ce qu’on appel un CDN ou réseau de diffusion de contenu (Content Delivery Network).

Utiliser un CDN est une excellente façon d’augmenter la vitesse de son site et de réduire l’utilisation des ressources. Il permet aussi d’assurer un déploiement rapide de note contenu statique (images, CSS, JavaScript, vidéos…) en le livrant à partir de l’emplacement le plus proche de l’internaute, améliorant ainsi considérablement le temps de réponse du serveur.

Les principales composantes de la Jamstack

JavaScript

Les fonctionnalités dynamiques sont gérées en JavaScript. Cela peut être n’importe quel framework front, une bibliothèque ou même du JavaScript natif.

API

Toutes les actions de base de données côté serveur sont abstraites dans des API réutilisables, accessibles en HTTPS avec du JavaScript. Elles peuvent être personnalisées ou faisant appel à des services tiers.

Markup

Les templates HTML doivent être préconçus au moment du déploiement, généralement à l’aide d’un générateur de site statique ou d’un outil le permettant. Ces fichiers peuvent être générés à partir de fichiers source, comme du Markdown.

Quels sont les avantages de la Jamstack ?

La Jamstack représente de nombreux avantages. Toutes les pages statiques sont générées au moment du build (déploiement) et pas rechargées, ce qui procure une vitesse de chargement exceptionnelle. Contrairement aux sites web dynamiques qui dépendent fortement d’un serveur et d’une base de données, la Jamstack charge tout simplement du code qui reçoit des données à partir d’une API, JSON, Markdown, CMS… Le contenu HTML est servi via un CDN à l’aide d’un générateur de site statique pendant le déploiement.

En n’ayant que des fichiers statiques, il y a peu chance pour que notre site web se fasse attaquer. En effet il n’y a aucune faille à exploiter puisqu’il n’y a pas de traitement côté serveur.

Certes, la Jamstack fournit du contenu statique et réduit les risques de sécurité, mais il y autre chose à considérer en termes de sécurité, les appels fait vers des API externes. Il est nécessaire de s’assurer que chaque échange est sécurisé via HTTPS.

  • Jamstack c’est rapide et performant
  • Jamstack c’est sécurisé
  • Jamstack c’est un scaling à la volée et à moindre cout
  • Jamstack c’est une meilleure expérience développeur
jamstack schema

Les limitations de la Jamstack

Courbe d’apprentissage: les développeurs doivent disposer de solides bases sur cette architecture ainsi que les différents outils modernes en constante évolution qu’il y a autour.

Certaines fonctionnalités dépendent de solutions tierces: toute fonctionnalité dynamique peut nécessiter des solutions côté client, ce qui peut être difficile pour l’intégration, le développement et la maintenance. Par conséquent, les solutions tierces peuvent poser des problèmes de sécurité, créer des limitations techniques, engendrer des coûts non souhaités et affecter la stabilité du site en cas de panne du service externe.

Liens utiles

Avant de partir…
Merci pour votre lecture ! 😊