Pourquoi un blog ?

C’est le tout premier article du blog, alors avant de rentrer dans le vif du sujet, une petite mise en contexte s’impose.

Je suis admin systèmes & réseaux, passionné d’IT et en pleine phase d’apprentissage (Linux, DevOps, automatisation…). Comme beaucoup, j’avance en autodidacte, j’expérimente sur mon homelab, je prends des notes, et je me bats parfois avec mes configs.

Ce blog, c’est à la fois un carnet de bord et un défi personnel. Il me sert à centraliser mes découvertes, garder une trace de mon parcours… mais aussi à me forcer à expérimenter et apprendre. Publier ici m’oblige à tester, documenter, clarifier mes idées — au lieu de laisser mes notes traîner dans un coin.

Si ça peut inspirer ou aider d’autres au passage, alors feu ! Mais avant tout, c’est un moyen de progresser et de rester motivé. 😁

Comment ?

J’ai déjà un WordPress pour mon CV, et même si je trouve ça pratique, ça reste lourd à configurer/maintenir et vulnérable. Dans mon cas, j’ai dû louer un VPS pour l’héberger - j’aurais pu utiliser mon Homelab mais mon infra n’est pas encore prête pour ça.

Je me suis donc tourné vers les sites statiques dont je ne connaissais pas l’existence avant d’avoir fait mon CV… sinon je serais sûrement passé par là pour ce dernier ! 😅

C’est quoi un site statique ?

Un site statique est un site web composé de fichiers HTML, CSS et JavaScript pré-générés qui ne changent pas en temps réel. Contrairement aux sites dynamiques qui génèrent les pages à la demande via une base de données, les sites statiques servent directement des fichiers déjà créés.

Avantages principaux : chargement ultra-rapide, sécurité renforcée (pas de base de données à pirater), hébergement simple et souvent gratuit, et excellent référencement SEO.

Cas d’usage typiques : blogs, sites vitrines, documentation, portfolios, landing pages - tout contenu qui n’a pas besoin d’être mis à jour en permanence.

Pourquoi les sites statiques ?

Du coup, vous l’aurez compris : pas besoin de se préoccuper de la sécurité, hébergement gratuit sur Netlify, rapidité, fluidité, versionning du site via le repo GitHub, facilité de publication… bref tout un tas de points positifs !

Puis ça me permet également d’en apprendre plus sur le sujet et de mettre les mains dedans :)

Bon par contre, je ne m’attendais pas à devoir faire autant de dev… mais je vous explique ça après…

Quel générateur de site statique (SSG) choisir ?

SSG = Static Site Generator

Là, j’ai dû demander un petit coup de main à l’IA pour m’expliquer rapidement les différences et ce que ça impliquait.

Voici donc un comparatif simple fait par Claude 🤭 entre les plus connus :

Critère	Hugo	Next.js	Astro	Jekyll
Langage	Go (templates)	JavaScript/React	JavaScript	Ruby (Liquid)
Facilité d’usage	⭐⭐⭐⭐⭐	⭐⭐⭐	⭐⭐⭐⭐	⭐⭐⭐⭐
Vitesse de build	⭐⭐⭐⭐⭐	⭐⭐⭐	⭐⭐⭐⭐	⭐⭐
Performance finale	⭐⭐⭐⭐⭐	⭐⭐⭐⭐⭐	⭐⭐⭐⭐⭐	⭐⭐⭐⭐
SEO	⭐⭐⭐⭐	⭐⭐⭐⭐⭐	⭐⭐⭐⭐⭐	⭐⭐⭐⭐
Thèmes disponibles	⭐⭐⭐⭐⭐	⭐⭐⭐	⭐⭐⭐	⭐⭐⭐⭐
Communauté	⭐⭐⭐⭐	⭐⭐⭐⭐⭐	⭐⭐⭐	⭐⭐⭐⭐
Courbe d’apprentissage	Facile	Difficile	Moyenne	Facile
Hébergement gratuit	Excellent	Excellent	Excellent	GitHub Pages natif

Hugo domine pour la rapidité et la simplicité : builds ultra-rapides, installation en 5 minutes et plus de 400 thèmes disponibles. Idéal pour débuter un blog IT sans prise de tête.

Next.js brille par sa flexibilité et son écosystème React massif. Parfait si vous maîtrisez JavaScript et voulez un blog évolutif vers une app plus complexe, mais plus difficile à prendre en main.

Astro représente la modernité avec son approche “zero JavaScript” par défaut et son excellent support MDX. Le meilleur compromis performance/fonctionnalités modernes, mais communauté plus restreinte.

Jekyll reste le choix sûr pour GitHub avec son intégration native GitHub Pages. Stable et éprouvé, mais builds lents et technologie moins moderne.

Pour moi, AstroJS était le meilleur choix : j’aime la modernité et il était bien reconnu pour ses performances et son équilibre donc je suis parti là-dessus sans vraiment savoir à quoi m’attendre.

Le thème

Il me fallait donc d’abord un thème pour lancer mon projet. J’ai pas mal parcouru la galerie de thèmes d’Astro et je suis enfin tombé sur celui qui me plaisait le plus pour ce que je voulais faire : Astro Citrus (Merci beaucoup à l’auteur !) Maaaais, quoi que je choisisse, je savais que je devrais mettre les mains dans le cambouis et customiser le thème. je ne voulais pas me contenter du simple template de base…

C’est là que j’ai réalisé qu’il fallait que je comprenne un peu le métier de dev : structure des fichiers, langages utilisés, intérêt des différents modules… Au final, ça m’a pris énormément d’heures pour emmagasiner tout ça et beaucoup de prompts sur ChatGPT ! J’ai ensuite découvert Claude Code qui m’a vraiment aidé à remanier le site comme je le voulais - ça a pas mal accéléré le processus. (Je ferais probablement un article concernant ce switch d’IA.)

J’ai pu améliorer plusieurs aspects et surtout obtenir un site plus personnalisé, à mon image :

Les couleurs
Une page CheatSheets dédiée
Un affichage mobile propre et adapté
Du CSS moderne et fluide

Ça y est, j’ai un site propre, tout fonctionne… en local du moins !

Déploiement et workflow

Maintenant, il fallait gérer le déploiement et la mise en production. Je savais déjà que j’allais utiliser Netlify mais je ne m’étais jamais vraiment aventuré dessus encore. Bon, finalement, ce n’est pas très compliqué : il suffit de link le repo Git, associer le bon nom de domaine et la plateforme s’occupe ensuite de build et publier.

Après quelques bugs/erreurs de build, mon site est enfin en ligne ! Pas peu fier 😁 Pour ce qui est du workflow final :

Je rédige un article ou un cheatsheet en Markdown
git push sur le repo
Netlify build et déploie automatiquement en s’appuyant sur le dernier commit
Et voilà ! ✨

Simple, efficace, et ça me permet de me concentrer sur le contenu plutôt que sur toute la maintenance qu’exige un VPS par exemple.

Et maintenant ?

Y’a plus qu’à ! Apprendre, rédiger, publier et partager !

Au programme : Du Windows, du support classique, du Linux, de l’automatisation, de la veille…

👉 Si vous voulez suivre les nouveautés, le flux RSS est par ici : syspirit.fr/rss.xml

Merci d’avoir lu et à bientôt si vous voulez continuer de suivre mes aventures ! 🚀

Recherche