Refonte du blog

Ceci est la 4ème itération du site Je veux toujours être ailleurs. Il avait débuté sur blogspot (http://megateufleblog.blogspot.com/) avant de migrer sur jeveuxtoujoursetreailleurs.wordpress.com.

mes commentaires de l'époque sur Wordpress

Puis il y eut jeveuxtoujoursetreailleurs2.wordpress.com lorsque le premier site fût plein (3Go de médias max avec l'offre gratuite wordpress.com, je suis un radin).

En juillet 2023, j'ai migré tout cela sur une offre ovh : jvtea.jmus.fr.

Avant de rapidement me rendre compte de la purge que représentait cette migration. Certes j'avais (approximativement) tous les contenus et les images mais plein de petits détails me gênaient.

Tous les liens étaient cassés (même les liens vers mes propres images hébergés sur mon propre site), le plus drôle était qu'en fonction de l'âge de l'article les formalismes des liens n'étaient pas toujours les mêmes : pas grave cela se corrige avec une extension Wordpress.

Puis de voir que les galleries ne fonctionnaient pas comme avant : pas grave cela se corrige avec l'extension Jetpack. Du coup, j'ai plein de services (enfin de propositions d'achats de services) inutiles qui viennent avant.

Puis de voir que je n'avais plus les images mises en avant : pas grave, cela... Non ras le bol, car je vous passe encore toutes les extensions que j'ai dû installer pour migrer le contenu, ajoutez les images à la médiathèque,..

J'avais augmenté la surface d'attaque de mes instances Wordpress (oui parce que je ne parle que de ce site, j'en ai migré d'autres en même temps) en ajoutant des extensions dont je ne comprenais pas le fonctionnement et qui voulaient se mettre à jour toutes les semaines.

Si encore, cela faisait le boulot, mais, non, je n'en étais même pas satisfait.
N'ayant aucunement envie de plonger dans le PHP et me rendant compte que WP est une usine à gaz, j'ai cherché une solution simple qui résonne mieux avec ma conception actuelle de ce que doit être Internet et l'informatique.

Je voulais un site qui :
- n'agresse pas les visiteurs avec des demandes de cookies (la plaie du monde moderne),
- ne nécessite pas des palanquées de javascript,
- ne trace pas les utilisateurs en générant des requêtes à des domaines tiers.
- nécessite le moins de ressources possibles,
- me permette de stocker son contenu de manière pérenne (des fichiers textes d'un côté, des images de l'autre) sans m'embarrasser d'une base de données qui n'a aucun intérêt pour ce type de besoin.

J'ai opté pour

Par rapport à Wordpress et la lourdeur de Gutenberg, il n'y a pas photo, cela me redonne envie d'écrire sur mon blog. Mince avec Wordpress, même un copier-coller de blocs de texte donnait des résultats aléatoires dans l'interface d'édition.

La migration est encore en cours à l'heure actuelle, le contenu (texte et photos) ont été validés, reste du travail d'optimisation sur les tags et catégories. Il me faudra aussi revoir certaines images que la compression que je leur ai appliquée a un peu malmenées. Enfin, je pourrais m'atteler à la complétion de certains articles dont le texte est pour le moins lapidaire.

Un peu de technique

Le contenu proprement dit a été converti via un script python depuis le XML exporté de wordpress en multiples fichiers Markdown. Je suis reparti pour cela de https://github.com/dreikanter/wp2md en l'adaptant pour Hugo. Puis je suis repassé, amoureusement (ie des heures de boulot), sur chaque billet pour valider le contenu migré.

J'en profite pour revoir certains contenus et éviter la fragmentation en multiples articles pour certains posts : ainsi [USA 2009]({{< ref "2009-usa">}}) est maintenant compilé en une seule page pour faciliter la lecture.

Par la même occasion, j'ai optimisé la taille des presque 5000 images du site : avec Wordpress, on ne fait pas trop attention à ce point, j'avais ainsi des numérisations brutes de plus de 30Mo (pour du N&B, la honte). Elles sont maintenant toutes retaillées pour tourner au max autour de 800Ko, la taille du site est ainsi passée de 3.5Go à 1.7Go.

J'utilise le thème

qui me va très bien, mais que j'ai modifié pour ôter toutes les dépendances externes à Cloudflare (javascript et css) et Google (polices Tranquilpeak : de cette manière aucun entité externe n'épie les visiteurs du site.

Il faut pour cela (après avoir suivi la

développeur doc modifier les fichiers :

/home/js/Documents/Projets/blog/jvtea/themes/tranquilpeak/src/scss/utils/_fonts.scss
/home/js/Documents/Projets/blog/jvtea/themes/tranquilpeak/layouts/partials/head.html
/home/js/Documents/Projets/blog/jvtea/themes/tranquilpeak/layouts/partials/script.html

ensuite faire

npm run prod

(ben oui il faut nodejs donc ça commence DEJA à se compliquer juste pour publier un site statique !)

Le site obtenu fonctionne aussi si l'utilisateur active un bloqueur de javascript, on perd juste un peu en fluidité avec la "visionneuse".

En pratique, c'est un script bash qui automatise la génération du site, l'optimisation des images, et la synchro avec le serveur :

#!/bin/bash
echo "cleaning all files in public folder"
rm -rf $(pwd)/public/*
echo "Resizing jpg and png larger than 800k"
find $(pwd)/static/imgs/ -name *.jpg -size +800k -exec mogrify -define jpeg:extent=800k  {} \;
find $(pwd)/static/imgs/ -name *.JPG -size +800k -exec mogrify -define jpeg:extent=800k  {} \;
find $(pwd)/static/imgs/ -name *.png -size +800k -exec mogrify -resize 50% -quality 70   {} \;

hugo
echo "size of generated website"
du -h --summarize  public/

echo "sync with remote server"
# caution ffs_batch contains credentials
flatpak run org.freefilesync.FreeFileSync jvtea_ovh.ffs_batch

La suite

Mes autres sites sont aussi à migrer en Hugo :
- le site "pro", tout petit est en cours avec le thème Poison qui m'a posé quelques soucis avec des bugs aléatoires
- le site "Toys Against The Machine" va nécessiter plus de travail. Je n'ai pas trouvé de template vraiment adapté à ce site qui n'est pas un blog (même s'il y en a) mais aussi tout une arborescence de pages. Le plus "simple" me semble être de me former à Hugo (je vais lire le "Hugo In Action" chez Manning, ce sera toujours bon pour la culture G) pour le développer moi-même, ce qui me forcera à faire un peu de frontend pour une fois.