550 lines
24 KiB
HTML
550 lines
24 KiB
HTML
|
||
<!doctype html>
|
||
<html>
|
||
<head>
|
||
<meta charset="utf-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
<link rel="icon" type="image/png" href="img/favicon.ico"/>
|
||
<title>Nicolas Riault</title>
|
||
|
||
<!--------------------------------------CSS-------------------------------------->
|
||
<link href="css/libs/google-font.min.css" rel="stylesheet">
|
||
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.0.10/css/all.css"
|
||
integrity="sha384-+d0P83n9kaQMCwj8F4RJB66tzIwOKmrdb46+porD/OvrJ+37WqIM7UoBtwHO6Nlg" crossorigin="anonymous">
|
||
<link href="css/libs/flexboxgrid.css" rel="stylesheet">
|
||
<link href="css/libs/bootstrap.css" rel="stylesheet">
|
||
<link href="css/libs/owl.carousel.min.css" rel="stylesheet">
|
||
<link href="css/libs/owl.theme.default.min.css" rel="stylesheet">
|
||
<link href="css/styles.css" type="text/css" rel="stylesheet"/>
|
||
<link href="css/timeline.css" type="text/css" rel="stylesheet"/>
|
||
<!--------------------------------------JS-------------------------------------->
|
||
<script src="js/form.js"></script>
|
||
<script src="js/libs/jquery.min.js"></script>
|
||
</head>
|
||
|
||
<!--------------------------------------PRELOAD PAGE-------------------------------------->
|
||
|
||
<div id="preload-overlay">
|
||
<div class="loader-frame">
|
||
<div class="loader1" id="loader1"></div>
|
||
<div class="loader2" id="loader2"></div>
|
||
</div>
|
||
</div>
|
||
|
||
<body>
|
||
|
||
|
||
|
||
<!--------------------------------------HEADER-------------------------------------->
|
||
|
||
<header id="main-header">
|
||
<div class="header-wrapper">
|
||
<a class="logo" href="#">Nicolas</a>
|
||
|
||
<div class="mobile-toggle">
|
||
<span></span>
|
||
<span></span>
|
||
<span></span>
|
||
</div>
|
||
|
||
<nav>
|
||
<ul>
|
||
<!--Main nav to navigate to different parts of the page-->
|
||
<li><a id="hero-link" href="#hero">Accueil</a></li>
|
||
<li><a id="about-link" href="#about">À propos </a></li>
|
||
<li><a id="competences-link" href="#competences">Competences</a></li>
|
||
<li><a id="experiences-link" href="#experiences">Experiences</a></li>
|
||
<li><a id="projets-link" href="#projets">Projets</a></li>
|
||
<li><a id="contact-link" href="#contact">Contact</a></li>
|
||
</ul>
|
||
</nav>
|
||
</div>
|
||
</header>
|
||
|
||
<!--------------------------------------HERO IMAGE-------------------------------------->
|
||
|
||
|
||
<section id="hero">
|
||
<div id="particles-js">
|
||
<div class="row center-xs center-sm center-md center-lg middle-xs middle-sm middle-md middle-lg">
|
||
<div class="static col-xs-10 col-sm-10 col-md-10 col-lg-10">
|
||
<div class="hero-content">
|
||
<img src="img/profile-pic2.jpg">
|
||
<h1>Nicolas Riault</h1>
|
||
<h2 id="hero-text-animation"> Developeur Full Stack, Consultant IT</h2>
|
||
<button class="download"><a download href="downloads/example.txt">Télécharger mon CV</a></button>
|
||
<!--To add your file simply replace example.txt with whatever file you want-->
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!--------------------------------------ABOUT SECTION-------------------------------------->
|
||
|
||
<section id="about">
|
||
<div class="container">
|
||
<div class="row left-xs left-sm left-md left-lg">
|
||
<div class="col-xs-12 col-sm-12 col-md-6 col-lg-6">
|
||
<div class="about-text">
|
||
<h2>Bonjour, je m'appelle <span class="accent-text">Nicolas</span></h2>
|
||
<p>
|
||
Ouvert et curieux de caractère, je suis à l’aise dans la relation client et apprécie le travail
|
||
en équipe.
|
||
J’aime ce travail de développeur qui nécessite une capacité d’adaptation et d’écoute au service
|
||
d’un projet.
|
||
<br>
|
||
Du point de vue technique, je développe principalement en PHP, C#. Je suis également a l'aise
|
||
avec SQL Server et la solution MSBI.
|
||
<br>
|
||
Sur mon temps libre je travaille sur des projets personnels que j'autilise au quotidien en
|
||
utilisant de nouvelles technologies (AngularJs, Ionic ... ).
|
||
</p>
|
||
<ul class="about-social">
|
||
<!--Social icons for the about section-->
|
||
<!--These icons are font-awesome icons and more can be looked up at https://fontawesome.com/icons?d=gallery-->
|
||
<li><a href="http://www.google.com"><i class="fab fa-facebook-f"></i></a></li>
|
||
<!--Simply replace the google link with your social media link-->
|
||
<li><a href="http://www.google.com"><i class="fab fa-twitter"></i></a></li>
|
||
<li><a href="http://www.google.com"><i class="far fa-envelope"></i></a></li>
|
||
<li><a href="http://www.google.com"><i class="fab fa-google-plus-g"></i></a></li>
|
||
<li><a href="http://www.google.com"><i class="fab fa-youtube"></i></a></li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
<div class="col-xs-12 col-sm-12 col-md-6 col-lg-6">
|
||
<div class="about-resume">
|
||
<div class="education">
|
||
<h2>Cursus et certifications</h2>
|
||
<div class="eduction-block">
|
||
<h4>SQL Server 2014 Performance Tuning and Optimization</h4>
|
||
<p>2017 - IB Formation - Paris</p>
|
||
</div>
|
||
<div class="eduction-block">
|
||
<h4>Licence Professionelle logiciel libre et propriétaire</h4>
|
||
<p>2012 - UFR Des Sciences - Angers</p>
|
||
</div>
|
||
<div class="eduction-block">
|
||
<h4>BTS Informatique de Gestion</h4>
|
||
<p>2011 - Lycée Chevrollier - Angers</p>
|
||
</div>
|
||
<div class="eduction-block">
|
||
<h4>Lycée Notre Dame</h4>
|
||
<p>2009 - Baccalauréat Scientifique - La Flèche</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!--------------------------------------COMPETENCES SECTION-------------------------------------->
|
||
|
||
<section id="competences">
|
||
<div class="container">
|
||
<div class="section-title">
|
||
<h1>Mes <span class="accent-text">Compétences</span></h1>
|
||
</div>
|
||
<div class="row left-xs left-sm left-md left-lg">
|
||
<div class="col-xs-12 col-sm-12 col-md-6 col-lg-6">
|
||
<div class="about-resume">
|
||
<div class="skills">
|
||
<h2>Développement</h2>
|
||
|
||
<div class="skill-progress-container">
|
||
<p>PHP</p>
|
||
<div class="skill-bar">
|
||
<div class="bar-percent php">
|
||
<div class="inner-percent"></div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="skill-progress-container">
|
||
<p>Javascript</p>
|
||
<div class="skill-bar">
|
||
<div class="bar-percent php">
|
||
<div class="inner-percent"></div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="skill-progress-container">
|
||
<p>HTML / CSS</p>
|
||
<div class="skill-bar">
|
||
<div class="bar-percent html">
|
||
<div class="inner-percent"></div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="skill-progress-container">
|
||
<p>.NET / C#</p>
|
||
<div class="skill-bar">
|
||
<div class="bar-percent net">
|
||
<div class="inner-percent"></div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-xs-12 col-sm-12 col-md-6 col-lg-6">
|
||
<div class="about-resume">
|
||
<div class="skills">
|
||
<h2>SGBD / Business intelligence</h2>
|
||
|
||
<div class="skill-progress-container">
|
||
<p>SQL Server</p>
|
||
<div class="skill-bar">
|
||
<div class="bar-percent php">
|
||
<div class="inner-percent"></div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="skill-progress-container">
|
||
<p>Microsoft BI</p>
|
||
<div class="skill-bar">
|
||
<div class="bar-percent msbi">
|
||
<div class="inner-percent"></div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="skill-progress-container">
|
||
<p>MySQL</p>
|
||
<div class="skill-bar">
|
||
<div class="bar-percent mysql">
|
||
<div class="inner-percent"></div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="skill-progress-container">
|
||
<p>PostgreSQL</p>
|
||
<div class="skill-bar">
|
||
<div class="bar-percent postgresql">
|
||
<div class="inner-percent"></div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="row left-xs left-sm left-md left-lg">
|
||
|
||
<div class="col-xs-12 col-sm-12 col-md-6 col-lg-6">
|
||
<div class="about-resume">
|
||
<div class="skills">
|
||
<h2>Autres</h2>
|
||
|
||
<div class="skill-progress-container">
|
||
<p>MongoDb / CassandraDb</p>
|
||
<div class="skill-bar">
|
||
<div class="bar-percent msbi">
|
||
<div class="inner-percent"></div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="skill-progress-container">
|
||
<p>Python</p>
|
||
<div class="skill-bar">
|
||
<div class="bar-percent msbi">
|
||
<div class="inner-percent"></div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="skill-progress-container">
|
||
<p>NodeJs</p>
|
||
<div class="skill-bar">
|
||
<div class="bar-percent mysql">
|
||
<div class="inner-percent"></div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="skill-progress-container">
|
||
<p>AngularJS</p>
|
||
<div class="skill-bar">
|
||
<div class="bar-percent mysql">
|
||
<div class="inner-percent"></div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="skill-progress-container">
|
||
<p>Ionic Framework</p>
|
||
<div class="skill-bar">
|
||
<div class="bar-percent postgresql">
|
||
<div class="inner-percent"></div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!--------------------------------------EXPERIENCES SECTION-------------------------------------->
|
||
|
||
<section id="experiences" class="timeline">
|
||
<div class="container">
|
||
<div class="section-title">
|
||
<h1>Mes <span class="accent-text">Experiences</span></h1>
|
||
</div>
|
||
<div class="timeline-item">
|
||
<div class="timeline-img"></div>
|
||
<div class="timeline-content js--fadeInLeft">
|
||
<h3>Développeur Full Stack - Serveurcom</h3>
|
||
<div class="date">12/2015 - Actuel</div>
|
||
<p>
|
||
Maintenance évolutive d'une application de facturation pour les télécoms.
|
||
<br>
|
||
Macro gestion de l'équipe de développement.
|
||
<br>
|
||
Formation Microsoft 55144B.
|
||
</p>
|
||
<a class="bnt-more" onclick="launchModale('#modalServeurcom')">Détail</a>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="timeline-item">
|
||
<div class="timeline-img"></div>
|
||
<div class="timeline-content js--fadeInRight">
|
||
<h3>Consultant SI - Capgémini</h3>
|
||
<div class="date">02/2013 - 11/2015</div>
|
||
<p>
|
||
Développeur référent pour une TMA pour le groupe La Poste.
|
||
<br>
|
||
<small><i>PHP(CakePhp), MSBI/Asp.NET ( SSAS, SSRS, SSIS)</i></small>
|
||
<br>
|
||
TMA pour le ministère des sports.
|
||
<br>
|
||
<small><i>.NET/MSBI</i></small>
|
||
<br>
|
||
TMA pour l'Agence nationale de la recherche.
|
||
<br>
|
||
<small><i>C#, ASP, Sharepoint</i></small>
|
||
<br>
|
||
</p>
|
||
<a class="bnt-more" onclick="launchModale('#modalCapgemini')">Détail</a>
|
||
|
||
|
||
</div>
|
||
|
||
</div>
|
||
|
||
<div class="timeline-item">
|
||
<div class="timeline-img"></div>
|
||
<div class="timeline-content js--fadeInLeft">
|
||
<div class="date">04/2012 - 11/2012</div>
|
||
<h3>Développeur - INRA</h3>
|
||
<p>
|
||
Développement d'une application web pour informatiser le métier des chercheurs.
|
||
<br>
|
||
<small><i>Qooxdoo, Python, PostgreSQL</i></small>
|
||
</p>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="timeline-item">
|
||
<div class="timeline-img"></div>
|
||
<div class="timeline-content js--fadeInRight">
|
||
<h3>Développeur Web - Archimède</h3>
|
||
<div class="date">06/2011 - 07/2011</div>
|
||
<p>Developpement d'un site vitrine sous Joomla</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!--------------------------------------ENGAGEMENT SECTION-------------------------------------->
|
||
<!--------------------------------------PROJETS PERSONELS SECTION-------------------------------------->
|
||
<section id="projets">
|
||
<div class="container">
|
||
<div class="section-title">
|
||
<h1>Mes projets <span class="accent-text">Personels</span></h1>
|
||
</div>
|
||
|
||
|
||
<div class="row center-xs center-sm center-md center-lg">
|
||
<div class="col-xs-12 col-sm-12 col-md-12 col-lg-12">
|
||
|
||
<div id="carousel-projets" class="carousel slide" data-ride="carousel">
|
||
<!-- Indicators -->
|
||
<ul class="carousel-indicators">
|
||
<li data-target="#carousel-projets" data-slide-to="0" class="active"></li>
|
||
<li data-target="#carousel-projets" data-slide-to="1"></li>
|
||
<li data-target="#carousel-projets" data-slide-to="2"></li>
|
||
</ul>
|
||
|
||
<!-- The slideshow -->
|
||
<div class="carousel-inner">
|
||
<div class="carousel-item active">
|
||
<img src="img/illust_TimeLaps.JPG">
|
||
<div class="carousel-caption d-none d-md-block">
|
||
<h5>TimeLaps</h5>
|
||
<p>
|
||
Application de gestion de relai de course d'endurance.
|
||
Permet entre autre de gérer les relais, le panneautage, l'autonomie et la durée dans les stands.
|
||
</p>
|
||
</div>
|
||
</div>
|
||
<div class="carousel-item">
|
||
<img src="img/illust_VaultMeUp.JPG">
|
||
<div class="carousel-caption d-none d-md-block">
|
||
<h5>VaultMeUp</h5>
|
||
<p>
|
||
Application permettant de générer un mot de passe complèxe à partir d'une url et d'une clé de génération (Mot de passe qu'on utilise régulièrement).
|
||
Le mot de passe généré est unique pour chaque couple url/clé ce qui permet de retrouver le mot de passe d'origine en cas d'oubli.
|
||
</p>
|
||
<a class="btn btn-outline-light" href="/vault" target="_blank">Ouvrir l'application</a>
|
||
</div>
|
||
</div>
|
||
<div class="carousel-item">
|
||
<img src="img/illust_FlatWeather.JPG">
|
||
<div class="carousel-caption d-none d-md-block">
|
||
<h5>FlatWeather</h5>
|
||
<p>
|
||
Application mobile permetant d'obtenir la météo de de manière géolocalisée, à la demande et via carte.
|
||
Cette application à été réalisée pour monter en compétence sur IonicFramefork et AngularJs.
|
||
</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Left and right controls -->
|
||
<a class="carousel-control-prev hover-dark" href="#carousel-projets" data-slide="prev">
|
||
<i class="fas fa-2x fa-chevron-left hover-dark"></i>
|
||
</a>
|
||
<a class="carousel-control-next hover-dark" href="#carousel-projets" data-slide="next">
|
||
<i class="fas fa-2x fa-chevron-right "></i>
|
||
</a>
|
||
|
||
</div>
|
||
|
||
</div>
|
||
</div>
|
||
</section>
|
||
<!--------------------------------------CONTACT SECTION-------------------------------------->
|
||
|
||
<section id="contact">
|
||
<div class="container">
|
||
<div class="section-title">
|
||
<h1>Contactez <span class="accent-text">Moi</span></h1>
|
||
</div>
|
||
|
||
<div class="row center-xs center-sm center-md center-lg">
|
||
<div class="col-xs-6 col-sm-6 col-md-6 col-lg-6">
|
||
<div class="contact-info">
|
||
<div class="contact-block">
|
||
<i class="fas fa-mobile-alt"></i>
|
||
<div class="contact-text">
|
||
<p>Numéro :</p>
|
||
<p>0637290170</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="col-xs-6 col-sm-6 col-md-6 col-lg-6">
|
||
<div class="contact-block">
|
||
<i class="far fa-envelope"></i>
|
||
<div class="contact-text">
|
||
<p>Email : </p>
|
||
<p></p>
|
||
<p><a href="mailto:nicolas.riault@gmail.com">nicolas.riault@gmail.com</a></p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!--------------------------------------MODALES LIST-------------------------------------->
|
||
<div class="modal fade" id="modalServeurcom" tabindex="-1" role="dialog">
|
||
<div class="modal-dialog" role="document">
|
||
<div class="modal-content">
|
||
<div class="modal-header">
|
||
<h5 class="modal-title">Développeur Full Stack - Serveurcom</h5>
|
||
</div>
|
||
<div class="modal-body">
|
||
<p>
|
||
Reprise en interne puis maintenance évolutive d'une application de facturation
|
||
Télécom développée par un prestataire externe.<br>
|
||
Développements de plusieurs briques dont une refonte visuelle complète de
|
||
l'application et la création de tableaux de bords complets dans le but de suivre
|
||
l'activité de l'entreprise mais aussi permettre aux revendeurs de suivre leur
|
||
activité.<br>
|
||
Responsable de la tenue des performances et de l'optimisation des traitements de
|
||
facturation sous SQL Server 2014.<br>
|
||
Rédaction de spécifications fonctionnelles pour les évolutions, définition de
|
||
roadmap pour planifier les besoins, macro gestion de l'équipe de développeurs et
|
||
organisation de daily meetings pour gérer l’activité de l'équipe de développement.<br>
|
||
Mise en place de JIRA pour gérer les taches de l'équipe.<br>
|
||
<br>
|
||
Formation Microsoft 55144B : "SQL Server 2014 Performance Tuning and
|
||
Optimization"
|
||
</p>
|
||
</div>
|
||
<div class="modal-footer">
|
||
<button type="button" class="btn btn-secondary" data-dismiss="modal">Fermer</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="modal fade" id="modalCapgemini" tabindex="-1" role="dialog">
|
||
<div class="modal-dialog" role="document">
|
||
<div class="modal-content">
|
||
<div class="modal-header">
|
||
<h5 class="modal-title">Consultant SI - Capgémini</h5>
|
||
</div>
|
||
<div class="modal-body">
|
||
<p>
|
||
Projet de TMA pour le groupe La Poste, Développeur référent <br>
|
||
- 6 applications php, sous framework CakePhp<br>
|
||
- 3 applications MSBI/Asp.NET ( SSAS, SSRS, SSIS)<br>
|
||
- Outre le développement pur, j'ai régulièrement réalisé les conceptions techniques, la mise à jour
|
||
des spécifications fonctionnelles, mais aussi la rédaction et le passage des campagnes de tests sous
|
||
quality center.<br>
|
||
-Communication régulière avec le client<br><br>
|
||
|
||
TMA pour le ministère des sports.<br>
|
||
- Développeur en support pour 2 applications .NET/MSBI pour le ministère des sports.<br>
|
||
- Réalisation de conception techniques, mise à jour des spécifications fonctionnelles, rédaction et
|
||
passage des campagnes de tests sous quality center.<br><br>
|
||
|
||
Développeur - Projet de TMA pour l'ANR.<br>
|
||
- Maintenance et évolution d'une application de gestion des demandes
|
||
</p>
|
||
</div>
|
||
<div class="modal-footer">
|
||
<button type="button" class="btn btn-secondary" data-dismiss="modal">Fermer</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
|
||
<!--------------------------------------FOOTER SECTION-------------------------------------->
|
||
|
||
<script src="js/libs/isotope.pkgd.min.js"></script>
|
||
<script src="js/libs/particles.min.js"></script>
|
||
<script src="js/libs/particles-conf.js"></script>
|
||
<script src="js/libs/owl.carousel.min.js"></script>
|
||
<script src="js/libs/scrollmagic/minified/ScrollMagic.min.js"></script>
|
||
<script src="js/libs/scrollmagic/uncompressed/plugins/debug.addIndicators.js"></script>
|
||
<script src="js/libs/bootstrap.js"></script>
|
||
<script src="js/main.js"></script>
|
||
<!--<script src="js/timeline.js"></script>-->
|
||
<script src="js/libs/jscrollreveal.min.js"></script>
|
||
|
||
</body>
|
||
</html> |