Objectif
Créer une vitrine en ligne pour présenter mes projets et partager mon expérience de développeur. Le portfolio met en avant mes réalisations techniques, tandis que le blog me permet de documenter mes apprentissages et de contribuer à la communauté.
C’est aussi ma documentation personnelle : un endroit où je peux revenir chercher des solutions à des problèmes déjà résolus.
Le Portfolio
Le portfolio présente mes projets de manière directe. Chaque réalisation dispose de sa propre page avec une description technique claire.
Le Blog
Le blog c’est l’endroit où je partage mes découvertes techniques. J’y écris des tutoriels pratiques, des retours d’expérience sur mes projets et des analyses de concepts complexes que je simplifie.
L’objectif est de rendre accessibles des notions parfois difficiles et de fournir des solutions concrètes applicables directement dans d’autres projets. Les articles supportent l’intégration de composants React interactifs grâce à MDX, ce qui me permet d’illustrer mes propos avec des démonstrations vivantes plutôt que de simples captures d’écran.
Choix techniques
J’ai choisi Astro pour sa philosophie orientée performance. Contrairement aux frameworks JavaScript traditionnels, Astro génère des pages statiques ultra-rapides et n’envoie du JavaScript que lorsque c’est vraiment nécessaire.
L’architecture repose sur un monorepo qui héberge blog et portfolio. Les composants essentiels comme le Header, le Footer ou les layouts sont centralisés dans un package partagé et réutilisés dans les deux applications. Cette approche évite la duplication de code et garantit une cohérence visuelle parfaite.
Pour le styling, j’ai choisi d’écrire du CSS pur plutôt que d’utiliser Tailwind. Je voulais un contrôle total sur l’apparence et créer une identité visuelle unique. Le contenu est écrit en MDX pour combiner la simplicité du Markdown avec la puissance des composants React.
Infrastructure & Déploiement
L’architecture de déploiement garantit stabilité et rapidité tout en permettant une itération rapide. J’ai mis en place un système multi-environnements avec trois niveaux : développement, staging et production.
La production est hébergée sur GitHub Pages pour sa fiabilité, tandis que les environnements de staging et de preview utilisent Cloudflare Pages pour sa rapidité. Chaque branche de feature génère automatiquement son propre environnement de preview, ce qui facilite les revues de code et les tests.
L’automatisation complète via GitHub Actions orchestre tout le processus : du push d’une branche qui déclenche un build et un déploiement de preview, jusqu’à la mise en production. Les builds Astro sont optimisés avec Turbo et pnpm garantit des installations reproductibles.
Ce workflow me permet de travailler sur plusieurs features en parallèle, chacune avec son environnement isolé, de valider sur staging avant de déployer en production.
Performance et SEO
Le référencement naturel a été une priorité dès la conception. Chaque page dispose de métadonnées complètes, d’un sitemap XML généré automatiquement et d’un fichier robots.txt optimisé.
La structure HTML est sémantique et accessible, avec des balises appropriées pour faciliter l’indexation. Les URLs sont propres et descriptives, et le site génère automatiquement les Open Graph tags pour un partage optimal sur les réseaux sociaux.