You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
405 lines
18 KiB
405 lines
18 KiB
<!DOCTYPE HTML>
|
|
<html>
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
|
<title>Portfolio Parant Louison</title>
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
<meta name="description" content="" />
|
|
<meta name="keywords" content="" />
|
|
<meta name="author" content="" />
|
|
|
|
<!-- Facebook and Twitter integration -->
|
|
<meta property="og:title" content=""/>
|
|
<meta property="og:image" content=""/>
|
|
<meta property="og:url" content=""/>
|
|
<meta property="og:site_name" content=""/>
|
|
<meta property="og:description" content=""/>
|
|
<meta name="twitter:title" content="" />
|
|
<meta name="twitter:image" content="" />
|
|
<meta name="twitter:url" content="" />
|
|
<meta name="twitter:card" content="" />
|
|
|
|
<!-- Place favicon.ico and apple-touch-icon.png in the root directory -->
|
|
<link rel="shortcut icon" href="favicon.ico">
|
|
|
|
<link href="https://fonts.googleapis.com/css?family=Quicksand:300,400,500,700" rel="stylesheet">
|
|
<link href="https://fonts.googleapis.com/css?family=Playfair+Display:400,400i,700" rel="stylesheet">
|
|
|
|
<!-- Animate.css -->
|
|
<link rel="stylesheet" href="css/animate.css">
|
|
<!-- Icomoon Icon Fonts-->
|
|
<link rel="stylesheet" href="css/icomoon.css">
|
|
<!-- Bootstrap -->
|
|
<link rel="stylesheet" href="css/bootstrap.css">
|
|
<!-- Flexslider -->
|
|
<link rel="stylesheet" href="css/flexslider.css">
|
|
<!-- Flaticons -->
|
|
<link rel="stylesheet" href="fonts/flaticon/font/flaticon.css">
|
|
<!-- Owl Carousel -->
|
|
<link rel="stylesheet" href="css/owl.carousel.min.css">
|
|
<link rel="stylesheet" href="css/owl.theme.default.min.css">
|
|
<!-- Theme style -->
|
|
<link rel="stylesheet" href="css/style.css">
|
|
|
|
<!-- Modernizr JS -->
|
|
<script src="js/modernizr-2.6.2.min.js"></script>
|
|
<!-- FOR IE9 below -->
|
|
<!--[if lt IE 9]>
|
|
<script src="js/respond.min.js"></script>
|
|
<![endif]-->
|
|
|
|
</head>
|
|
<body>
|
|
<div id="colorlib-page">
|
|
<div class="container-wrap">
|
|
<a href="#" class="js-colorlib-nav-toggle colorlib-nav-toggle" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar"><i></i></a>
|
|
<aside id="colorlib-aside" role="complementary" class="border js-fullheight">
|
|
<div class="text-center">
|
|
<div class="author-img" style="background-image: url(images/about.jpg);"></div>
|
|
<h1 id="colorlib-logo"><a href="index.html">Louison Parant</a></h1>
|
|
<span class="position"><a href="#">Développeur Mobile</a></span>
|
|
</div>
|
|
<nav id="colorlib-main-menu" role="navigation" class="navbar">
|
|
<div id="navbar" class="collapse">
|
|
<ul>
|
|
<li class="active"><a href="#" data-nav-section="home">Présentation</a></li>
|
|
<li><a href="#" data-nav-section="about">À propos de moi</a></li>
|
|
<li><a href="#" data-nav-section="skills">Compétences</a></li>
|
|
<li><a href="#" data-nav-section="education">Éducation</a></li>
|
|
<li><a href="#" data-nav-section="experience">Expérience</a></li>
|
|
<li><a href="#" data-nav-section="contact">Contact</a></li>
|
|
</ul>
|
|
</div>
|
|
</nav>
|
|
</aside>
|
|
|
|
<div id="colorlib-main">
|
|
<section id="colorlib-hero" class="js-fullheight" data-section="home">
|
|
<div class="flexslider js-fullheight">
|
|
<ul class="slides">
|
|
<li style="background-image: url(images/img_bg_1.jpg);">
|
|
<div class="overlay"></div>
|
|
<div class="container-fluid">
|
|
<div class="row">
|
|
<div class="col-md-6 col-md-offset-3 col-md-pull-3 col-sm-12 col-xs-12 js-fullheight slider-text">
|
|
<div class="slider-text-inner js-fullheight">
|
|
<div class="desc">
|
|
<h1>Bonjour,<br>je m'appelle Louison</h1>
|
|
<h2>Je suis un développeur informatique.</h2>
|
|
<p><a href="images/CV_Louison_Parant.pdf" class="btn btn-primary btn-learn">Voir mon CV <i class="icon-download4"></i></a></p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</section>
|
|
|
|
<section class="colorlib-about" data-section="about">
|
|
<div class="colorlib-narrow-content">
|
|
<div class="row">
|
|
<div class="col-md-12">
|
|
<div class="row row-bottom-padded-sm animate-box" data-animate-effect="fadeInLeft">
|
|
<div class="col-md-12">
|
|
<div class="about-desc">
|
|
<span class="heading-meta">À propos de moi</span>
|
|
<h2 class="colorlib-heading">Qui suis-je ?</h2>
|
|
<p><strong>Bonjour, je suis Louison Parant</strong>. Je suis étudiant en 3ème année de BUT Informatique. J'ai choisi la coloration mobile mais j'ai également pu développer mes compétences en web lors de mon stage de 3ème année en tant que <strong>développeur full-stack</strong>.</p>
|
|
<p>J'ai aussi effectué un <strong>stage en Angleterre</strong> lors de ma 2ème année où j'ai travaillé sur des IA en réseaux neuronaux. Celles-ci étaient destinées à contrôler des véhicules autonomes.</p>
|
|
<p>Ces deux stages m'ont permis de <strong>mettre en oeuvre mes compétences théoriques</strong> dans des conditions professionnelles mais également de mieux cibler ce que je souhaite faire en informatique.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="row">
|
|
<div class="col-md-3 animate-box" data-animate-effect="fadeInLeft">
|
|
<div class="services color-1">
|
|
<span class="icon2"><i class="icon-bulb"></i></span>
|
|
<h3>Intelligence Artificielle</h3>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-3 animate-box" data-animate-effect="fadeInRight">
|
|
<div class="services color-2">
|
|
<span class="icon2"><i class="icon-globe-outline"></i></span>
|
|
<h3>Web <br>Service</h3>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-3 animate-box" data-animate-effect="fadeInTop">
|
|
<div class="services color-3">
|
|
<span class="icon2"><i class="icon-data"></i></span>
|
|
<h3>Base de <br>Données</h3>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-3 animate-box" data-animate-effect="fadeInBottom">
|
|
<div class="services color-4">
|
|
<span class="icon2"><i class="icon-phone3"></i></span>
|
|
<h3>Application mobile</h3>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="row row-bottom-padded-sm animate-box" data-animate-effect="fadeInLeft">
|
|
<div class="col-md-12">
|
|
<div class="about-desc">
|
|
<h2 class="colorlib-heading">Ce que j'aime ?</h2>
|
|
<p>J'adore passer mon temps libre à faire du sport. Je pratique le <strong>cyclisme</strong> depuis 5 ans, sport que j'ai adopté après avoir fait 12 années de judo. Quand je ne fais pas du sport, j'en regarde. Que ce soit cyclisme, rugby, foot, basket, athlétisme, MMA, ... presque tous les sports me passionnent et m'intéressent. <br> J'aime également passer du temps sur les <strong>jeux vidéos</strong>. Des jeux de gestion, aux jeux de tir en passant par les jeux de refléxion, encore une fois, presque tous les styles de jeux m'amusent et me divertissent.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<section class="colorlib-skills" data-section="skills">
|
|
<div class="colorlib-narrow-content">
|
|
<div class="row">
|
|
<div class="col-md-6 col-md-offset-3 col-md-pull-3 animate-box" data-animate-effect="fadeInLeft">
|
|
<span class="heading-meta">Compétences</span>
|
|
<h2 class="colorlib-heading animate-box">Mes spécialités</h2>
|
|
</div>
|
|
</div>
|
|
<div class="row">
|
|
<div class="col-md-12 animate-box" data-animate-effect="fadeInLeft">
|
|
<p>Au cours de mon cursus, j'ai pu développer à la fois mes soft skills et mes compétences techniques. J'ai ensuite eu la chance de pouvoir les mettre en oeuvre lors de mes expériences professionnelles.</p>
|
|
</div>
|
|
<div class="col-md-6 animate-box" data-animate-effect="fadeInLeft">
|
|
<div class="progress-wrap">
|
|
<h3>PostgreSQL</h3>
|
|
<div class="progress">
|
|
<div class="progress-bar color-1" role="progressbar" aria-valuenow="90"
|
|
aria-valuemin="0" aria-valuemax="100" style="width:90%">
|
|
<span>90%</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-6 animate-box" data-animate-effect="fadeInRight">
|
|
<div class="progress-wrap">
|
|
<h3>Git</h3>
|
|
<div class="progress">
|
|
<div class="progress-bar color-2" role="progressbar" aria-valuenow="50"
|
|
aria-valuemin="0" aria-valuemax="100" style="width:50%">
|
|
<span>50%</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-6 animate-box" data-animate-effect="fadeInLeft">
|
|
<div class="progress-wrap">
|
|
<h3>Javascript</h3>
|
|
<div class="progress">
|
|
<div class="progress-bar color-3" role="progressbar" aria-valuenow="70"
|
|
aria-valuemin="0" aria-valuemax="100" style="width:70%">
|
|
<span>70%</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-6 animate-box" data-animate-effect="fadeInRight">
|
|
<div class="progress-wrap">
|
|
<h3>C++</h3>
|
|
<div class="progress">
|
|
<div class="progress-bar color-4" role="progressbar" aria-valuenow="40"
|
|
aria-valuemin="0" aria-valuemax="100" style="width:40%">
|
|
<span>40%</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-6 animate-box" data-animate-effect="fadeInLeft">
|
|
<div class="progress-wrap">
|
|
<h3>Python</h3>
|
|
<div class="progress">
|
|
<div class="progress-bar color-5" role="progressbar" aria-valuenow="75"
|
|
aria-valuemin="0" aria-valuemax="100" style="width:75%">
|
|
<span>75%</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-6 animate-box" data-animate-effect="fadeInRight">
|
|
<div class="progress-wrap">
|
|
<h3>Jira</h3>
|
|
<div class="progress">
|
|
<div class="progress-bar color-6" role="progressbar" aria-valuenow="70"
|
|
aria-valuemin="0" aria-valuemax="100" style="width:70%">
|
|
<span>70%</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<section class="colorlib-education" data-section="education">
|
|
<div class="colorlib-narrow-content">
|
|
<div class="row">
|
|
<div class="col-md-6 col-md-offset-3 col-md-pull-3 animate-box" data-animate-effect="fadeInLeft">
|
|
<span class="heading-meta">Éducation</span>
|
|
<h2 class="colorlib-heading animate-box">Mon Parcours</h2>
|
|
</div>
|
|
</div>
|
|
<div class="row">
|
|
<div class="col-md-12 animate-box" data-animate-effect="fadeInLeft">
|
|
<div class="fancy-collapse-panel">
|
|
<div class="panel-group" id="accordion" role="tablist" aria-multiselectable="true">
|
|
<div class="panel panel-default">
|
|
<div class="panel-heading" role="tab" id="headingOne">
|
|
<h4 class="panel-title">
|
|
<a data-toggle="collapse" data-parent="#accordion" href="#collapseOne" aria-expanded="true" aria-controls="collapseOne">BUT Informatique
|
|
</a>
|
|
</h4>
|
|
</div>
|
|
<div id="collapseOne" class="panel-collapse collapse in" role="tabpanel" aria-labelledby="headingOne">
|
|
<div class="panel-body">
|
|
<div class="row">
|
|
<div class="col-md-6">
|
|
<p>Trois années de cours théoriques avec la coloration <strong>mobile</strong>. Formation complète sur l'algorithmique, le développement d'application, l'optimisation des ressources et le gestion de projet.</p>
|
|
</div>
|
|
<div class="col-md-6">
|
|
<p>Deux stages dans le monde professionnel. <br>Le premier en Angleterre, en <strong>laboratoire de recherche</strong> à la NTU, portant sur les IA. <br>Le second, à La Montagne, journal principal du bassin auvergnat, en tant que <strong>développeur full-stack</strong>.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="panel panel-default">
|
|
<div class="panel-heading" role="tab" id="headingTwo">
|
|
<h4 class="panel-title">
|
|
<a class="collapsed" data-toggle="collapse" data-parent="#accordion" href="#collapseTwo" aria-expanded="false" aria-controls="collapseTwo">Diplôme du Baccalauréat, spécialités Mathématiques / Physique-Chimie
|
|
</a>
|
|
</h4>
|
|
</div>
|
|
<div id="collapseTwo" class="panel-collapse collapse" role="tabpanel" aria-labelledby="headingTwo">
|
|
<div class="panel-body">
|
|
<p>Trois années passées au Lycée Jeanne d'Arc à Clermont-Ferrand avec les spécialités <strong>NSI, Mathématiques et Physique-Chimie</strong> en 1ère ainsi que <strong>Mathématiques et Physique-Chimie</strong> en Terminale.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<section class="colorlib-experience" data-section="experience">
|
|
<div class="colorlib-narrow-content">
|
|
<div class="row">
|
|
<div class="col-md-6 col-md-offset-3 col-md-pull-3 animate-box" data-animate-effect="fadeInLeft">
|
|
<span class="heading-meta">Expérience</span>
|
|
<h2 class="colorlib-heading animate-box">Expériences Professionnelles</h2>
|
|
</div>
|
|
</div>
|
|
<div class="row">
|
|
<div class="col-md-12">
|
|
<div class="timeline-centered">
|
|
<article class="timeline-entry animate-box" data-animate-effect="fadeInLeft">
|
|
<div class="timeline-entry-inner">
|
|
|
|
<div class="timeline-icon color-1">
|
|
<i class="icon-pen2"></i>
|
|
</div>
|
|
|
|
<div class="timeline-label">
|
|
<h2><a href="#">Développeur Full-Stack</a> <span>2024</span></h2>
|
|
<p>Stage à La Montagne, journal auvergnat. Refonte du système d'accès aux parutions. Mise à jour du <strong>Web Service</strong> lié, codé en Javascript de manière réactive. Création d'un <strong>nouveau schéma de la base de données</strong>. Migration de la base de données de production pour appliquer le nouveau schéma. Création d'une <strong>interface back-office</strong> permettant la gestion manuelle du Web Service pour le Support Informatique.</p>
|
|
</div>
|
|
</div>
|
|
</article>
|
|
|
|
<article class="timeline-entry animate-box" data-animate-effect="fadeInRight">
|
|
<div class="timeline-entry-inner">
|
|
<div class="timeline-icon color-2">
|
|
<i class="icon-pen2"></i>
|
|
</div>
|
|
<div class="timeline-label">
|
|
<h2><a href="#">Chercheur en IA</a> <span>2023</span></h2>
|
|
<p>Stage à la Nottingham Trent University, en laboratoire de recherche. Adaptation d'une IA en réseau neuronal et son analyse afin de l'intégrer à un <strong>véhicule autonome</strong>. Mise en place de points de contrôle à l'intérieur du réseau neuronal permettant la <strong>supervision humaine des décisions de l'IA</strong>.</p>
|
|
</div>
|
|
</div>
|
|
</article>
|
|
|
|
<article class="timeline-entry begin animate-box" data-animate-effect="fadeInBottom">
|
|
<div class="timeline-entry-inner">
|
|
<div class="timeline-icon color-none">
|
|
</div>
|
|
</div>
|
|
</article>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<section class="colorlib-contact" data-section="contact">
|
|
<div class="colorlib-narrow-content">
|
|
<div class="row">
|
|
<div class="col-md-6 col-md-offset-3 col-md-pull-3 animate-box" data-animate-effect="fadeInLeft">
|
|
<span class="heading-meta">Contact</span>
|
|
<h2 class="colorlib-heading">Mes Informations</h2>
|
|
</div>
|
|
</div>
|
|
<div class="row">
|
|
<div class="col-md-5">
|
|
<div class="colorlib-feature colorlib-feature-sm animate-box" data-animate-effect="fadeInLeft">
|
|
<div class="colorlib-icon">
|
|
<i class="icon-globe-outline"></i>
|
|
</div>
|
|
<div class="colorlib-text">
|
|
<p>louison.parant@gmail.com</p>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="colorlib-feature colorlib-feature-sm animate-box" data-animate-effect="fadeInLeft">
|
|
<div class="colorlib-icon">
|
|
<i class="icon-map"></i>
|
|
</div>
|
|
<div class="colorlib-text">
|
|
<p>26 boulevard Panoramique, Clermont-Ferrand 63100, France</p>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="colorlib-feature colorlib-feature-sm animate-box" data-animate-effect="fadeInLeft">
|
|
<div class="colorlib-icon">
|
|
<i class="icon-phone"></i>
|
|
</div>
|
|
<div class="colorlib-text">
|
|
<p><a href="tel://">+33 6 38 05 43 46</a></p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
</div><!-- end:colorlib-main -->
|
|
</div><!-- end:container-wrap -->
|
|
</div><!-- end:colorlib-page -->
|
|
|
|
<!-- jQuery -->
|
|
<script src="js/jquery.min.js"></script>
|
|
<!-- jQuery Easing -->
|
|
<script src="js/jquery.easing.1.3.js"></script>
|
|
<!-- Bootstrap -->
|
|
<script src="js/bootstrap.min.js"></script>
|
|
<!-- Waypoints -->
|
|
<script src="js/jquery.waypoints.min.js"></script>
|
|
<!-- Flexslider -->
|
|
<script src="js/jquery.flexslider-min.js"></script>
|
|
<!-- Owl carousel -->
|
|
<script src="js/owl.carousel.min.js"></script>
|
|
<!-- Counters -->
|
|
<script src="js/jquery.countTo.js"></script>
|
|
|
|
|
|
<!-- MAIN JS -->
|
|
<script src="js/main.js"></script>
|
|
|
|
</body>
|
|
</html>
|
|
|