J’ai déjà travaillé avec Wordpress et je sais que mes clients voudront des solutions Wordpress et il eu été intéressant de pratiquer.
Mais il y a quelque chose qui ne me plaît pas trop, c’est le WSYIWYG qui n’est pas excellent, en tout cas j’en gardais un mauvaise souvenir.
Je regardais du côté d’Eleventy notamment le tutoriel d'1h20 de Kevin Powell sur YouTube .
J’aimais l’idée d’un site statique mais performant et je voulais notamment pouvoir faire des pages de blog standards et des pages complètement personnalisées au niveau du CSS.
Je souhaitais également faire tourner un script JavaScript sur une page et pas une autre.
C’est mon ami et ancien collègue Laurent Desgrange qui m’a parlé de Hugo qu’il utilise pour son blog minimaliste focalisé contenu.
J’ai trouvé un thème qui me plaisait basé sur Tailwind avec de nombreuses fonctionnalités : personalisation des menus, internationalisation i18n, dark mode, tags, catégories, SEO, opengraph, possibilité de mettre des commentaires aux posts.
J’aime surtout la possibilité de diviser le site en plusieurs sections de blog, projets, articles et expérimentations.
Donc Hugo, gère des fichiers markdown avec des meta-informations appellées “front matter”.
Ces fichiers markdown peuvent contenir du HTML, et peuvent aussi appeler un layout spécifique en HTML, avec du code Hugo.
Et donc ces fichiers sont compilés en HTML par Hugo, et ce sont les fichiers statiques compilés qui sont poussés en production.
Il n’y a pas de back-end, pas de base de données.
Dans mon cas, mon site est mis en production sur mon VPS par le biais de GitHub Actions.
Je pousse mes modifications sur GitHub et GitHub Actions déclenche le build et la publication automatiquement.
Alors, j’ai un peu étendu le thème Tailwind, j’ai enlevé l’optimisation des images qui était moche et rendait statiques les GIF.
J’ai également rajouté le fallback des articles en français sur les pages en anglais quand la traduction n’est pas disponible.
J’ai également rendu conditionnel l’affichage de la “table des matières” dans les posts si la table est vide.
Et j’ai créé la rubrique “Actualités Récentes” sur la page d’accueil affichée de manière “dynamique”, j’entends qu’il s’agit également de fichiers markdown compilés par Hugo.
Et ce en vibe-codant depuis PHPStorm.
L’IA traduit également les tags en anglais.
J’ai facilement pu créer une page d’accueil et une page “A propos”.
C’est extrêmement modulaire et personnalisable.
Le but à l’origine était de faire un portfolio rapidement, mais ça c’est transformé en ma vitrine d’entreprise par la force des choses.
En tout cas, c’est l’outil idéal pour m’exprimer librement et présenter mon travail passé et à venir.
Je peux traiter mes projets comme des études de cas ou des avant-après et montrer des interfaces qui ne sont plus en ligne.
Est-ce que c’est un site qui transforme les prospects ? L’avenir le dira.
Quand j’aurai le retour de l’expérience, je pourrai “factoriser” les résultats en un site “fait main”.
En attendant, je m’exprime et je crée.
