‹ Retour au blog

La refonte de mon blog photo (et musique), de Drupal 7 à Strapi + Nuxt

8 ans. C'était il y a 8 ans que j'ai ouvert mon blog. Quelques améliorations dans l'interface ont été apportées mais la base est restée la même, Drupal 7. La version 7 étant sur la fin de vie il me fallait la mettre à jour. Les versions supérieures, toujours basées sur PHP, ne me faisaient guère envie. Mon coeur de métier étant plus tourné vers le Javascript j'ai regardé les CMS Node.js. Après une étude et quelques tests prometteurs, mon dévolu s'est jeté sur Strapi (encore en bêta à l'époque). Toute la partie base de données est gérée par le framework et facilement modifiable via l'interface, je peux donc me concentrer sur l'interface. Parfait pour moi !

Maintenant se pose la question du transfert de données, forcément il n'y a pas de migration automatique Strapi étant encore tout jeune. Ça ne me fait pas peur sachant que l'importation personnalisée impliquera d'écrire du Javascript. J'exporte donc toutes mes données de Drupal via des fichiers JSON et crée un plugin permettant de les injecter dans la nouvelle plate-forme.

Tout ne marche pas du premier coup, j'ai quand même dû mettre les mains dans la base de données pour répondre aux spécificités de mon site et apprendre à manipuler des queries Bookshelf et Knex.

Deux plugins importants pour moi n'existaient pas dans le jeune univers de Strapi. La possibilité de générer des images responsives aux petits oignons et importer des infos de services externes comme Youtube et Soundcloud pour me faciliter la vie à l'utilisation. Je les ai donc créés. Après des heures à m'arracher les cheveux pour appréhender le framework et me mettre à niveau sur React, j'ai la partie stockage de données et API qui fonctionne. C'est parti pour le front !

Là encore je me suis basé sur Nuxt. Ça marche bien et c'est facile à utiliser. Pour toujours en apprendre plus je suis passé à écrire mon code via la Composition API qui est maintenant standard dans Vue 3 (et sur lequel la prochaine version de Nuxt sera basée). Strapi ayant un point d'accès GraphQL je l'ai utilisé pour la refonte et par la même occasion appris son fonctionnement.

Depuis la version 2.13, Nuxt permet de générer statiquement un site dynamique, et ce de manière automatique. J'ai donc utilisé cette fonctionnalité pour améliorer les performances et minimiser l'empreinte carbone du blog. Cela prend environ 14 minutes pour générer plus de 9200 pages sur mon serveur.

Côté visuel pas grand chose n'a changé. J'ai gardé le même design mais en améliorant l'accessibilité et la lisibilité. Néanmoins je suis passé du CSS basique à du SCSS. J'ai aussi mis au goût du jour la manière d'écrire le code en utilisant les dernières fonctionnalités disponibles.

Pour marquer le coup la page d'accueil a complètement été refaite en mettant en valeur certains contenus. J'ai aussi personnalisé 2 plugins markdown pour correspondre à mon utilisation. Un pour afficher des images responsives dans mes articles, l'autre pour afficher des vidéos Youtube et musiques Soundcloud.

Et voilà, après 3 mois de travail, mon nouveau pas si nouveau, complètement refondu blog est sorti !

https://lilomoino.fr

Bisous