Blog Content

Structure

Each article lives in its own folder under content/blog/:

content/blog/
└── mon-article/
    ├── index.md        # Article content + frontmatter
    └── cover.png       # Cover image (PNG/JPEG → converted to WebP at build)

Frontmatter

---
title: "Titre de l'article"
description: "Description courte (~160 chars) pour SEO et previews"
tags: ["tag1", "tag2"]
date: 2025-01-15             # Format YYYY-MM-DD
cover: ./cover.webp          # Chemin relatif vers l'image de couverture
collection: nom-collection   # Optionnel — regroupe plusieurs articles liés
order: 1                     # Optionnel — ordre dans la collection (1, 2, 3…)
---

Images

• Placer les images (PNG, JPEG, WebP, SVG) dans le dossier de l'article
• Les PNG/JPEG sont automatiquement convertis en WebP au moment du build (npm run build)
• Les références cover dans le frontmatter sont mises à jour automatiquement
• Les images optimisées sont copiées dans public/blog/{slug}/
• public/blog/ est dans .gitignore — ne pas committer ce dossier

Collections

Pour regrouper plusieurs articles dans une série :

collection: vibe-coding   # même valeur pour tous les articles de la série
order: 1                  # position dans la série

Les articles d'une même collection s'affichent en navigation inter-articles sur la page article.

Preview locale

npm run dev   # Le script prebuild ne tourne pas en dev
              # Placer les WebP directement dans public/blog/{slug}/ pour tester

npm run build # Lance optimize-blog-images.js automatiquement via prebuild