<!DOCTYPE html>
<html lang="fr" data-bs-theme="dark">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="CV en ligne de MAX . P - Étudiant BTS SIO SISR">
<meta name="keywords" content="CV, BTS SIO, Informatique, Réseaux, Cisco, Windows, Linux">
<meta name="author" content="Max Porte">
<meta property="og:title" content="CV de MAX . P - Technicien SIO SISR">
<meta property="og:description" content="Étudiant en alternance, passionné par les réseaux et systèmes.">
<meta property="og:url" content="https://maxprte.github.io/cv_html_statique/">
<meta property="og:type" content="website">
<link rel="icon" href="data:image/svg+xml,<svg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 100 100%22><text y=%22.9em%22 font-size=%2290%22>💻</text></svg>">
<title>CV en ligne - MAX . P</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet">
<link href="https://cdn.jsdelivr.net/npm/bootstrap-icons/font/bootstrap-icons.css" rel="stylesheet">
<link rel="stylesheet" href="style.css">
<script src="script.js" defer></script>
</head>
<body>
<div class="theme-toggle-container d-none d-lg-block">
<button class="theme-toggle-btn" id="theme-toggle-btn-desktop" aria-label="Changer de thème">
<i class="bi bi-sun-fill" id="theme-icon-desktop" aria-hidden="true"></i>
</button>
</div>
<div class="custom-cursor-dot"></div>
<header class="mb-5">
<h1>MAX . P</h1>
<p>Étudiant en BTS SIO SISR - Alternance</p>
</header>
<nav class="navbar navbar-expand-lg sticky-top shadow-sm mb-4">
<div class="container">
<a class="navbar-brand" href="#">
<i class="bi bi-person-badge me-2" aria-hidden="true"></i>CV MAX . P
</a>
<div class="d-flex align-items-center d-lg-none">
<button class="theme-toggle-btn me-2" id="theme-toggle-btn-mobile" aria-label="Changer de thème">
<i class="bi bi-sun-fill" id="theme-icon-mobile" aria-hidden="true"></i>
</button>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav" aria-label="Ouvrir le menu de navigation">
<span class="navbar-toggler-icon"></span>
</button>
</div>
<div class="collapse navbar-collapse" id="navbarNav">
<ul class="navbar-nav ms-auto align-items-lg-center">
<li class="nav-item"><a class="nav-link" href="#formation">Formation</a></li>
<li class="nav-item"><a class="nav-link" href="#experience">Expériences</a></li>
<li class="nav-item"><a class="nav-link" href="#competences">Compétences</a></li>
<li class="nav-item"><a class="nav-link" href="#interets">Centres d'intérêt</a></li>
<li class="nav-item"><a class="nav-link" href="#contact">Contact</a></li>
</ul>
</div>
</div>
</nav>
<main class="container">
<section id="formation">
<h2 class="section-title"><i class="bi bi-mortarboard-fill me-2" aria-hidden="true"></i>Formation</h2>
<div class="card p-4 animate-on-scroll">
<h3 class="h5 text-primary fw-bold">BTS SIO SISR</h3>
<p class="mb-1"><strong>CFAI UIMM Loire Drôme Ardèche</strong></p>
<p class="text-muted"><i class="bi bi-calendar3 me-2" aria-hidden="true"></i>2025 - en cours (alternance chez Yesss Electrique)</p>
</div>
<div class="card p-4 animate-on-scroll">
<h3 class="h5 text-primary fw-bold">Bac Professionnel Systèmes Numériques (option RISC)</h3>
<p class="mb-1"><strong>Lycée Le Marais Sainte Thérèse</strong></p>
<p class="text-muted"><i class="bi bi-calendar3 me-2" aria-hidden="true"></i>2022 - 2025</p>
<span class="badge bg-success mt-2"><i class="bi bi-trophy me-1" aria-hidden="true"></i>Mention Bien - 15.64/20</span>
</div>
</section>
<section id="experience">
<h2 class="section-title"><i class="bi bi-briefcase-fill me-2" aria-hidden="true"></i>Expériences professionnelles</h2>
<div class="accordion animate-on-scroll" id="expAccordion">
<div class="accordion-item">
<h3 class="accordion-header" id="exp1">
<button class="accordion-button" type="button" data-bs-toggle="collapse" data-bs-target="#exp1Content">
<i class="bi bi-building me-2" aria-hidden="true"></i>Alternance - Technicien Réseaux @ Yesss Electrique
</button>
</h3>
<div id="exp1Content" class="accordion-collapse collapse show" data-bs-parent="#expAccordion">
<div class="accordion-body">
<strong><i class="bi bi-calendar-check me-2" aria-hidden="true"></i>Depuis 08/2025</strong>
<p class="mt-2">Support informatique, gestion des réseaux, déploiement matériel, maintenance.</p>
</div>
</div>
</div>
<div class="accordion-item">
<h3 class="accordion-header" id="exp2">
<button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#exp2Content">
<i class="bi bi-folder me-2" aria-hidden="true"></i>Stages Professionnels (2022 - 2025)
</button>
</h3>
<div id="exp2Content" class="accordion-collapse collapse" data-bs-parent="#expAccordion">
<div class="accordion-body">
<div class="accordion" id="stagesAccordion">
<div class="accordion-item">
<h4 class="accordion-header" id="stage0">
<button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#stage0Content">
Saint-Étienne Métropole (02/2025)
</button>
</h4>
<div id="stage0Content" class="accordion-collapse collapse" data-bs-parent="#stagesAccordion">
<div class="accordion-body">
<i class="bi bi-tools me-2 text-info" aria-hidden="true"></i>Déploiement, dépannage sur site, livraison et installation de matériel.
</div>
</div>
</div>
<div class="accordion-item">
<h4 class="accordion-header" id="stage1">
<button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#stage1Content">
SDIS42 - Service Départemental d'Incendie (12/2024)
</button>
</h4>
<div id="stage1Content" class="accordion-collapse collapse" data-bs-parent="#stagesAccordion">
<div class="accordion-body">
<i class="bi bi-shield-check me-2 text-primary" aria-hidden="true"></i>Déploiement BIP pompier, mise à jour firmware firewall Fortinet.
</div>
</div>
</div>
<div class="accordion-item">
<h4 class="accordion-header" id="stage2">
<button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#stage2Content">
Abicom (04/2024 - 05/2024)
</button>
</h4>
<div id="stage2Content" class="accordion-collapse collapse" data-bs-parent="#stagesAccordion">
<div class="accordion-body">
<i class="bi bi-headset me-2 text-success" aria-hidden="true"></i>Support informatique, maintenance réseau, migration boîtes mail.
</div>
</div>
</div>
<div class="accordion-item">
<h4 class="accordion-header" id="stage3">
<button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#stage3Content">
CRS Informatique (11/2023)
</button>
</h4>
<div id="stage3Content" class="accordion-collapse collapse" data-bs-parent="#stagesAccordion">
<div class="accordion-body">
<i class="bi bi-database me-2 text-warning" aria-hidden="true"></i>Création Active Directory (Windows Server 2019), GPO, dossiers partagés.
</div>
</div>
</div>
<div class="accordion-item">
<h4 class="accordion-header" id="stage4">
<button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#stage4Content">
SPS - Sérénité Protection Service (06/2023)
</button>
</h4>
<div id="stage4Content" class="accordion-collapse collapse" data-bs-parent="#stagesAccordion">
<div class="accordion-body">
<i class="bi bi-camera-video me-2 text-danger" aria-hidden="true"></i>Câblage basse tension, installation d'alarmes et vidéo surveillance.
</div>
</div>
</div>
<div class="accordion-item">
<h4 class="accordion-header" id="stage5">
<button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#stage5Content">
NCS Informatique (02/2022)
</button>
</h4>
<div id="stage5Content" class="accordion-collapse collapse" data-bs-parent="#stagesAccordion">
<div class="accordion-body">
<i class="bi bi-pc me-2 text-secondary" aria-hidden="true"></i>Installation Windows, changement de disque dur, réparation PC/smartphone.
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<section id="competences">
<h2 class="section-title"><i class="bi bi-lightbulb-fill me-2" aria-hidden="true"></i>Compétences</h2>
<div class="row">
<div class="col-md-6 animate-on-scroll">
<div class="skill-category">
<h3 class="h4"><i class="bi bi-hdd-stack me-2" aria-hidden="true"></i>Systèmes</h3>
<span class="badge bg-primary">Linux (Ubuntu Server)</span>
<span class="badge bg-primary">Windows 10/11</span>
<span class="badge bg-info">Active Directory</span>
<span class="badge bg-info">Windows Server</span>
<span class="badge bg-secondary">GPO</span>
</div>
</div>
<div class="col-md-6 animate-on-scroll">
<div class="skill-category">
<h3 class="h4"><i class="bi bi-diagram-3 me-2" aria-hidden="true"></i>Réseaux</h3>
<span class="badge bg-success">Cisco (CCNA)</span>
<span class="badge bg-danger">Fortinet</span>
<span class="badge bg-warning text-dark">TCP/IP</span>
<span class="badge bg-success">VLAN</span>
<span class="badge bg-secondary">DHCP, DNS</span>
</div>
</div>
<div class="col-md-6 animate-on-scroll">
<div class="skill-category">
<h3 class="h4"><i class="bi bi-cloud me-2" aria-hidden="true"></i>Virtualisation</h3>
<span class="badge bg-primary">VMware</span>
<span class="badge bg-warning text-dark">Proxmox</span>
<span class="badge bg-info">Hyper-V</span>
</div>
</div>
<div class="col-md-6 animate-on-scroll">
<div class="skill-category">
<h3 class="h4"><i class="bi bi-code-slash me-2" aria-hidden="true"></i>Autres</h3>
<span class="badge bg-secondary">Scripting Bash</span>
<span class="badge bg-primary">PowerShell</span>
<span class="badge bg-secondary">HTML/CSS</span>
<span class="badge bg-dark">Git</span>
</div>
</div>
</div>
</section>
<section id="interets">
<h2 class="section-title"><i class="bi bi-joystick me-2" aria-hidden="true"></i>Centres d'intérêt</h2>
<div class="card p-4 animate-on-scroll">
<div class="row text-center">
<div class="col-md-4 mb-3">
<i class="bi bi-pc-display-horizontal fs-1 text-primary" aria-hidden="true"></i>
<h3 class="h4 mt-2">Informatique</h3>
<p class="text-muted">Veille technologique, montage PC, auto-hébergement.</p>
</div>
<div class="col-md-4 mb-3">
<i class="bi bi-controller fs-1 text-success" aria-hidden="true"></i>
<h3 class="h4 mt-2">Jeux Vidéo</h3>
<p class="text-muted">Stratégie (RTS) et jeux de gestion.</p>
</div>
<div class="col-md-4 mb-3">
<i class="bi bi-bicycle fs-1 text-danger" aria-hidden="true"></i>
<h3 class="h4 mt-2">Sport</h3>
<p class="text-muted">Cyclisme et randonnée.</p>
</div>
</div>
</div>
</section>
<section id="contact">
<h2 class="section-title"><i class="bi bi-envelope-fill me-2" aria-hidden="true"></i>Contact</h2>
<div class="card p-4 animate-on-scroll">
<div class="row justify-content-center">
<div class="col-lg-8">
<p class="text-center lead mb-4">N'hésitez pas à me laisser un message.</p>
<form action="#" method="POST">
<div class="mb-3">
<label for="name" class="form-label">Votre Nom</label>
<input type="text" class="form-control" id="name" name="name" required>
</div>
<div class="mb-3">
<label for="email" class="form-label">Votre Email</label>
<input type="email" class="form-control" id="email" name="_replyto" required>
</div>
<div class="mb-3">
<label for="message" class="form-label">Votre Message</label>
<textarea class="form-control" id="message" name="message" rows="5" required></textarea>
</div>
<div class="text-center">
<button type="submit" class="btn btn-primary btn-lg mt-3">
<i class="bi bi-send-fill me-2"></i>Envoyer
</button>
</div>
</form>
<div class="text-center mt-4">
<p class="text-muted">Ou retrouvez-moi sur :</p>
<a href="https://www.linkedin.com/in/max-porte-9639b2310/" class="btn btn-outline-primary m-1" target="_blank" rel="noopener noreferrer">
<i class="bi bi-linkedin me-2"></i>LinkedIn
</a>
<a href="https://raw.githubusercontent.com/maxprte/cv_html_statique/main/Max-PORTE-FlowCV-Resume-20251022.pdf" class="btn btn-outline-danger m-1" target="_blank">
<i class="bi bi-file-earmark-pdf me-2"></i>Télécharger CV
</a>
</div>
</div>
</div>
</div>
</section>
</main>
<footer class="mt-5">
<div class="container">
<p class="fs-5">
Fait avec <i class="bi bi-heart-fill text-danger" aria-hidden="true"></i> et <i class="bi bi-bootstrap-fill" aria-hidden="true"></i> par Max Porte.
</p>
<p class="text-white-50">© 2025 - Tous droits réservés.</p>
</div>
</footer>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"></script>
</body>
</html>
