Mon Portfolio

Pourquoi ce portfolio ?

Ce site est ma vitrine technique et design : il prouve ma maîtrise de Next.js, React, Tailwind CSS et Framer Motion, du développement au déploiement sur Vercel.

Choix technologiques

Next.js

• Hybrid SSR + SSG pour performances & SEO
• App Router (Next 13+) : structure dossier → page.tsx
• Optimisations automatiques (préchargement, code splitting)

Tailwind CSS

• Classes utilitaires pour de la rapidité et de la cohérence
• Thème et breakpoints définis dans tailwind.config.js
• JIT pour ne générer que le CSS nécessaire

Architecture

app/
├─ page.tsx
├─ about/
│  └─ page.tsx
├─ projects/
│  ├─ page.tsx
│  └─ portfolio/
│     └─ page.tsx
├─ contact/
│  └─ page.tsx
└─ layout.tsx

Le fichier layout.tsx enveloppe chaque page avec la navbar (Accueil, Projets, À propos, Contact) et le footer.

UX & design

• Design responsive (mobile → desktop) avec breakpoints Tailwind
• Palette sobre : fond clair, typographie sombre
• Composants réutilisables (ProjectCard, Header, Footer)

Fonctionnalités clés

• Page Projets : grille de ProjectCard cliquables avec image, titre, résumé et bouton “Voir le projet”
• Fiche projet : hero, description détaillée, stack, liens live/GitHub
• Page À propos : présentation, photo, CV téléchargeable
• Page Contact : mailto, LinkedIn, GitHub

Performances & SEO

• Lighthouse > 90 sur Perf, Accessibilité & SEO
• Images optimisées via Next.js
• Métadonnées dynamiques via l’export metadata