Création d’un site éditorial avec Vue et Markdown

Ce projet présente l’architecture du site personnel de Nicolas Ambroise : une application Vue 3 avec des pages pré-générées pour un déploiement statique et des contenus éditoriaux stockés en Markdown.

Choix techniques

  • Vue 3 structure les pages et les composants partagés.
  • Vite assure le développement local et la compilation.
  • Vue Router gère les pages et les URL françaises et anglaises.
  • Markdown contient le texte des articles et des fiches de projets, séparé de leurs métadonnées JSON.
  • Vite SSG pré-génère les pages lors de la compilation. Le site peut ainsi être servi comme fichiers statiques, sans serveur applicatif.

Le rendu statique convient à un rythme éditorial d’environ dix publications par an : une nouvelle publication nécessite une compilation et un redéploiement, sans génération dynamique à chaque visite.

Organisation éditoriale

Les métadonnées des articles et projets sont regroupées dans src/pages/articles.json et src/pages/projects.json. Les textes sont conservés dans src/pages/articles/ et src/pages/projects/.

Les catégories éditoriales sont centralisées dans src/data/article-categories.json. La liste des articles permet de rechercher dans les titres et résumés, puis de filtrer par catégorie. Les articles sans traduction anglaise restent affichés en français et sont signalés comme tels.

Compilation et publication

En développement, npm run dev démarre le serveur local. npm run build vérifie les types et les données éditoriales, puis génère les fichiers statiques dans dist/.

La compilation seule ne constitue pas une évaluation de conformité en accessibilité. Les pages et composants doivent aussi être vérifiés manuellement, au clavier et avec des technologies d’assistance.