Fantomas’side

Weblog open-source

Mise à jour 2014 du blog

On dit souvent que les cordonniers sont les plus mal chaussés, et en tant que développeur web je confirme l'adage. Ce blog est à l'abandon, depuis pas mal de temps déjà...

J'ai donc décidé pour remettre le pied à l'étrier, dans un premier temps de le rafraîchir visuellement et de mettre à jours ses composants, afin pourquoi pas le ressusciter dans un second temps.

Concernant la partie visuelle, j'ai cédé à la mode du design épuré, et ce pour plusieurs raisons.

L'idée originale étant de mettre en avant le contenu et sa lisibilité, ce genre de thème est adapté en utilisant de bonnes typographies. De plus en me limitant esthétiquement j'ai pu faire quelque chose de maintenable et maîtrisable à mon échelle et intégrer facilement un coté responsive au site qui lui faisait défaut en 2014.

Lors de cette refonte, je me suis aussi imposé des objectifs chiffrés en terme de temps, histoire de ne pas m'égarer sur des détails et d'avancer rapidement, d'où aussi la simplification esthétique. Cela permet de ne se concentrer que sur le cœur du site, c'est à dire les articles et leur contenu.

Pour réaliser et intégrer le design j'ai procédé en deux étapes, en réalisant d'abord une charte graphique qui me convenait, puis une fois le rendu satisfaisant à mon goût, j'ai commencé à l'intégrer dans mon système de templates.

En évitant de mélanger le fond et la forme, c'est à dire d'intégrer le HTML et le CSS en même temps qu'ils soient conçu, j'ai eu l'impression de gagner beaucoup de temps en évitant des errements et des allers-retours inutiles.

Concernant la partie intégration afin de gagner aussi du temps, j'ai utilisé un combo Gulp, Sass et Livereload. Dès que je modifie les fichiers Sass, ils sont automatiquement compilés en CSS et dès qu'une modification a lieu dans le CSS ou le HTML, mon navigateur va se rafraîchir automatiquement afin de me la montrer instantanément. Fini l'époque du Ctrl+F5 toutes les 15 secondes. :)

Pour la partie backend, j'ai opéré un nettoyage drastique sur les fonctionnalités inutiles ou presque du site afin d’accélérer au maximum le développement. Je suis resté sur Django en utilisant la dernière mouture de Zinnia, mon moteur personnel de blog. La principale différence par rapport à la précédente version du site, vient du fait que les commentaires sont désormais chargés de manière asynchrone en Javascript via Disqus.

Le fait de différer le chargement des commentaires, m'a permis de mettre en cache statique toutes les pages du site, afin de les servir plus rapidement, chose que je ne pouvais faire avant à cause du formulaire de commentaire et la protection CSRF.

Pour finir sur les innovations, en termes de processus, j'ai utilisé la méthode git-flow, afin de limiter chaque phases de développement dans une branche et de pouvoir déployer le code en production sur une version stable et spécifique. Les outils et le flow proposé par git-flow rendent le processus de développement et de versionning beaucoup plus facile et professionnel, peu importe au final la taille du projet.

Pour conclure cet article, je dirais que pas mal de chemin a été parcouru depuis le début de ce blog, sous Wordpress, tant sur les domaines de ses aspirations éditoriales et esthétiques que sur le domaine technique.

Lors du passage à Django, qui m'a mené au développement de Zinnia, je voulais plus de maîtrise sur le code déployé afin de faire des choses plus complexes.

Maintenant que j'ai fait pleins de choses complexes et plus ou moins utiles, je veux plus de simplicité afin de me concentrer sur l'essentiel.

Si je dois tirer une certaine fierté de cette refonte, elle viendrait du fait que j'ai réussi à transmettre cet esprit d'essentialité et de simplicité à tous les composants du site, technique ou non.