Modern Frontend With HTMX
Grokking Simplicity(par Wim Deblauwe)
Fiche de lecture
L’évolution des applications web
Au début d'internet, on avait principalement des applications web du type MVC, chaque interaction nécessitant un aller-retour client-serveur.
Est arrivée l'ère du web 2.0, les sites web sont devenus de plus en plus interactifs, via l'utilisation du JavaScript, des requêtes AJAX. jQuery devient omniprésent, apportant une bien meilleure expérience utilisateur.
Les technologies frontend ont par la suite évolué vers des frameworks complets, qui pour une large partie répliquent les fonctionnalités fournies jusque-là par le backend (routes, gestion d'état, rendu de templates). Le back, quant a lui s'est spécialisé dans la production d'API.
De cette évolution résulte un accroissement de la complexité, multiplié par le besoins d'outils spécifiques pour construire et déployer ces applications frontend. On observe aujourd'hui une séparation des compétences entre back et front, chaque domaine étant devenu hautement spécialisé. Cela amène naturellement le développeur a devoir choisir entre l'un ou l'autre, ne pouvant pas vraiment maîtriser les deux totalement.
Cette évolution se reflète au sein des organisations, où bien souvent une séparation technique est appliquée pour aboutir à deux équipes séparées. Ainsi, la production de simples fonctionnalités comme un formulaire par exemple, vont nécessiter une coordination entre les équipes back et front, le back se concentrant sur la production d'API HTTP, souvent JSON, et le front utilisant ces API.
Cette tendance à la complexité a produit un contre-mouvement, visant à redonner la capacité aux développeurs de pouvoir produire des applications modernes en minimisant la complexité induite par la séparation technique front/back.
Réduire la complexité en embrassant la notion d'hypermédia, c'est la proposition de l'auteur de HTMX, qui est exposée dans cet essai: hypermedia.systems
Introduction à HTMX
Sur la page d'accueil de htmx.org, on peut lire :
htmx gives you access to AJAX, CSS Transitions, WebSockets and Server Sent Events directly in HTML, using attributes, so you can build modern user interfaces with the simplicity and power of hypertext
La librairie HTMX en elle-même n’étant qu'une brique de cette vision, elle a été créée afin de simplifier l'utilisation de JavaScript, dans une démarche orientée hypermédia.
Son idée centrale est d’étendre le langage HTML en lui rajoutant des comportements qu'il n'a pas par défaut, mais qu'il pourrait très bien posséder, ces nouveaux comportement sont rajoutés à l'aide d'attributs dans nos pages HTML.
https://hypermedia.systems/extending-html-as-hypermedia/
Ressources
https://htmx.org/essays/#memes