Skip to content
Extraits de code Groupes Projets

[ADD] outil blog

1 file
+ 27
16
Comparer les modifications
  • Côte à côte
  • En ligne
+ 27
16
---
title: "Outil de blog"
author: Théo
date: 2021-11-08T09:00:00+01:00
date: 2021-12-23T09:00:00+01:00
categories:
- Outils
tags:
@@ -10,29 +10,28 @@ draft: true
mastodon_id: ""
---
Le choix d'un outil est crucial, quel qu'en soit l'usage. Il impacte le présent et surtout le futur. Il s'agit donc de déterminer des critères permettant de comparer les différentes solutions afin de sélectionner celle qui est la plus adaptée.
Le choix d'un outil est crucial, quel qu'en soit l'usage. Il impacte le présent et surtout le futur. Il s'agit donc de déterminer les besoins puis d'analyser et comparer les différentes solutions afin de sélectionner celle qui est la plus adaptée. Il faut également penser à la maintenance et aux possibles évolutions.
C'est cette réflexion qui a été menée pour choisir l'outil permettant la réalisation de ce blog.
Les critères
Les besoins
------------
Premièrement, il a fallu exposer l'objectif principal. L'idée retenue était d'avoir un site statique pour publier des articles dont l'écriture serait simple.
Nous souhaitions également avoir un rendu léger, totalement personnalisable et avec la possibilité d'ajouter des fonctionnalités telles que les commentaires. La capacité d'évolution de l'outil était essentielle afin de ne pas être limité à postériori.
Nous souhaitions avoir un blog à l'image du Filament en privilégiant l'expérience utilisateur et une démarche d'éco-conception. Il devait donc être simple, léger et facile à lire. Il devait également respecter la vie privée et les choix des lecteurs. Un espace de commentaire permettrait de s'exprimer sur chaque article. Aussi, un flux RSS et Atom avertirait de la publication de nouveau contenu.
De notre côte, nous voulions rédiger les articles de manière simple, avec seulement un éditeur de texte. Étant donné qu'il s'agit d'un blog d'entreprise, le contenu devait pourvoir être revu et approuvé par les salariés. Enfin, pour réduire les actions à effectuer, le système devait être automatisable au maximum.
Les solutions
-------------
### Écriture
Partant de cela, nous avons choisi le langage de balisage _Markdown_ pour sa simplicité et sa popularité. Il est en effet largement usité par de nombreux sites et applications ce qui assure une utilisation pérenne.
Partant de cela, nous avons choisi le langage de balisage _Markdown_ pour sa simplicité et sa popularité. De plus, nous l'utilisons déjà notamment pour nos contributions Git. Il est en effet largement usité par de nombreux sites et applications ce qui assure une utilisation pérenne.
### Générateur de pages statiques
Plusieurs outils surpportant le _Markdown_ ont été comparés. Il s'agissait de :
Un site statique permet de réaliser les besoins de simplicité et d'éco-conception. Ainsi plusieurs outils supportant le _Markdown_ ont été comparés. Il s'agissait de :
- _Bridgetown_ (Ruby)
- _Jekyll_ (Ruby)
@@ -44,26 +43,38 @@ Plusieurs outils surpportant le _Markdown_ ont été comparés. Il s'agissait de
Permettant tous de convenablement générer un site statique à partir de fichiers écrits en _Markdown_ et préférant grandement les programmes compilés, _blades_ et _Hugo_ ont été sélectionnés et davantage étudiés.
Bien que Rust sois, à mon avis (Théo), le meilleur langage de programmation de part sa sécurité, ses performances et ses concepts, _blades_ n'a pas été retenu car il s'agit d'un projet très jeune et assez simple. _Hugo_, en revanche, est un outil répandu avec une large communauté et de nombreuse ressources existantes. Il est de plus performant et permet la création de modèles de page complexes. Son évolutibilité est indéniable. C'est ainsi qu'_Hugo_ a été choisi comme générateur de pages statiques pour le blog.
Bien que Rust sois, à mon avis (Théo), le meilleur langage de programmation de part sa sécurité, ses performances et ses concepts, _blades_ n'a pas été retenu car il s'agit d'un projet très jeune et assez simple. Cette simplicité rend l'outil peu personnalisable évolutif à l'heure actuelle. _Hugo_, en revanche, est un outil répandu avec une large communauté et de nombreuse ressources existantes. Il est de plus performant et permet la création de modèles de page complexes. Sa capacité à évoluer est indéniable. C'est ainsi qu'_Hugo_ a été choisi comme générateur de pages statiques pour le blog.
Mise en place
-------------
### Rédaction et automatisation
### Rédaction
La dernière étape consistait à automatiser le processus de rédaction, de relecture et de publication. Nous avons donc mis en place un dépôt _Git_ chaque nouvel article prend la forme d'une demande de fusion qui est alors vérifiée et commentée par les membres du _Filament_. Une fois celle-ci validée, le site est généré par une tâche d'intégration continue. L'article est ainsi publié.
Le processus de rédaction, de relecture et de publication est géré par notre instance _GitLab_ où, dans un [dépôt _Git_](https://sources.le-filament.com/lefilament/blog-src), chaque nouvel article prend la forme d'une demande de fusion qui est alors vérifiée et commentée par les membres du _Filament_. Une fois celle-ci validée, le site est généré par une [tâche d'intégration continue](https://sources.le-filament.com/lefilament/blog-src/-/blob/master/.gitlab-ci.yml).
### Hébergement
La personnalisation
-------------------
Notre hébergeur est le Plesk d'Ikoula qui récupère automatiquement les modifications du dépôt _Git_ et sert uniquement le dossier `public`. Le site et ses articles est alors publié.
### Le thème
L'apparence [du site du Filament](https://le-filament.com/) a été adaptée au format du blog et un thème sombre l'a enrichie. Ce dernier est sélectionné selon les préférences des visiteurs. Une attention particulière est portée sur l'absence de JavaScript.
L'apparence [du site du Filament](https://le-filament.com/) a été adaptée au format du blog et un thème sombre l'a enrichie. Ce dernier est sélectionné selon le thème du système d'exploitation ou du navigateur des visiteurs. Une attention particulière est portée sur l'absence de JavaScript pour des raisons d'éco-conception. En effet, cela diminue la quantité de données téléchargée pour afficher une page tout en réduisant les ressources utilisées par les navigateurs.
### Les commentaires
Afin de permettre les échanges, un espace de discussion est proposé à la fin des articles. Il s'agit en réalité des réponses au « pouet » _Mastodon_ annonçant la publication de l'article. Les commentaires ne sont pas affichés automatiquement dans l'objectif d'alléger les pages et un code JavaScript minimal permet de les monter lors de l'appui sur le bouton dédié. Il est également possible de laisser un commentaire via un second bouton. Un compte _Mastodon_ est cependant nécessaire.
Le blog étant statique, il n'est pas possible d'utiliser une base de données pour stocker les commentaires. Un service externe est donc nécessaire. Une solution souvent employée est de recourir à un tiers tel que Disqus. Il est également possible de copier le contenu des courriels envoyés à une adresse dédiée ce qui représente du travail supplémentaire. Nous avons donc opté pour Mastodon qui est libre et permet à la fois de promouvoir un article et de le commenter.
Afin de permettre les échanges, un espace de discussion est proposé à la fin des articles. Il s'agit en réalité des réponses au « pouet » _Mastodon_ annonçant la publication de l'article. Les commentaires ne sont pas affichés automatiquement dans l'objectif d'alléger les pages et un [code JavaScript minimal](https://sources.le-filament.com/lefilament/blog-src/-/blob/master/themes/le_filament/assets/js/mastodon_comments.js) spécialement développé permet de les monter lors de l'appui sur le bouton dédié. Il est également possible de laisser un commentaire via un second bouton. Un compte _Mastodon_ est cependant nécessaire.
Conclusion
----------
L'idée de créer blog pour _Le Filament_ existait depuis longtemps, c'est maintenant chose faite. Le choix d'_Hugo_ comme générateur de pages statiques et l'automatisation des publications rend facile et agréable l'écriture de nouvels articles. L'outil octroit d'importantes capacités d'adaptation et d'évolution permettant d'accompagner les usages futurs.
L'idée de créer blog pour _Le Filament_ existait depuis longtemps, c'est maintenant chose faite. Le choix d'_Hugo_ comme générateur de pages statiques et l'automatisation des publications rend facile et agréable l'écriture de nouveaux articles. Il correspond aussi aux valeurs portées par l'entreprise dont la simplicité et l'éco-conception.L'outil octroie d'importantes capacités d'adaptation et d'évolution permettant d'accompagner les usages futurs.
Il reste cependant des choses à faire comme :
- automatiser la création de l'espace commentaires (poster un toot Mastodon) ;
- créer une page expliquant comment d'abonner aux flux RSS et Atom.
Chargement en cours