Présentation

Lorsque je veux ajouter une touche d'interactivité à une application web, j'aime utiliser HTMX. Il permet de donner aux interactions un aspect fluide, de minimiser la quantité de JavaScript à écrire et de conserver la cohérence et la sécurité du rendu HTML côté serveur avec le package html/template de Go.

Fonctionnement d'HTMX

HTMX est une bibliothèque JavaScript qui permet d'ajouter des fonctionnalités AJAX à des éléments HTML sans avoir à écrire du code JavaScript. Elle utilise les attributs HTML pour définir les interactions, comme hx-get et hx-swap, qui permettent de spécifier l'URL à appeler et la façon de remplacer le contenu dans la page.

hx-get="/gopher" hx-swap="outerHTML"

Intégration avec Go

Pour utiliser HTMX avec Go, il faut d'abord installer la bibliothèque HTMX et la servir en tant que fichier statique. Ensuite, il faut créer des modèles HTML qui utilisent les attributs HTMX pour définir les interactions.

La structure des modèles HTML est la suivante :

  • Un dossier assets/html contenant les modèles HTML.
  • Un fichier base.tmpl contenant le code HTML de base.
  • Un dossier pages contenant les modèles de page spécifiques.
  • Un dossier partials contenant les modèles de parties réutilisables.

{{ define "base" }} ... {{ end }}

Exemple de code

Voici un exemple de code qui utilise HTMX avec Go :

func homeHandler(w http.ResponseWriter, r *http.Request) {
         render := htmlRenderer.Render(w, r, "base", "pages/home.tmpl")
         render.ExecuteTemplate(w, "base", nil)
      }