Mon portfolio

Mon portfolio

2025
ReactJS
Freelance

Derrière son apparence de portfolio créatif, ce site est avant tout une vitrine technique avancée, pensée pour démontrer la maîtrise de Next.js, du SSR et des problématiques modernes de développement web. Le projet a été conçu pour offrir une expérience utilisateur fluide, rapide et accessible, tout en intégrant des fonctionnalités complexes comme la génération dynamique de routes, la gestion de modales parallèles et l’optimisation SEO.

L’un des enjeux majeurs était de migrer un portfolio React existant vers l’architecture Next.js App Router, en exploitant au maximum les Server Components, le streaming, et la revalidation ISR. J’ai entièrement repensé la structure pour garantir un rendu côté serveur performant, une navigation intelligente (modale ou standalone), et une gestion optimale des données issues d’APIs externes.

La gestion des contenus (projets, articles) repose sur des appels API natifs, avec un système de cache et de revalidation pour assurer à la fois fraîcheur et rapidité. Les routes dynamiques sont générées à la volée, avec préchargement des données et fallback gracieux. Un soin particulier a été apporté à l’accessibilité, au comportement du back/forward navigateur, et à l’expérience mobile.

J’ai également intégré des effets visuels avancés (glitch, blur conditionnel, glassmorphism), tout en veillant à la performance (lazy loading des images, code splitting, optimisation des Core Web Vitals). Le SEO a été travaillé en profondeur : métadonnées dynamiques, Open Graph, canonical, structured data, et sitemap généré automatiquement.

Enjeux & défis :

  • Migration complexe d’un projet React vers Next.js App Router (SSR, Server Components, ISR)
  • Gestion de routes parallèles et modales avec navigation intelligente
    • Optimisation du chargement et du cache des données API externes

    • Accessibilité et UX sur tous les devices

    • SEO avancé dans un contexte de contenu dynamique


    Ce projet m’a permis de pousser l’écosystème Next.js dans ses retranchements, en combinant rigueur technique, performance, et expérience utilisateur moderne. Il illustre comment un portfolio peut devenir un véritable terrain d’expérimentation et de démonstration de savoir-faire fullstack.



Voir le projet

Performance

performance99%
accessibility91%
Best Practices100%
seo100%

Technologies

Next.js 14App RouterServer ComponentsISR / RevalidationAPI External DataDynamic RoutingParallel RoutesModal SSRSEOOpen GraphStructured DataSitemapLazy LoadingTypeScriptTailwindCSSGlassmorphismEffet GlitchBlur ConditionnelPerformanceCore Web VitalsAccessibilitéUX/UIDéploiement Vercel