|
|
<!DOCTYPE html>
|
|
|
<html lang="fr">
|
|
|
|
|
|
<head>
|
|
|
<meta charset="utf-8">
|
|
|
<title>Portefolio</title>
|
|
|
<link href="https://codefirst.iut.uca.fr/containers/dorianhodin-portfolio/assets/img/favicon.ico" rel="icon">
|
|
|
<link href="assets/css/bootstrap-css/bootstrap.min.css" rel="stylesheet">
|
|
|
<link href="assets/css/style.css" rel="stylesheet">
|
|
|
</head>
|
|
|
|
|
|
<body>
|
|
|
<header id="header">
|
|
|
<div class="container">
|
|
|
|
|
|
<h1><a href="index.html">Dorian HODIN</a></h1>
|
|
|
<h2>Developpeur en 3ème année de BUT Informatique</span></h2>
|
|
|
|
|
|
<nav id="navbar" class="navbar">
|
|
|
<ul>
|
|
|
<li><a class="nav-link active" href="#header">Accueil</a></li>
|
|
|
<li><a class="nav-link" href="#about">À propos de moi</a></li>
|
|
|
<li><a class="nav-link" href="#experience">Experiences</a></li>
|
|
|
<li><a class="nav-link" href="#competence">Compétences</a></li>
|
|
|
<li><a class="nav-link" href="#projects">Projets</a></li>
|
|
|
<li><a class="nav-link" href="#perso">Intérêt personnel</a></li>
|
|
|
</ul>
|
|
|
</nav>
|
|
|
|
|
|
<div class="social-links">
|
|
|
<a href="https://www.linkedin.com/in/dorian-hodin-45881a252/" target="_blank">
|
|
|
<img src="https://get-picto.com/wp-content/uploads/2023/02/logo-linkedin-noir-et-blanc.webp" alt="LinkedIn" style="width: 30px; height: 30px;">
|
|
|
</a>
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
</header>
|
|
|
|
|
|
<section id="about" class="about">
|
|
|
<div class="about-me container">
|
|
|
|
|
|
<div class="section-title">
|
|
|
<h2>À propos de moi :</h2>
|
|
|
</div>
|
|
|
|
|
|
<div class="row">
|
|
|
<div class="col-lg-4" data-aos="fade-right">
|
|
|
<img src="assets/img/me.jpg" class="img-fluid" alt="pp">
|
|
|
</div>
|
|
|
<div class="col-lg-8 pt-4 pt-lg-0 content" data-aos="fade-left">
|
|
|
<h3>Dévelopeur Junior en alternance</h3>
|
|
|
<p class="fst-italic">
|
|
|
Actuellement en BUT Informatique en 3ème année à Clermont-Ferrand, je suis en alternance chez CGI pour le client Michelin.
|
|
|
Je vais continuer mon parcours scolaire à l'école d'ingénieurs ISIMA après la fin de mon BUT.
|
|
|
</p>
|
|
|
<div class="row">
|
|
|
<div class="col-lg-6">
|
|
|
<ul>
|
|
|
<li><img src="https://icones.pro/wp-content/uploads/2021/06/symbole-fleche-droite-vert.png" width="10%"><strong>Date de naissance :</strong> <span>20 Juillet 2003</span></li>
|
|
|
<li><img src="https://icones.pro/wp-content/uploads/2021/06/symbole-fleche-droite-vert.png" width="10%"><strong>Téléphone :</strong> <span>+33783769671</span></li>
|
|
|
<li><img src="https://icones.pro/wp-content/uploads/2021/06/symbole-fleche-droite-vert.png" width="10%"><strong>Ville :</strong> <span>Clermont-Ferrand</span></li>
|
|
|
</ul>
|
|
|
</div>
|
|
|
<div class="col-lg-6">
|
|
|
<ul>
|
|
|
<li><img src="https://icones.pro/wp-content/uploads/2021/06/symbole-fleche-droite-vert.png" width="10%""><strong>Dernier diplôme obtenu :</strong> <span>DUT Informatique</span></li>
|
|
|
<li><img src="https://icones.pro/wp-content/uploads/2021/06/symbole-fleche-droite-vert.png" width="10%""><strong>Mail :</strong> <span>dorian.hodin@etu.uca.fr</span></li>
|
|
|
<li><img src="https://icones.pro/wp-content/uploads/2021/06/symbole-fleche-droite-vert.png" width="10%""><strong>Repo :</strong> <span>https://github.com/hodindorian</span></li>
|
|
|
</ul>
|
|
|
</div>
|
|
|
</div>
|
|
|
<p>
|
|
|
Adepte de réseau et de développement, je suis curieux de découvrir de nouvelle façon de programmer ainsi que de nouvelles technologies.
|
|
|
<br>
|
|
|
J'ai réalisé plusieurs projets en Flutter, et de nombreuses API en PHP Slim.
|
|
|
<br>
|
|
|
Je réalise un microservice en Spring Boot dans le cadre de mon alternance, ce qui me permet de développer mes capacités en Java.
|
|
|
</p>
|
|
|
</div>
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<div class="counts container">
|
|
|
|
|
|
<div class="row">
|
|
|
|
|
|
<div class="col-lg-3 col-md-6">
|
|
|
<div class="count-box">
|
|
|
<p>Heures de projets réalisées :</p>
|
|
|
<span data-purecounter-start="0" data-purecounter-end="270" data-purecounter-duration="1" class="purecounter"></span>
|
|
|
<p>heures</p>
|
|
|
</div>
|
|
|
</div>
|
|
|
|
|
|
<div class="col-lg-3 col-md-6 mt-5 mt-md-0">
|
|
|
<div class="count-box">
|
|
|
<p>Plus de </p>
|
|
|
<span data-purecounter-start="0" data-purecounter-end="10" data-purecounter-duration="1" class="purecounter"></span>
|
|
|
<p>languages connus</p>
|
|
|
|
|
|
</div>
|
|
|
</div>
|
|
|
|
|
|
<div class="col-lg-3 col-md-6 mt-5 mt-lg-0">
|
|
|
<div class="count-box">
|
|
|
<p>Commits réalisés : </p>
|
|
|
<span data-purecounter-start="0" data-purecounter-end="853" data-purecounter-duration="1" class="purecounter"></span>
|
|
|
<p>ces 12 derniers mois</p>
|
|
|
</div>
|
|
|
</div>
|
|
|
|
|
|
<div class="col-lg-3 col-md-6 mt-5 mt-lg-0">
|
|
|
<div class="count-box">
|
|
|
<p>Utilisation de linux depuis</p>
|
|
|
<span data-purecounter-start="0" data-purecounter-end="3" data-purecounter-duration="1" class="purecounter"></span>
|
|
|
<p>années</p>
|
|
|
</div>
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
</section>
|
|
|
|
|
|
<section id="experience" class="experience">
|
|
|
<div class="container">
|
|
|
<div class="section-title">
|
|
|
<h2>Experiences :</h2>
|
|
|
</div>
|
|
|
<div class="container experience">
|
|
|
<img src="./assets/img/timeline.png" class="timeline-img" width="15%">
|
|
|
|
|
|
<div class="experience-item" data-info="Mon premier travail d'été, j'ai pu découvrir le monde de l'entreprise et les relations clients. J'ai eu beaucoup de mal au début à réussir à aller voir les clients, mais au final je me suis vite adapté, mon patron était satisfait de mon travail et j'ai été content de pouvoir améliorer mes relations sociales et mon sens de l'organisation.">
|
|
|
<h2>Juillet 2022</h2>
|
|
|
<p>Conseiller clientèle chez Sarl Top Modèle, Lozanne, 69380</p>
|
|
|
<ul>
|
|
|
<li>Vente, caisse</li>
|
|
|
<li>Travail dans une équipe</li>
|
|
|
<li>Réception et tri de la réserve</li>
|
|
|
</ul>
|
|
|
<div class="more-info"></div>
|
|
|
</div>
|
|
|
|
|
|
<div class="experience-item" data-info="Premier stage dans le cadre de mon BUT de deuxième année, et première fois dans une entreprise informatique. J'ai eu une très bonne équipe lors de mon stage, j'ai donc vite été à l'aise et mon travail m'a beaucoup plus. J'ai même eu l'occasion de présenter ce que j'avais réalisé lors d'une réunion devant une dizaine de responsables Michelin.">
|
|
|
<h2>10 Avril - 16 Juin 2023</h2>
|
|
|
<p>Stage chez CGI pour Michelin</p>
|
|
|
<ul>
|
|
|
<li>Développement d'une application de gestion de flux monitoring</li>
|
|
|
<li>Écriture de nombreux scripts SQL avec Oracle, utilisation de SQL developer</li>
|
|
|
<li>Utilisation de Splunk</li>
|
|
|
</ul>
|
|
|
<div class="more-info"></div>
|
|
|
</div>
|
|
|
|
|
|
<div class="experience-item" data-info="Après mon stage, CGI m'a proposé une alternance pour suivre ma troisième année de BUT Informatique. J'ai encore une fois eu une équipe formidable, et j'ai l'occasion de développer mes capacités de développement grâce à une organisation au sein de l'équipe assez stricte, mais c'est aussi l'occasion de développer des compétences de management et d'organisation plus poussée."> >
|
|
|
<h2>Septembre 2023 - Aout 2024</h2>
|
|
|
<p>Alternance chez CGI pour Michelin</p>
|
|
|
<ul>
|
|
|
<li>Développement de services pour permettre la réalisation de tests sur l’outil Kafka</li>
|
|
|
<li>Création de Dashboard Grafana pour extraire les erreurs présentes dans les logs</li>
|
|
|
<li>Création de micro-services SpringBoot (langage Java)</li>
|
|
|
<li>Création et configuration d’un serveur Kafka et d’un outil AKHQ avec Docker</li>
|
|
|
</ul>
|
|
|
<div class="more-info"></div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</section>
|
|
|
|
|
|
<section id="competence" class="competence">
|
|
|
<div class="skills container">
|
|
|
<div class="section-title">
|
|
|
<h2>Compétences :</h2>
|
|
|
</div>
|
|
|
Voici mes différentes Compétences ainsi que leur niveau de maîtrise :
|
|
|
<div class="row skills-content">
|
|
|
<div class="col-lg-6">
|
|
|
<div class="progress">
|
|
|
<span class="skill">PHP <i class="val">70%</i></span>
|
|
|
<div class="progress-bar-wrap">
|
|
|
<div class="progress-bar" role="progressbar" aria-valuenow="70" aria-valuemin="0" aria-valuemax="100"></div>
|
|
|
</div>
|
|
|
</div>
|
|
|
<br>
|
|
|
<div class="progress">
|
|
|
<span class="skill">PHP Slim <i class="val">80%</i></span>
|
|
|
<div class="progress-bar-wrap">
|
|
|
<div class="progress-bar" role="progressbar" aria-valuenow="80" aria-valuemin="0" aria-valuemax="100"></div>
|
|
|
</div>
|
|
|
</div>
|
|
|
<br>
|
|
|
<div class="progress">
|
|
|
<span class="skill">Java <i class="val">30%</i></span>
|
|
|
<div class="progress-bar-wrap">
|
|
|
<div class="progress-bar" role="progressbar" aria-valuenow="30" aria-valuemin="0" aria-valuemax="100"></div>
|
|
|
</div>
|
|
|
</div>
|
|
|
<br>
|
|
|
<div class="progress">
|
|
|
<span class="skill">SpringBoot 3<i class="val">75%</i></span>
|
|
|
<div class="progress-bar-wrap">
|
|
|
<div class="progress-bar" role="progressbar" aria-valuenow="75" aria-valuemin="0" aria-valuemax="100"></div>
|
|
|
</div>
|
|
|
</div>
|
|
|
<br>
|
|
|
<div class="progress">
|
|
|
<span class="skill">Flutter <i class="val">70%</i></span>
|
|
|
<div class="progress-bar-wrap">
|
|
|
<div class="progress-bar" role="progressbar" aria-valuenow="70" aria-valuemin="0" aria-valuemax="100"></div>
|
|
|
</div>
|
|
|
</div>
|
|
|
<br>
|
|
|
<div class="progress">
|
|
|
<span class="skill">Dart <i class="val">60%</i></span>
|
|
|
<div class="progress-bar-wrap">
|
|
|
<div class="progress-bar" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100"></div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="col-lg-6">
|
|
|
<div class="progress">
|
|
|
<span class="skill">Socket IO (Javascript) <i class="val">60%</i></span>
|
|
|
<div class="progress-bar-wrap">
|
|
|
<div class="progress-bar" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100"></div>
|
|
|
</div>
|
|
|
</div>
|
|
|
<br>
|
|
|
<div class="progress">
|
|
|
<span class="skill">Réseau (Reverse proxy, organisation d'un serveur) <i class="val">70%</i></span>
|
|
|
<div class="progress-bar-wrap">
|
|
|
<div class="progress-bar" role="progressbar" aria-valuenow="70" aria-valuemin="0" aria-valuemax="100"></div>
|
|
|
</div>
|
|
|
</div>
|
|
|
<br>
|
|
|
<div class="progress">
|
|
|
<span class="skill">Git <i class="val">70%</i></span>
|
|
|
<div class="progress-bar-wrap">
|
|
|
<div class="progress-bar" role="progressbar" aria-valuenow="70" aria-valuemin="0" aria-valuemax="100"></div>
|
|
|
</div>
|
|
|
</div>
|
|
|
<br>
|
|
|
<div class="progress">
|
|
|
<span class="skill">Teams <i class="val">75%</i></span>
|
|
|
<div class="progress-bar-wrap">
|
|
|
<div class="progress-bar" role="progressbar" aria-valuenow="75" aria-valuemin="0" aria-valuemax="100"></div>
|
|
|
</div>
|
|
|
</div>
|
|
|
<br>
|
|
|
<div class="progress">
|
|
|
<span class="skill">HTML <i class="val">55%</i></span>
|
|
|
<div class="progress-bar-wrap">
|
|
|
<div class="progress-bar" role="progressbar" aria-valuenow="55" aria-valuemin="0" aria-valuemax="100"></div>
|
|
|
</div>
|
|
|
</div>
|
|
|
<br>
|
|
|
<div class="progress">
|
|
|
<span class="skill">CSS <i class="val">35%</i></span>
|
|
|
<div class="progress-bar-wrap">
|
|
|
<div class="progress-bar" role="progressbar" aria-valuenow="35" aria-valuemin="0" aria-valuemax="100"></div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</section>
|
|
|
|
|
|
<section id="projects" class="projects">
|
|
|
<div class="container projectContainer">
|
|
|
<div class="section-title">
|
|
|
<h2>Mes projets :</h2>
|
|
|
</div>
|
|
|
<div class="project">
|
|
|
<a href="projetcs/dafl.html" target="_blank">
|
|
|
<img src="assets/img/dafl/dafl.png" alt="DAFL Music" width="100%">
|
|
|
</a>
|
|
|
</div>
|
|
|
<div class="project">
|
|
|
<a href="projetcs/temoignages.html" target="_blank">
|
|
|
<img src="assets/img/temoignage/temoignages.png" alt="Temoignages" width="100%">
|
|
|
</a>
|
|
|
</div>
|
|
|
<div class="project">
|
|
|
<a href="projetcs/fantomgames.html" target="_blank">
|
|
|
<img src="assets/img/fantomgames/fantomgames.png" alt="Fantom Games" width="100%">
|
|
|
</a>
|
|
|
</div>
|
|
|
</div>
|
|
|
</section>
|
|
|
|
|
|
<section id="perso" class="perso">
|
|
|
<div class="interests container">
|
|
|
<div class="section-title">
|
|
|
<h2>Intérêt personnel</h2>
|
|
|
</div>
|
|
|
<div class="row">
|
|
|
<div class="container_perso">
|
|
|
<div class="activity">
|
|
|
<img src="https://images.pexels.com/photos/586415/pexels-photo-586415.jpeg" width="100%" height="200%" style="float: left; margin-right: 10px;">
|
|
|
<h1 style="float: left;">Piano</h1>
|
|
|
<p style="float: left;">Ma grand-mère m'as appris le piano quand j'était en primaire, et j'ai repris en autodidacte depuis 5 ans</p>
|
|
|
</div>
|
|
|
<div class="activity">
|
|
|
<img src="https://c4.wallpaperflare.com/wallpaper/49/843/630/guitar-wallpaper-preview.jpg" width="100%" height="200%" style="float: left; margin-right: 10px;">
|
|
|
<h1 style="float: left;">Guitare</h1>
|
|
|
<p style="float: left;">J'ai récemment commencé à apprendre la guitare pour pouvoir m'accompagner au piano</p>
|
|
|
</div>
|
|
|
<div class="activity">
|
|
|
<img src="https://4kwallpapers.com/images/wallpapers/boxing-gloves-dark-2560x2560-15486.jpg" width="100%" height="200%" style="float: left; margin-right: 10px;">
|
|
|
<h1 style="float: left;">Boxe</h1>
|
|
|
<p style="float: left;">Un coach à ma salle de sport m'as initié à la boxe thaï et anglaise avec un sac de frappe</p>
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="container_perso">
|
|
|
<div class="activity">
|
|
|
<img src="https://img.freepik.com/free-photo/3d-gym-equipment_23-2151114193.jpg" width="100%" height="200%" style="float: left; margin-right: 10px;">
|
|
|
<h1 style="float: left;">Musculation</h1>
|
|
|
<p style="float: left;">Je me suis inscrit à la salle de sport il y a 3 ans après avoir déménagé à Clermont-Ferrand</p>
|
|
|
</div>
|
|
|
<div class="activity">
|
|
|
<img src="https://i.pinimg.com/736x/04/6a/35/046a35b2b4c2cdbc2e462bcb84e2eab9.jpg" width="100%" height="200%" style="float: left; margin-right: 10px;">
|
|
|
<h1 style="float: left;">Course à pied</h1>
|
|
|
<p style="float: left;">J'ai commencé à m'entraîner pour réaliser le Marathon des Pyus à Clermont-Ferrand en octobre 2024</p>
|
|
|
</div>
|
|
|
<div class="activity">
|
|
|
<img src="https://www.fubiz.net/wp-content/uploads/2016/03/bwemptycinemas1-900x698.jpg" width="100%" height="200%" style="float: left; margin-right: 10px;">
|
|
|
<h1 style="float: left;">Cinéma</h1>
|
|
|
<p style="float: left;">Cinéphile grâce à ma soeur et mes parents, je continue d'aller régulierement au cinéma</p>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</section>
|
|
|
|
|
|
<script src="assets/js/bootstrap-js/purecounter_vanilla.js"></script>
|
|
|
<script src="assets/js/bootstrap-js/glightbox.min.js"></script>
|
|
|
<script src="assets/js/bootstrap-js/swiper-bundle.min.js"></script>
|
|
|
<script src="assets/js/bootstrap-js/noframework.waypoints.js"></script>
|
|
|
<script src="assets/js/main.js"></script>
|
|
|
<script>
|
|
|
if (!window.location.href.endsWith('/')) {
|
|
|
window.location.href = window.location.href + '/';
|
|
|
}
|
|
|
</script>
|
|
|
|
|
|
</body>
|
|
|
</html> |
