🖥️ Portfolio BTS SIO SISR — David FROGER

Portfolio personnel d'étudiant en BTS SIO option SISR, hébergeable sur GitHub Pages.

✨ Fonctionnalités

• Design terminal / tech — Esthétique sombre inspirée des outils d'administration
• Loader animé — Séquence d'initialisation au chargement
• Sections complètes — À propos, Compétences, Projets, Veille technologique, Contact
• Terminal interactif — Bloc CLI illustrant le profil technique
• Scroll reveal — Animations au défilement
• 100% responsive — Mobile, tablette, desktop
• Easter egg Konami 🎮 — ↑↑↓↓←→←→BA

📁 Structure du projet

portfolio-bts-sio-sisr/
├── index.html              # Page principale
├── css/
│   └── style.css           # Styles (CSS variables, animations)
├── js/
│   └── main.js             # Interactions et animations
├── assets/
│   └── CV_Alex_Moreau.pdf  # CV (à ajouter)
├── projets/                # Pages de détail des projets (optionnel)
│   ├── infra-reseau.html
│   ├── active-directory.html
│   └── audit-securite.html
└── README.md

🚀 Mise en ligne sur GitHub Pages

1. Fork ou clone ce dépôt
2. Personnalise le contenu (nom, projets, liens, etc.)
3. Sur GitHub : Settings → Pages → Source: main branch / root
4. Ton portfolio sera accessible à : https://ton-username.github.io/nom-du-repo

✏️ Personnalisation

Changer les informations personnelles

Dans index.html, remplace :

• David Froger → ton prénom et nom
• david.froger@email.com → ton email
• linkedin.com/in/davidfroger → ton profil LinkedIn
• github.com/davidfroger → ton profil GitHub
• Lycée Fulbert, Chartres → ton établissement
• Tsc → ton entreprise d'alternance

Ajouter un projet

Copie un bloc <article class="project-card"> et adapte le contenu.

Modifier les couleurs

Dans css/style.css, édite les variables CSS :

:root {
  --accent: #00ff88;    /* Vert principal */
  --accent2: #00aaff;   /* Bleu secondaire */
  --accent3: #ff6b35;   /* Orange veille */
}

📋 Sections du portfolio

Section	Description
Hero	Accroche, nom, spécialité, CTA
À propos	Présentation + terminal CLI
Compétences	6 domaines : Systèmes, Réseaux, Virtualisation, Sécu, Automatisation, Monitoring
Projets	5 projets avec tags, tech stack et liens
Veille technologique	4 sujets de veille datés + sources
Contact	Email, LinkedIn, GitHub

🛠️ Technologies utilisées

• HTML5 sémantique
• CSS3 (Grid, Flexbox, Custom Properties, Animations)
• Vanilla JavaScript (IntersectionObserver, animations)
• Google Fonts : Syne + Space Mono

📄 Licence

Libre d'utilisation pour usage personnel et éducatif.

---

Fait avec ❤️ pour les étudiants BTS SIO SISR