Fiche Descriptive Complète : Portfolio Terminal Style
🔷 INFORMATIONS GÉNÉRALES
Champ Détail
Nom du template cv_developpeur_terminal_style.html
Version 1.0.0
Date de création 16/03/2026
Auteur / Designer Refoia Jeremy Tech
Type de page Portfolio Interactif / CV Numérique
Objectif principal Présenter un profil de développeur via une esthétique « ligne de commande » (CLI) pour renforcer l’identité technique.
🎯 DESCRIPTION FONCTIONNELLE
📌 Que fait ce template ?
Ce template simule une interface de terminal UNIX immersive. Il affiche les informations professionnelles (Expériences, Compétences, Projets) comme si l’utilisateur avait exécuté une commande cat sur un fichier texte. L’interface inclut des éléments interactifs tels qu’un effet de frappe automatique (typewriter) et des barres de progression animées pour les compétences techniques.
📌 Public cible (Persona)
👤 Recruteurs Tech : En quête de profils originaux avec une forte culture « geek/dev ».
👤 Développeurs : Souhaitant un portfolio qui reflète leur environnement de travail quotidien.
⚙️ SPÉCIFICATIONS TECHNIQUES
🌐 Environnement & Compatibilité
Standard HTML : HTML5 sémantique.
Framework CSS : CSS Pur (Custom Properties & Flexbox).
Framework JS : Vanilla JS (pour l’effet typewriter).
Browsers ciblés : Chrome ✅ Firefox ✅ Safari ✅ Edge ✅.
Responsive : ✅ Oui (Adaptation des grilles et des barres de stats via Media Queries).
📦 Dépendances / Assets
Google Fonts : Fira Code (Police monospace avec ligatures).
Icônes : Emojis/Caractères spéciaux intégrés.
📥 ENTRÉES — CONTENU DYNAMIQUE
# Nom de la variable Type Obligatoire Description
1 user_name str ✅ Oui Nom affiché dans SYSTEM.INFO.
2 experience_list array ✅ Oui Liste des postes occupés (Log d’expérience).
3 skills_stats array ✅ Oui Valeurs (0-100) pour les barres de progression.
4 terminal_path str ❌ Non Chemin affiché dans le prompt (ex: ~/cv).
🧱 STRUCTURE DU FICHIER — DOM
cv_developpeur_terminal_style.html
📌
: Imports Google Fonts et styles globaux (thème sombre #0a0a0a).📌
🏗️ .terminal : Conteneur principal simulant la fenêtre.
.terminal-header : Barre de titre avec boutons (Fermer, Réduire, Agrandir).
.terminal-body :
Pre-formatted text : Bannière ASCII « DEVELOPPEUR FULL-STACK ».
.section (SYSTEM.INFO) : Grille d’infos personnelles.
.section (EXPERIENCE.LOG) : Liste chronologique des postes.
.section (SKILLS.MATRIX) : Barres de progression et tags CSS.
.typing-line : Zone d’interaction simulée avec curseur clignotant.
📌