585 lines
39 KiB
HTML
585 lines
39 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
<meta name="theme-color" content="#041C32"/>
|
|
<meta name="description" content="d3vyce.fr Site" />
|
|
<meta name="author" content="d3vyce - Nicolas Sudres" />
|
|
<title>Home • d3vyce.fr</title>
|
|
<!-- Manifest -->
|
|
<link rel="manifest" href="manifest.json">
|
|
<!-- Favicon -->
|
|
<link rel="icon" type="image/x-icon" href="assets/favicon.ico" />
|
|
<link rel="apple-touch-icon" sizes="180x180" href="assets/apple-touch-icon.png">
|
|
<!-- Boostrap -->
|
|
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.0/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-gH2yIJqKdNHPEq0n4Mqa/HGKIhSkIHeL5AyhkYV8i59U5AR6csBvApHHNl/vI1Bx" crossorigin="anonymous">
|
|
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.0/dist/js/bootstrap.bundle.min.js"></script>
|
|
<!-- Custom CSS -->
|
|
<link rel="stylesheet" href="css/style.css">
|
|
<link rel="stylesheet" href="css/mouse.css">
|
|
<link rel="stylesheet" href="css/timeline.css">
|
|
<!-- Awesome Font -->
|
|
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
|
|
<!-- Bootstrap Icons -->
|
|
<link href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.5.0/font/bootstrap-icons.css" rel="stylesheet" />
|
|
<!-- Roboto Font -->
|
|
<link href='http://fonts.googleapis.com/css?family=Roboto' rel='stylesheet' type='text/css'>
|
|
<!-- Umami Analytics -->
|
|
<script async src="https://analytics.d3vyce.fr/script.js" data-website-id="4c83df85-5566-4647-ba67-b3724890baca"></script>
|
|
</head>
|
|
<body>
|
|
<!-- Home -->
|
|
<header class="masthead" id="home">
|
|
<div class="container h-100">
|
|
<div class="row head-row align-items-center h-100 justify-content-evenly text-center">
|
|
<div class="col-4">
|
|
<img src="assets/img/profil.avif" class="rounded-circle img-fluid" alt="...">
|
|
<hr class="divider" />
|
|
<h1 class="text-white font-weight-bold">d3vyce</h1>
|
|
</div>
|
|
<div class="col-md-12 col-lg-4 justify-content-center">
|
|
<h2 class="text-white font-weight-bold">Hi 👋, Welcome to my Site!</h2>
|
|
<p class="text-white-65">Developer, CTF Player, Homelab, 3D Printing</p>
|
|
<hr class="divider" />
|
|
<div class="d-grid col-8 mx-auto">
|
|
<a class="btn mt-2 btn-lg" href="https://blog.d3vyce.fr" target="_blank" rel="noopener noreferrer"><span><i class="fa fa-bookmark fa-lg"></i> Blog</span></a>
|
|
<a class="btn mt-2 btn-lg" href="https://github.com/d3vyce" target="_blank" rel="noopener noreferrer"><span><i class="fa fa-github fa-lg"></i> Github</span></a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="row head-row justify-content-center">
|
|
<div class="col-12 mouse_scroll p-0">
|
|
<a class="anchor" href="#about">
|
|
<div class="mouse">
|
|
<div class="wheel"></div>
|
|
</div>
|
|
<div>
|
|
<span class="m_scroll_arrows unu"></span>
|
|
<span class="m_scroll_arrows doi"></span>
|
|
<span class="m_scroll_arrows trei"></span>
|
|
</div>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</header>
|
|
<!-- About -->
|
|
<section class="page-section about" id="about">
|
|
<div class="container">
|
|
<h2 class="text-white text-center mt-0">About Me</h2>
|
|
<hr class="divider" />
|
|
<div class="row align-items-center justify-content-center mt-4">
|
|
<div class="col-xl-2 col-lg-3 col-sm-4">
|
|
<img src="assets/img/profil_about.avif" class="rounded img-fluid" alt="...">
|
|
</div>
|
|
<div class="col-lg-8 mt-4">
|
|
<blockquote>
|
|
<!-- Desktop/Tablet -->
|
|
<div class="d-none d-sm-block">
|
|
<p class="text-white-65 mb-5">Hi, I'm Nicolas S aka d3vyce. I am a network and cybersecurity engineer living in France. I've always been passionate about computer science and technology, and over the years I've developed my skills in various fields such as programming, cybersecurity, infrastructure, networks, ... In addition to my master degree in networks and security, I love CTF and I have a homelab at home to continue my learning and experiment new things.</p>
|
|
<footer class="blockquote-footer"><cite>d3vyce - Nicolas. S</cite></footer>
|
|
</div>
|
|
<!-- Smartphone -->
|
|
<div class="d-sm-none">
|
|
<p class="text-white-65">Hi, I'm Nicolas S aka d3vyce. I am a network and cybersecurity engineer living in France. <a class="text-accent" data-bs-toggle="collapse" href="#bio-collapse" role="button" aria-expanded="false" aria-controls="bio-collapse">Read more...</a></p>
|
|
<div class="collapse" id="bio-collapse">
|
|
<p class="text-white-65">I've always been passionate about computer science and technology, and over the years I've developed my skills in various fields such as programming, cybersecurity, infrastructure, networks, ... In addition to my master degree in networks and security, I love CTF and I have a homelab at home to continue my learning and experiment new things.</p>
|
|
</div>
|
|
<footer class="blockquote-footer mt-2"><cite>d3vyce - Nicolas. S</cite></footer>
|
|
</div>
|
|
</blockquote>
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="container">
|
|
<div class="row justify-content-center">
|
|
<div class="col-lg-6">
|
|
<hr class="divider" />
|
|
<ul class="timeline-with-icons text-white mt-5 reveal fade">
|
|
<li class="timeline-item mb-5">
|
|
<span class="timeline-icon">
|
|
<i class="bi-code-slash text-accent fs-5"></i>
|
|
</span>
|
|
<h5 class="fw-bold">Engineering internship: Network Design Architect</h5>
|
|
<p class="text-accent mb-2 fw-bold">2019/2022</p>
|
|
<p class="text-white-65">
|
|
Multi-technology collection capacity planning. Study and management of network evolution (collection, xDSL, Fiber, Backbone). Technical deliverables, pre-sales and OSM technical support.
|
|
</p>
|
|
</li>
|
|
|
|
<li class="timeline-item mb-5">
|
|
|
|
<span class="timeline-icon">
|
|
<i class="bi-award text-accent fs-5"></i>
|
|
</span>
|
|
<h5 class="fw-bold">Master's degree in Networks and Cybersecurity</h5>
|
|
<p class="text-accent mb-2 fw-bold">2019/2022</p>
|
|
<p class="text-white-65">
|
|
|
|
</p>
|
|
</li>
|
|
|
|
<li class="timeline-item mb-5">
|
|
|
|
<span class="timeline-icon">
|
|
<i class="bi-code-slash text-accent fs-5"></i>
|
|
</span>
|
|
<h5 class="fw-bold">Optimization and Monitoring of an enterprise network</h5>
|
|
<p class="text-accent mb-2 fw-bold">2019</p>
|
|
<p class="text-white-65">
|
|
Upgrade and documentation of network equipment, implementation of a monitoring and automatic alert solution.
|
|
</p>
|
|
</li>
|
|
|
|
<li class="timeline-item mb-5">
|
|
|
|
<span class="timeline-icon">
|
|
<i class="bi-award text-accent fs-5"></i>
|
|
</span>
|
|
<h5 class="fw-bold">Two-year University degree in Networks and Telecommunications</h5>
|
|
<p class="text-accent mb-2 fw-bold">2017/2019</p>
|
|
<p class="text-white-65">
|
|
|
|
</p>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
<!-- Skills -->
|
|
<section class="page-section skills" id="skills">
|
|
<div class="container px-8 px-lg-12">
|
|
<h2 class="text-white text-center mt-0">Skills</h2>
|
|
<hr class="divider divider-light mb-0" />
|
|
<div class="text-white row px-8 px-lg-12 justify-content-around">
|
|
<div class="mt-5 col-lg-3 col-md-12 text-center reveal fade">
|
|
<div class="mb-2"><i class="text-accent bi-code-slash fs-1"></i></div>
|
|
<h3 class="text-white h4 mb-3">Programming</h3>
|
|
<p class="mt-4">
|
|
<span class="badge bg-dark-3">C</span>
|
|
<span class="badge bg-dark-3">C#</span>
|
|
<span class="badge bg-dark-3">Python</span>
|
|
<span class="badge bg-dark-3">Bash</span>
|
|
<span class="badge bg-dark-3">HTML</span>
|
|
<span class="badge bg-dark-3">CSS</span>
|
|
<span class="badge bg-dark-3">PHP</span>
|
|
<span class="badge bg-dark-3">JS</span>
|
|
<span class="badge bg-dark-3">MySQL</span>
|
|
<span class="badge bg-dark-3">Ansible</span>
|
|
<span class="badge bg-dark-3">Git</span>
|
|
<span class="badge bg-dark-3">Elastic</span>
|
|
<span class="badge bg-dark-3">CI/CD</span>
|
|
</p>
|
|
</div>
|
|
<div class="mt-5 col-lg-3 col-md-12 text-center reveal fade">
|
|
<div class="mb-2"><i class="text-accent bi-shield-lock fs-1"></i></div>
|
|
<h3 class="text-white h4 mb-3">Cybersecurity</h3>
|
|
<p class="mt-4">
|
|
<span class="badge bg-dark-3">Kali</span>
|
|
<span class="badge bg-dark-3">OWASP</span>
|
|
<span class="badge bg-dark-3">Injection</span>
|
|
<span class="badge bg-dark-3">Metasploit</span>
|
|
<span class="badge bg-dark-3">Hydra</span>
|
|
<span class="badge bg-dark-3">Hashcat</span>
|
|
<span class="badge bg-dark-3">John</span>
|
|
<span class="badge bg-dark-3">Burp</span>
|
|
</p>
|
|
</div>
|
|
<div class="mt-5 col-lg-3 col-md-12 text-center reveal fade">
|
|
<div class="mb-2"><i class="text-accent bi-hdd-network fs-1"></i></div>
|
|
<h3 class="text-white h4 mb-3">Networking</h3>
|
|
<p class="mt-4">
|
|
<span class="badge bg-dark-3">Wireguard</span>
|
|
<span class="badge bg-dark-3">IPSec</span>
|
|
<span class="badge bg-dark-3">MPLS</span>
|
|
<span class="badge bg-dark-3">BGP</span>
|
|
<span class="badge bg-dark-3">Firewall</span>
|
|
<span class="badge bg-dark-3">OPNsense</span>
|
|
<span class="badge bg-dark-3">WDM</span>
|
|
<span class="badge bg-dark-3">Docker</span>
|
|
<span class="badge bg-dark-3">Kubernetes</span>
|
|
<span class="badge bg-dark-3">KVM</span>
|
|
<span class="badge bg-dark-3">IPtable</span>
|
|
</p>
|
|
</div>
|
|
</div>
|
|
<hr class="divider mt-5" />
|
|
<div class="text-white row px-8 px-lg-12 justify-content-around">
|
|
<div class="mt-5 col-lg-3 col-md-12 text-center reveal fade">
|
|
<div class="mb-2"><i class="text-accent bi-award fs-1"></i></div>
|
|
<h3 class="text-white h4 mb-3">Certification</h3>
|
|
<div class="text-white-65">
|
|
<p>Jr Penetration Tester (THM)</p>
|
|
<p>Offensive Pentesting (THM)</p>
|
|
<p>JNCIA Junos</p>
|
|
<p>CCNAv7, CCNA R&S</p>
|
|
</div>
|
|
</div>
|
|
<div class="mt-5 col-lg-3 col-md-12 text-center reveal fade">
|
|
<div class="mb-2"><i class="text-accent bi-lightbulb fs-1"></i></div>
|
|
<h3 class="text-white h4 mb-3">CTF Challenge/Event</h3>
|
|
<div class="text-white-65">
|
|
<p>leHACK 2022 - Paris</p>
|
|
<p>404 CTF 2022 - Online</p>
|
|
<p>Cyber Apocalypse CTF 2022 - Online</p>
|
|
<p>TRACS CTF 2021 (Team Get-Pwned) - CentraleSupélec</p>
|
|
</div>
|
|
</div>
|
|
<div class="mt-5 col-lg-3 col-md-12 text-center reveal fade">
|
|
<div class="mb-2"><i class="text-accent bi-clipboard-check fs-1"></i></div>
|
|
<h3 class="text-white h4 mb-3">CTF Training</h3>
|
|
<div class="text-white-65">
|
|
<a href="https://tryhackme.com/p/d3vyce" target="_blank" rel="noopener noreferrer">
|
|
<img src="https://tryhackme-badges.s3.amazonaws.com/d3vyce.png" alt="TryHackMe" style="width:100%">
|
|
</a>
|
|
<p></p>
|
|
<a href="https://app.hackthebox.com/profile/922368" target="_blank" rel="noopener noreferrer">
|
|
<img src="https://www.hackthebox.com/badge/image/922368" alt="HackTheBox" style="width:100%">
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
<!-- Projects -->
|
|
<section class="page-section projects" id="projects">
|
|
<div class="container">
|
|
<div class="row align-items-center justify-content-center">
|
|
<div class="col-lg-8 text-center">
|
|
<h2 class="text-white mt-0">Projects</h2>
|
|
<hr class="divider divider-light" />
|
|
</div>
|
|
<div class="row h-100 justify-content-evenly">
|
|
<div class="project col-sm-12 col-lg-7 col-xl-5" >
|
|
<a href="#Project1-modal" data-bs-toggle="modal" data-toggle="modal">
|
|
<div class="row">
|
|
<div class="col">
|
|
<img class="project-image" src="assets/img/projet/Site-d3vyce-1.avif" alt="...">
|
|
</div>
|
|
<div class="col project-text">
|
|
<h2 class="text-white font-weight-bold">d3vyce.fr</h2>
|
|
<p class="project-icon">
|
|
<span class="badge bg-dark-2">CSS3</span>
|
|
<span class="badge bg-dark-2">HTML5</span>
|
|
<span class="badge bg-dark-2">JS</span>
|
|
<span class="badge bg-dark-2">Bootstrap</span>
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</a>
|
|
</div>
|
|
<div class="project col-sm-12 col-lg-7 col-xl-5">
|
|
<a href="#Project2-modal" data-bs-toggle="modal">
|
|
<div class="row">
|
|
<div class="col">
|
|
<img class="project-image" src="assets/img/projet/Python-game-1.avif" alt="...">
|
|
</div>
|
|
<div class="col project-text">
|
|
<h2 class="text-white font-weight-bold">Python Game</h2>
|
|
<p class="project-icon">
|
|
<span class="badge bg-dark-2">Python</span>
|
|
<span class="badge bg-dark-2">PyGame</span>
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
<div class="row h-100 justify-content-evenly">
|
|
<div class="project col-sm-12 col-lg-7 col-xl-5">
|
|
<a href="#Project3-modal" data-bs-toggle="modal">
|
|
<div class="row">
|
|
<div class="col">
|
|
<img class="project-image" src="assets/img/projet/Writeup-ctf-1.avif" alt="...">
|
|
</div>
|
|
<div class="col project-text">
|
|
<h2 class="text-white font-weight-bold">Writeup CTF</h2>
|
|
<p class="project-icon">
|
|
<span class="badge bg-dark-2">Kali</span>
|
|
<span class="badge bg-dark-2">THM</span>
|
|
<span class="badge bg-dark-2">HTB</span>
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</a>
|
|
</div>
|
|
<div class="project col-sm-12 col-lg-7 col-xl-5">
|
|
<a href="#Project4-modal" data-bs-toggle="modal">
|
|
<div class="row">
|
|
<div class="col">
|
|
<img class="project-image" src="assets/img/projet/Homelab-1.avif" alt="...">
|
|
</div>
|
|
<div class="col project-text">
|
|
<h2 class="text-white font-weight-bold">Homelab</h2>
|
|
<p class="project-icon">
|
|
<span class="badge bg-dark-2">Unraid</span>
|
|
<span class="badge bg-dark-2">OPNsense</span>
|
|
<span class="badge bg-dark-2">Wireguard</span>
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
<!-- Footer-->
|
|
<footer class="footer py-3">
|
|
<div class="container">
|
|
<div class="social text-center">
|
|
<a href="https://twitter.com/d3vyce" target="_blank" rel="noopener noreferrer"><i class="fa test fa-twitter fa-lg"></i></a>
|
|
<a href="https://github.com/d3vyce" target="_blank" rel="noopener noreferrer"><i class="fa test fa-github fa-lg"></i></a>
|
|
<a href="https://www.d3vyce.fr" target="_blank" rel="noopener noreferrer"><i class="fa test fa-bookmark fa-lg"></i></a>
|
|
</div>
|
|
<div class="small text-center text-muted">d3vyce 2024 © All rights reserved</div>
|
|
<div class="small text-center text-muted"><a href="#home">Home</a> • <a href="#about">About</a> • <a href="#skills">Skills</a> • <a href="#projects">Projects</a></div>
|
|
</div>
|
|
</footer>
|
|
|
|
<!-- Portfolio Modals-->
|
|
<!-- Portfolio Modal 1-->
|
|
<div class="portfolio-modal modal fade" id="Project1-modal" tabindex="-1" aria-labelledby="Project1-modal" aria-hidden="true">
|
|
<div class="modal-dialog modal-dialog-centered modal-lg">
|
|
<div class="modal-content">
|
|
<div class="modal-header border-0"><button class="btn-close btn-close-white" type="button" data-bs-dismiss="modal" aria-label="Close"></button></div>
|
|
<div class="modal-body text-center pb-5 pt-0">
|
|
<div class="container">
|
|
<div class="row justify-content-center">
|
|
<div class="col-lg-12">
|
|
<!-- Portfolio Modal - Title-->
|
|
<h2 class="portfolio-modal-title text-secondary text-uppercase mb-0 text-white">d3vyce.fr</h2>
|
|
<!-- Icon Divider-->
|
|
<hr class="divider" />
|
|
<!-- Portfolio Modal - Image-->
|
|
<div id="Project1-carousel" class="carousel slide mb-5" data-bs-ride="carousel">
|
|
<!-- Carousel indicators -->
|
|
<ol class="carousel-indicators">
|
|
<li data-bs-target="#Project1-carousel" data-bs-slide-to="0" class="active"></li>
|
|
<li data-bs-target="#Project1-carousel" data-bs-slide-to="1"></li>
|
|
<li data-bs-target="#Project1-carousel" data-bs-slide-to="2"></li>
|
|
</ol>
|
|
<!-- Wrapper for carousel items -->
|
|
<div class="carousel-inner rounded">
|
|
<div class="carousel-item active">
|
|
<img src="assets/img/projet/Site-d3vyce-2.avif" class="d-block w-100" alt="Slide 1">
|
|
</div>
|
|
<div class="carousel-item">
|
|
<img src="assets/img/projet/Site-d3vyce-3.avif" class="d-block w-100" alt="Slide 2">
|
|
</div>
|
|
<div class="carousel-item">
|
|
<img src="assets/img/projet/Site-d3vyce-4.avif" class="d-block w-100" alt="Slide 3">
|
|
</div>
|
|
</div>
|
|
<!-- Carousel controls -->
|
|
<a class="carousel-control-prev" href="#Project1-carousel" data-bs-slide="prev">
|
|
<span class="carousel-control-prev-icon"></span>
|
|
</a>
|
|
<a class="carousel-control-next" href="#Project1-carousel" data-bs-slide="next">
|
|
<span class="carousel-control-next-icon"></span>
|
|
</a>
|
|
</div>
|
|
<p class="m-4 text-white-65">Development of my personal website in addition to my Blog. The goal was to gather in one place a showcase of my skills, my trainings/certifications and my current and past projects. For this site I used Bootstrap 5 to see what was possible with this library.</p>
|
|
<a class="btn mod btn-outline-light btn-lg mb-4" href="https://github.com/d3vyce/d3vyce.fr" target="_blank" rel="noopener noreferrer"><span>Source Code</span></a>
|
|
<p class="mb-0">
|
|
<span class="badge bg-dark-3">CSS3</span>
|
|
<span class="badge bg-dark-3">HTML5</span>
|
|
<span class="badge bg-dark-3">JS</span>
|
|
<span class="badge bg-dark-3">Bootstrap</span>
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Portfolio Modal 2-->
|
|
<div class="portfolio-modal modal fade" id="Project2-modal" tabindex="-1" aria-labelledby="Project2-modal" aria-hidden="true">
|
|
<div class="modal-dialog modal-dialog-centered modal-lg">
|
|
<div class="modal-content">
|
|
<div class="modal-header border-0"><button class="btn-close btn-close-white" type="button" data-bs-dismiss="modal" aria-label="Close"></button></div>
|
|
<div class="modal-body text-center pb-5 pt-0">
|
|
<div class="container">
|
|
<div class="row justify-content-center">
|
|
<div class="col-lg-12">
|
|
<!-- Portfolio Modal - Title-->
|
|
<h2 class="portfolio-modal-title text-secondary text-uppercase mb-0 text-white">Python Game</h2>
|
|
<!-- Icon Divider-->
|
|
<hr class="divider" />
|
|
<!-- Portfolio Modal - Image-->
|
|
<div id="Project2-carousel" class="carousel slide mb-5" data-bs-ride="carousel">
|
|
<!-- Carousel indicators -->
|
|
<ol class="carousel-indicators">
|
|
<li data-bs-target="#Project2-carousel" data-bs-slide-to="0" class="active"></li>
|
|
</ol>
|
|
<!-- Wrapper for carousel items -->
|
|
<div class="carousel-inner rounded">
|
|
<div class="carousel-item active">
|
|
<img src="assets/img/projet/Python-game-2.avif" class="d-block w-100" alt="Slide 1">
|
|
</div>
|
|
</div>
|
|
<!-- Carousel controls -->
|
|
<a class="carousel-control-prev" href="#Project2-carousel" data-bs-slide="prev">
|
|
<span class="carousel-control-prev-icon"></span>
|
|
</a>
|
|
<a class="carousel-control-next" href="#Project2-carousel" data-bs-slide="next">
|
|
<span class="carousel-control-next-icon"></span>
|
|
</a>
|
|
</div>
|
|
<p class="m-4 text-white-65">The development of game in python is one of my current project. The goal is to become more comfortable with this programming language and to discover new libraries. Following the game Snake, I have for objective to make an adaptation of Chess with an AI as opponent.</p>
|
|
<a class="btn mod btn-outline-light btn-lg mb-4" href="https://github.com/d3vyce/Python-Game" target="_blank" rel="noopener noreferrer"><span>Source Code</span></a>
|
|
<p class="mb-0">
|
|
<span class="badge bg-dark-3">Python</span>
|
|
<span class="badge bg-dark-3">PyGame</span>
|
|
<span class="badge bg-dark-3">Numpy</span>
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Portfolio Modal 1-->
|
|
<div class="portfolio-modal modal fade" id="Project3-modal" tabindex="-1" aria-labelledby="Project3-modal" aria-hidden="true">
|
|
<div class="modal-dialog modal-dialog-centered modal-lg">
|
|
<div class="modal-content">
|
|
<div class="modal-header border-0"><button class="btn-close btn-close-white" type="button" data-bs-dismiss="modal" aria-label="Close"></button></div>
|
|
<div class="modal-body text-center pb-5 pt-0">
|
|
<div class="container">
|
|
<div class="row justify-content-center">
|
|
<div class="col-lg-12">
|
|
<!-- Portfolio Modal - Title-->
|
|
<h2 class="portfolio-modal-title text-secondary text-uppercase mb-0 text-white">Writeup CTF</h2>
|
|
<!-- Icon Divider-->
|
|
<hr class="divider" />
|
|
<!-- Portfolio Modal - Image-->
|
|
<div id="Project3-carousel" class="carousel slide mb-5" data-bs-ride="carousel">
|
|
<!-- Carousel indicators -->
|
|
<ol class="carousel-indicators">
|
|
<li data-bs-target="#Project3-carousel" data-bs-slide-to="0" class="active"></li>
|
|
<li data-bs-target="#Project3-carousel" data-bs-slide-to="1"></li>
|
|
</ol>
|
|
<!-- Wrapper for carousel items -->
|
|
<div class="carousel-inner rounded">
|
|
<div class="carousel-item active">
|
|
<img src="assets/img/projet/Writeup-ctf-2.avif" class="d-block w-100" alt="Slide 1">
|
|
</div>
|
|
<div class="carousel-item">
|
|
<img src="assets/img/projet/Writeup-ctf-3.avif" class="d-block w-100" alt="Slide 2">
|
|
</div>
|
|
</div>
|
|
<!-- Carousel controls -->
|
|
<a class="carousel-control-prev" href="#Project3-carousel" data-bs-slide="prev">
|
|
<span class="carousel-control-prev-icon"></span>
|
|
</a>
|
|
<a class="carousel-control-next" href="#Project3-carousel" data-bs-slide="next">
|
|
<span class="carousel-control-next-icon"></span>
|
|
</a>
|
|
</div>
|
|
<p class="m-4 text-white-65">Since I started doing CTFs, I've had the desire to do Writeups. In addition to sharing the process and the reflexion I had after these challenges, the goal is to keep a history. It allows me to find situations that I have already solved and then get inspired to solve new challenges.</p>
|
|
<a class="btn mod btn-outline-light btn-lg mb-4" href="https://blog.d3vyce.fr/tag/writeup/" target="_blank" rel="noopener noreferrer"><span>Read more</span></a>
|
|
<p class="mb-0">
|
|
<span class="badge bg-dark-3">Kali</span>
|
|
<span class="badge bg-dark-3">THM</span>
|
|
<span class="badge bg-dark-3">HTB</span>
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Portfolio Modal 1-->
|
|
<div class="portfolio-modal modal fade" id="Project4-modal" tabindex="-1" aria-labelledby="Project4-modal" aria-hidden="true">
|
|
<div class="modal-dialog modal-dialog-centered modal-lg">
|
|
<div class="modal-content">
|
|
<div class="modal-header border-0"><button class="btn-close btn-close-white" type="button" data-bs-dismiss="modal" aria-label="Close"></button></div>
|
|
<div class="modal-body text-center pb-5 pt-0">
|
|
<div class="container">
|
|
<div class="row justify-content-center">
|
|
<div class="col-lg-12">
|
|
<!-- Portfolio Modal - Title-->
|
|
<h2 class="portfolio-modal-title text-secondary text-uppercase mb-0 text-white">Homelab</h2>
|
|
<!-- Icon Divider-->
|
|
<hr class="divider" />
|
|
<!-- Portfolio Modal - Image-->
|
|
<div id="Project4-carousel" class="carousel slide mb-5" data-bs-ride="carousel">
|
|
<!-- Carousel indicators -->
|
|
<ol class="carousel-indicators">
|
|
<li data-bs-target="#Project4-carousel" data-bs-slide-to="0" class="active"></li>
|
|
<li data-bs-target="#Project4-carousel" data-bs-slide-to="1"></li>
|
|
<li data-bs-target="#Project4-carousel" data-bs-slide-to="2"></li>
|
|
</ol>
|
|
<!-- Wrapper for carousel items -->
|
|
<div class="carousel-inner rounded">
|
|
<div class="carousel-item active">
|
|
<img src="assets/img/projet/Homelab-2.avif" class="d-block w-100" alt="Slide 1">
|
|
</div>
|
|
<div class="carousel-item">
|
|
<img src="assets/img/projet/Homelab-3.avif" class="d-block w-100" alt="Slide 2">
|
|
</div>
|
|
<div class="carousel-item">
|
|
<img src="assets/img/projet/Homelab-4.avif" class="d-block w-100" alt="Slide 3">
|
|
</div>
|
|
</div>
|
|
<!-- Carousel controls -->
|
|
<a class="carousel-control-prev" href="#Project4-carousel" data-bs-slide="prev">
|
|
<span class="carousel-control-prev-icon"></span>
|
|
</a>
|
|
<a class="carousel-control-next" href="#Project4-carousel" data-bs-slide="next">
|
|
<span class="carousel-control-next-icon"></span>
|
|
</a>
|
|
</div>
|
|
<p class="m-4 text-white-65">Initially, my goal was to create a media server accessible from anywhere with Plex. That was the initial objective, but you will see that today my homelab is much more extensive than that. I have over 20 selfhosted services ranging from password manager, web hosting, game server, etc.</p>
|
|
<a class="btn mod btn-outline-light btn-lg mb-4" href="https://blog.d3vyce.fr/my-current-homelab/" target="_blank" rel="noopener noreferrer"><span>Read more</span></a>
|
|
<p class="mb-0">
|
|
<span class="badge bg-dark-3">Unraid</span>
|
|
<span class="badge bg-dark-3">OPNsense</span>
|
|
<span class="badge bg-dark-3">Wireguard</span>
|
|
<span class="badge bg-dark-3">Docker</span>
|
|
<span class="badge bg-dark-3">Nginx</span>
|
|
<span class="badge bg-dark-3">Unify</span>
|
|
<span class="badge bg-dark-3">Home Assistant</span>
|
|
<span class="badge bg-dark-3">Uptime Kuma</span>
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Boostrap JS -->
|
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/r121/three.min.js"></script>
|
|
<script src="https://cdn.jsdelivr.net/npm/vanta@latest/dist/vanta.net.min.js"></script>
|
|
<script src="js/script.js"></script>
|
|
<script>
|
|
VANTA.NET({
|
|
el: "#home",
|
|
mouseControls: true,
|
|
touchControls: false,
|
|
gyroControls: true,
|
|
minHeight: 200.00,
|
|
minWidth: 200.00,
|
|
scale: 1.00,
|
|
scaleMobile: 1.00,
|
|
points: 10.00,
|
|
maxDistance: 20.00,
|
|
spacing: 25.00,
|
|
color: 0xD87E27,
|
|
backgroundColor: 0x041C32
|
|
})
|
|
</script>
|
|
</body>
|
|
</html>
|