📚 Documentation
Guide complet sur la construction de ce portfolio
Pourquoi ce projet ?
Ce portfolio a été créé pour avoir une vitrine professionnelle moderne et performante. C'est un moyen de présenter mes compétences, mon expérience et mes projets directement aux recruteurs et clients.
Qui l'a construit ?
Mathis AGUADO - Ingénieur DevOps Junior en alternance chez Paris je t'aime, étudiant en MSc Cloud & DevOps à l'ETNA.
Les technologies utilisées
Vue 3
Vue 3 est un framework JavaScript moderne pour créer des interfaces interactives. Vue rend le code plus organisé et facile à maintenir.
Pourquoi ? Framework léger, progressif et très populaire.
TypeScript
TypeScript ajoute des "types" à JavaScript pour éviter les erreurs.
Pourquoi ? Rend le code plus sûr et les erreurs sont détectées avant.
Vite + vite-ssg
Vite compile et optimise le code pour internet. vite-ssg va plus loin : chaque page est générée en HTML complet à l'avance (pré-rendu), pas juste dans le navigateur.
Pourquoi ? Un lien partagé sur LinkedIn ou trouvé sur Google affiche tout de suite le bon contenu, sans attendre le chargement du JavaScript.
PrimeIcons
PrimeIcons est une bibliothèque d'icônes vectorielles légère et cohérente.
Pourquoi ? Icônes prêtes à l'emploi, légères et adaptées à tous les thèmes.
CSS Scoped
CSS natif scoped : chaque composant Vue embarque ses styles isolés, sans fuite entre composants.
Pourquoi ? Pas de framework CSS à charger, contrôle total sur le design et les animations.
pnpm
pnpm est un gestionnaire de paquets ultra-rapide et économe en espace.
Pourquoi ? Plus rapide que npm, meilleure gestion des dépendances.
Tests & qualité
ESLint et Vitest vérifient le code à chaque modification. axe-core vérifie automatiquement l'accessibilité (navigation clavier, contraste, lecteurs d'écran) sur toutes les pages.
Pourquoi ? Une erreur ou un oubli d'accessibilité est détecté avant la mise en ligne, pas après.
Architecture du projet
🎯 Variables CSS principales
--color-primary: #10b981--text-dark, --text-secondary--bg-light, --bg-lighter--font-sans, --font-monoLes sections du portfolio
Header
Présentation personnelle, photo de profil, bio, liens vers réseaux sociaux
Expériences
Timeline interactif : postes, entreprises, dates, descriptions, technologies
Formations
Timeline alternée : diplômes, écoles, dates, parcours académique
Projets
Cartes interactives : logo, descriptions, technologies, détails complets
Footer
Liens de contact, documentation, téléchargement CV, réseaux sociaux
