Outiref

Code source de l'URL : http://trbarry.github.io/page_cv/

<!doctype html>
<html lang="fr">
<head>
  <meta charset="utf-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1" />
  <title>T****n B****y — CV (BTS SIO SISR, Cybersécurité, Réseau)  </title>
  <meta name="description" content="CV en ligne de T****n B****y — étudiant en BTS SIO (SISR) passionné par la cybersécurité. Certifié eJPT & CPTS (HTB), spécialisé en pentest web et réseau. Maîtrise de Linux, automatisation, Git/GitHub et outils d’audit. Présentation claire de ses projets, formations, certifications." />
  <link rel="canonical" href="https://trbarry.github.io/page_cv/" />

  <!-- Perf: pré-connexion au CDN -->
  <link rel="preconnect" href="https://cdn.jsdelivr.net" crossorigin>

  <!-- CSS principale : chargement synchrone pour éviter tout FOUC/CLS -->
  <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css"
        rel="stylesheet" fetchpriority="high">

  <!-- Icônes : chargement standard (évite le reflow tardif des .bi) -->
  <link href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.css"
        rel="stylesheet">

  <!-- Thème noir + accessibilité + boutons cliquables -->
  <style>
    :root[data-bs-theme="dark"]{
      /* Palette “noir profond” */
      --c-bg: #0b0b0f;
      --c-bg-soft: #121218;
      --c-card: #121218;
      --c-elev: #181821;
      --c-border: #262634;
      --c-text: #e9e9ef;
      --c-text-dim: #a7abbb;

      /* Violet (déclinaisons statiques pour compatibilité) */
      --c-primary: #8b5cf6;        /* base */
      --c-primary-strong: #a78bfa; /* + clair */
      --c-primary-dark: #6d28d9;   /* + foncé */
      --c-primary-vdark: #4c1d95;  /* très foncé */

      /* Mappage Bootstrap */
      --bs-body-bg: var(--c-bg);
      --bs-body-color: var(--c-text);
      --bs-card-bg: var(--c-card);
      --bs-border-color: var(--c-border);
      --bs-secondary: var(--c-text-dim);
      --bs-primary: var(--c-primary);
      --bs-link-color: #8f66f7;
      --bs-link-hover-color: var(--c-primary-strong);
      --bs-heading-color: var(--c-text);
      --bs-code-color: var(--c-primary-strong);
      --bs-focus-ring-color: rgba(139, 92, 246, .35);
    }

    /* Relief doux et séparations subtiles */
    .navbar,
    .card { border: 1px solid var(--bs-border-color); }
    .navbar { background: linear-gradient(180deg, var(--c-bg-soft), var(--c-bg)); }
    .card { background: linear-gradient(180deg, var(--c-card), var(--c-elev)); }

    /* Toggler lisible sur fond sombre */
    .navbar-toggler { border-color: rgba(255,255,255,.15); }
    .navbar-toggler-icon { filter: invert(1) contrast(1.3); }

    /* Avatar */
    .avatar {
      width: 92px; height: 92px; object-fit: cover; border-radius: 50%;
      border: 2px solid rgba(255,255,255,.12);
      box-shadow: 0 0 0 4px rgba(139,92,246,.08);
    }

    /* Titres de section */
    .section-title {
      border-left: 4px solid var(--bs-primary);
      padding-left: .5rem;
      text-transform: uppercase;
      letter-spacing: .04em;
      color: var(--bs-heading-color);
    }

    /* Liens plus “clic” (surface + contrastes) */
    a { text-underline-offset: .2em; }
    a:hover { text-decoration-thickness: 2px; }

    /* Boutons : taille cible >= 44px, focus visible, micro-anim */
    .btn {
      --pad-y: .6rem; --pad-x: .9rem;
      padding: var(--pad-y) var(--pad-x);
      border-radius: 999px;
      transition: transform .08s ease, box-shadow .2s ease, background-color .2s ease, color .2s ease, border-color .2s ease;
      min-height: 44px;
      display: inline-flex; align-items: center; gap: .45rem;
    }
    .btn:active { transform: translateY(1px); }
    .btn:focus-visible { outline: 0; box-shadow: 0 0 0 .2rem rgba(139,92,246,.35); }

    .btn-primary {
      background: linear-gradient(180deg, #9a6bff, #7c3aed);
      border-color: var(--c-primary-dark);
      color: #fff;
    }
    .btn-primary:hover {
      background: #a78bfa;
      border-color: #8b5cf6;
      color: #fff;
    }

    .btn-outline-light {
      border-color: rgba(255,255,255,.35);
      color: #fff;
      background: rgba(255,255,255,.02);
    }
    .btn-outline-light:hover {
      background: rgba(255,255,255,.08);
      border-color: rgba(255,255,255,.55);
      color: #fff;
    }

    .btn-ghost {
      background: transparent;
      border: 1px solid var(--bs-border-color);
      color: var(--c-text);
    }
    .btn-ghost:hover {
      background: rgba(139,92,246,.08);
      border-color: var(--c-primary-dark);
      color: #fff;
    }

    /* Badges transformés en pills cliquables */
    .pill-link {
      display: inline-flex; align-items: center; gap: .4rem;
      padding: .45rem .7rem;
      border-radius: 999px;
      border: 1px solid #5b2ab6; /* fixe (ex-mix) */
      color: var(--c-primary-strong);
      background: rgba(139,92,246,.12);
      text-decoration: none;
      min-height: 38px;
    }
    .pill-link:hover { background: rgba(139,92,246,.18); color: #fff; }

    /* List-group sombre */
    .list-group-item {
      border-color: var(--bs-border-color) !important;
      color: var(--bs-body-color);
    }

    /* Accordion sombre + focus */
    .accordion-button { background: transparent; color: var(--bs-body-color); }
    .accordion-button:not(.collapsed) {
      background: rgba(139,92,246,.08);
      color: #fff;
      box-shadow: inset 0 -1px 0 var(--bs-border-color);
    }
    .accordion-button:focus { box-shadow: 0 0 0 .2rem rgba(139,92,246,.35); }

    /* “Stretched link” optionnel pour cartes */
    .stretched { position: relative; }
    .stretched > a.stretched-link { z-index: 0; }

    /* Back-to-top plus intégré */
    .btn-backtop {
      border-radius: 999px;
      box-shadow: 0 8px 24px rgba(0,0,0,.4);
      border: 1px solid var(--bs-border-color);
    }

    /* Correction PageSpeed : forcer font-display swap sur bootstrap-icons */
    @font-face {
      font-family: "bootstrap-icons";
      src: url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/fonts/bootstrap-icons.woff2") format("woff2");
      font-display: swap;
    }

    /* Stabilisation des icônes bootstrap pour éviter tout micro-shift si la font tarde */
    .bi { display: inline-block; width: 1em; height: 1em; line-height: 1; }

    /* Impression : fond blanc lisible */
    @media print {
      :root[data-bs-theme="dark"]{
        --bs-body-bg: #fff;
        --bs-body-color: #000;
        --bs-card-bg: #fff;
        --bs-border-color: #ddd;
        --bs-link-color: #3b82f6;
      }
      .btn, .navbar, .btn-backtop { display: none !important; }
      a { text-decoration: underline; }
    }
  </style>

  <!-- Données structurées (Person) -->
  <script type="application/ld+json">
  {
    "@context":"https://schema.org",
    "@type":"Person",
    "name":"T****n B****y",
    "url":"https://trbarry.github.io/page_cv/",
    "sameAs":["https://github.com/Trbarry","https://www.linkedin.com/in/tristan-barry-43b91b330"],
    "description":"Étudiant BTS SIO (SISR), certifié eJPT & CPTS (HTB), orientation pentest web & réseau.",
    "knowsAbout":["Pentest","Réseaux","Linux","Burp Suite","Nmap","Wireshark"]
  }
  </script>
</head>
<body data-bs-theme="dark">
  <a class="visually-hidden-focusable position-absolute top-0 start-0 m-2 btn btn-sm btn-light" href="#content">Aller au contenu</a>

  <!-- NAVBAR -->
  <nav class="navbar navbar-expand-lg sticky-top">
    <div class="container">
      <a class="navbar-brand fw-semibold" href="#content">T****n B****y</a>
      <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#topnav" aria-controls="topnav" aria-expanded="false" aria-label="Afficher le menu">
        <span class="navbar-toggler-icon"></span>
      </button>
      <div class="collapse navbar-collapse" id="topnav">
        <ul class="navbar-nav ms-auto align-items-lg-center gap-lg-2">
          <li class="nav-item"><a class="nav-link" href="#projects">Projets</a></li>
          <li class="nav-item"><a class="nav-link" href="#education">Formations</a></li>
          <li class="nav-item"><a class="nav-link" href="#contact">Contact</a></li>
          <li class="nav-item">
            <a class="btn btn-primary btn-sm ms-lg-2" href="https://trxtxbook.com/articles/cpts-journey" target="_blank" rel="noopener">
              <i class="bi bi-box-arrow-up-right"></i><span class="ms-1">CPTS Journey</span>
            </a>
          </li>
        </ul>
      </div>
    </div>
  </nav>

  <!-- HERO -->
  <header class="container py-4">
    <div class="card border-0 shadow rounded-4">
      <div class="card-body p-4 p-lg-5">
        <div class="d-flex flex-column flex-md-row align-items-start align-items-md-center gap-3">
          <div class="flex-grow-1">
            <h1 class="h2 mb-1">T****n B****y</h1>
            <p class="text-secondary mb-3">BTS services informatique aux organisations option A solutions d'infrastructure, systèmes et réseaux • Cybersécurité • Pentest Web Réseau </p>

            <!-- Liens -> tous en boutons/pills cliquables -->
            <div class="d-flex flex-wrap gap-2">
              <a class="btn btn-primary btn-sm" href="https://www.linkedin.com/in/tristan-barry-43b91b330" target="_blank" rel="noopener">
                <i class="bi bi-linkedin"></i><span class="ms-1">LinkedIn</span>
              </a>
              <a class="btn btn-ghost btn-sm" href="https://github.com/Trbarry" target="_blank" rel="noopener">
                <i class="bi bi-github"></i><span class="ms-1">GitHub</span>
              </a>
              <a class="pill-link" href="https://trxtxbook.com/certifications" target="_blank" rel="noopener">
                <i class="bi bi-award"></i><span>eJPT</span>
              </a>
              <a class="pill-link" href="https://trxtxbook.com/certifications" target="_blank" rel="noopener">
                <i class="bi bi-award"></i><span>CPTS</span>
              </a>
              <span class="pill-link" aria-disabled="true"><i class="bi bi-hourglass-split"></i><span>BSCP (en cours)</span></span>
              <span class="pill-link" aria-disabled="true"><i class="bi bi-journal-code"></i><span>CCNA (self-learning)</span></span>
            </div>
          </div>

          <div class="ms-auto d-print-none">
            <button class="btn btn-outline-light" onclick="window.print()">
              <i class="bi bi-printer"></i><span class="ms-1">Imprimer / PDF</span>
            </button>
          </div>
        </div>
      </div>
    </div>
  </header>

  <!-- MAIN -->
  <main id="content" class="container pb-5">
    <div class="row g-4">
      <!-- COL GAUCHE -->
      <section class="col-12 col-lg-4">
        <div class="card border-0 shadow rounded-4 h-100">
          <div class="card-body p-4">
            <h2 class="h5 section-title mb-3 fw-semibold">Profil</h2>
            <p class="mb-3 text-body"> 
Étudiant en BTS SIO option SISR, en reconversion vers la cybersécurité.
Je recherche une alternance orientée infrastructure, réseau et support afin de renforcer mes compétences en administration système et sécurité.
Mon objectif : évoluer vers un rôle de technicien polyvalent, capable d’assurer la fiabilité, la performance et la protection des environnements informatiques d’entreprise.
            <h3 class="h6 text-uppercase mt-4 mb-2">Compétences</h3>
            <ul class="list-group list-group-flush small mb-0">
              <li class="list-group-item bg-transparent text-light"><strong>Réseaux :</strong> TCP/IP, VLAN, DHCP, DNS</li>
              <li class="list-group-item bg-transparent text-light"><strong>Sécurité :</strong> Burp Suite, Nmap, Wireshark</li>
              <li class="list-group-item bg-transparent text-light"><strong>Dev :</strong> HTML/CSS, JavaScript (débutant), Python (bases)</li>
              <li class="list-group-item bg-transparent text-light"><strong>OS & Outils :</strong> Linux (Arch/Kali), Git/GitHub, VS Code, Obsidian</li>
            </ul>

            <h3 class="h6 text-uppercase mt-4 mb-2">Certifications</h3>
            <div class="d-flex flex-wrap gap-2">
              <a class="pill-link" href="https://trxtxbook.com/certifications" target="_blank" rel="noopener">
                <i class="bi bi-award"></i><span>eJPT</span>
              </a>
              <a class="pill-link" href="https://trxtxbook.com/certifications" target="_blank" rel="noopener">
                <i class="bi bi-award"></i><span>CPTS</span>
              </a>
              <span class="pill-link" aria-disabled="true"><i class="bi bi-hourglass-split"></i><span>BSCP (en cours)</span></span>
              <span class="pill-link" aria-disabled="true"><i class="bi bi-journal-code"></i><span>CCNA (self-learning)</span></span>
            </div>

            <h3 id="contact" class="h6 text-uppercase mt-4 mb-2">Contact</h3>
<ul class="list-unstyled small mb-0" style="display: flex; flex-direction: column; gap: 0.6rem;">
  <li>
    <a class="pill-link" href="https://github.com/Trbarry" target="_blank" rel="noopener">
      <i class="bi bi-github"></i><span>github.com/Trbarry</span>
    </a>
  </li>
  <li>
    <a class="pill-link" href="https://www.linkedin.com/in/tristan-barry-43b91b330" target="_blank" rel="noopener">
      <i class="bi bi-linkedin"></i><span>linkedin.com/in/tristan-barry-43b91b330</span>
    </a>
  </li>
</ul>

          </div>
        </div>
      </section>

      <!-- COL DROITE -->
      <section class="col-12 col-lg-8">
        <!-- Projets -->
        <div class="card border-0 shadow rounded-4 mb-4">
          <div class="card-body p-4 p-lg-5">
            <h2 id="projects" class="h5 section-title mb-3 fw-semibold">Projets marquants</h2>
            <div class="d-grid gap-3">

              <!-- CPTS -->
              <article class="border rounded-3 p-3 stretched">
                <header class="d-flex justify-content-between flex-wrap gap-2">
                  <h3 class="h6 mb-0">CPTS — Rapport & méthode</h3>
                  <span class="text-secondary">2024</span>
                </header>
                <p class="small mb-2">Retour d’expérience et reporting pro (captures, logs, scripts, recommandations).</p>

                <div class="accordion" id="acc-cpts">
                  <div class="accordion-item bg-transparent">
                    <h4 class="accordion-header" id="cpts-head">
                      <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#cpts-body" aria-expanded="false" aria-controls="cpts-body">
                        Voir le détail
                      </button>
                    </h4>
                    <div id="cpts-body" class="accordion-collapse collapse" aria-labelledby="cpts-head" data-bs-parent="#acc-cpts">
                      <div class="accordion-body">
                        <ul class="small mb-3">
                          <li>Méthodo end-to-end (recon → exploitation → post-exploitation → recommandations)</li>
                          <li>Gestion des preuves et priorisation des findings</li>
                          <li>Mise en forme type rapport de pentest (SysReptor)</li>
                        </ul>
                        <a class="btn btn-sm btn-primary rounded-pill" href="https://trxtxbook.com/articles/cpts-journey" target="_blank" rel="noopener">
                          <i class="bi bi-box-arrow-up-right"></i><span class="ms-1">Lire l’article CPTS Journey</span>
                        </a>
                      </div>
                    </div>
                  </div>
                </div>
              </article>

              <!-- PortSwigger -->
              <article class="p-2">
                <header class="d-flex justify-content-between flex-wrap gap-2">
                  <h3 class="h6 mb-0">PortSwigger Web Security Academy — Labs</h3>
                  <span class="text-secondary">2024–2025</span>
                </header>
                <p class="small mb-1">Entraînement ciblé : XSS, CSRF, XXE, SSRF, Path Traversal, Injection de commandes.</p>
                <ul class="small mb-0">
                  <li><i class="bi bi-search me-1"></i> Méthode : énumération → test → exploitation</li>
                  <li><i class="bi bi-tools me-1"></i> Outils : Burp Suite, ffuf, curl, scripts Python</li>
                </ul>
              </article>

              <!-- HTB / Root-Me -->
              <article class="p-2">
                <header class="d-flex justify-content-between flex-wrap gap-2">
                  <h3 class="h6 mb-0">Hack The Box / Root-Me — Pratique continue</h3>
                  <span class="text-secondary">2023–2025</span>
                </header>
                <p class="small mb-1">Boxes & challenges (Windows/Linux, web, réseau). Capitalisation de la veille.</p>
                <ul class="small mb-0">
                  <li><i class="bi bi-diagram-3 me-1"></i> Automatisation dans un environnement Exegol / Arch</li>
                  <li><i class="bi bi-journal-check me-1"></i> Notes & preuves : Obsidian / GitHub</li>
                </ul>
              </article>

            </div>
          </div>
        </div>

        <!-- Formations -->
        <div class="card border-0 shadow rounded-4 mb-4">
          <div class="card-body p-4 p-lg-5">
            <h2 id="education" class="h5 section-title mb-3 fw-semibold">Formations</h2>
            <ul class="list-unstyled small mb-0">
              <li class="mb-2">
                <strong>BTS SIO — Option SISR</strong> — 2025–2027 <span class="text-secondary">(en cours)</span>
                <div class="text-secondary">Bases réseaux, systèmes, sécurité.</div>
              </li>
              <li class="mb-2"><strong>Technicien Réseau de Télécommunication</strong> — AFPA Hazebrouck, 2021</li>
              <li class="mb-2"><strong>Baccalauréat ST2S</strong> — Lycée du Forez (Feurs), 2016</li>
            </ul>
          </div>
        </div>

        <!-- Centres d’intérêt -->
        <div class="card border-0 shadow rounded-4">
          <div class="card-body p-4 p-lg-5">
            <h2 class="h5 section-title mb-3 fw-semibold">Centres d’intérêt</h2>
            <p class="small mb-0">Randonnée, powerlifting, Linux, CTF, pentesting.</p>
          </div>
        </div>
      </section>
    </div>
  </main>

  <!-- FOOTER -->
  <footer class="container pb-5">
    <div class="card border-0 shadow rounded-4">
      <div class="card-body p-4 d-flex flex-wrap justify-content-between align-items-center gap-2">
        <small class="text-secondary">© <span id="year"></span> T****n B****y</small>
        <small>
          <a href="https://github.com/Trbarry/page_cv" class="pill-link" target="_blank" rel="noopener">
            <i class="bi bi-box-arrow-up-right"></i><span>Dépôt GitHub</span>
          </a>
        </small>
      </div>
    </div>
  </footer>

  <!-- Back to top -->
  <a href="#content" class="btn btn-light btn-backtop position-fixed bottom-0 end-0 m-3 d-print-none" aria-label="Revenir en haut">
    <i class="bi bi-arrow-up"></i>
  </a>

  <script>
    document.getElementById('year').textContent = new Date().getFullYear();
  </script>
  <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js" defer></script>
</body>
</html>

A propos d'Outiref

Contact / Signaler un bug

FAQ

Crédits et Mentions Légales

Audit SEO par Abondance

Suivez nous sur...

Un site du Réseau Abondance

Agence SEO Neper
Formations SEO NEPER
Googlefight
Cabinet de conseil en IA - Neper AI
La météo du SEO
Klemo