-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
448 lines (432 loc) · 22 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
<!DOCTYPE html>
<html class="no-js" lang="en">
<head>
<meta charset="utf-8">
<title>Concepteur Développeur d'applications</title>
<meta name="description" content="">
<meta name="author" content="tanguy jouvin">
<!-- Mobile Specific Metas
================================================== -->
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<!-- CSS
================================================== -->
<link rel="stylesheet" href="css/default.css">
<link rel="stylesheet" href="css/layout.css">
<link rel="stylesheet" href="css/media-queries.css">
<link rel="stylesheet" href="css/magnific-popup.css">
<!-- Script
================================================== -->
<script src="js/modernizr.js"></script>
<!-- Favicons
================================================== -->
<link rel="shortcut icon" href="favicon.png" >
</head>
<body>
<!-- Header
================================================== -->
<header id="home">
<nav id="nav-wrap">
<a class="mobile-btn" href="#nav-wrap" title="Show navigation">Show navigation</a>
<a class="mobile-btn" href="#" title="Hide navigation">Hide navigation</a>
<ul id="nav" class="nav">
<li class="current"><a class="smoothscroll" href="#home">Accueil</a></li>
<li><a class="smoothscroll" href="#about">Présentation</a></li>
<li><a class="smoothscroll" href="#resume">Etudes</a></li>
<li><a class="smoothscroll" href="#taf">Expériences professionnelles</a></li>
<li><a class="smoothscroll" href="#portfolio">Compétences</a></li>
<!-- <li><a class="smoothscroll" href="#contact">Contact</a></li> -->
</ul> <!-- end #nav -->
</nav> <!-- end #nav-wrap -->
<div class="row banner">
<div class="banner-text">
<h1 class="responsive-headline">Bienvenue</h1><br/>
<h3 class="responsive-headline"></h3>
<h3><a class="smoothscroll" href="#about">je suis</a>,
<br><a class="smoothscroll" href="#portfolio">concepteur développeur d'applications</a><br>
et je suis établi à Nantes.
<hr />
<ul class="social">
<li><a href="https://github.com/tanguyJouvin"><i class="fa fa-github"></i></a></li>
<li><a href="https://www.linkedin.com/in/tanguy-j-081087167"><i class="fa fa-linkedin"></i></a></li>
<li><a href="mailto:tanguyJouvin@protonmail.com"><i class="fa fa-envelope"></i></a></li>
</ul>
</div>
</div>
<p class="scrolldown">
<a class="smoothscroll" href="#about"><i class="icon-down-circle"></i></a>
</p>
</header> <!-- Header End -->
<!-- About Section
================================================== -->
<section id="about">
<div class="row">
<div class="three columns">
<img class="profile-pic" src="images/photo_portrait.jpg" alt="" />
</div>
<div class="nine columns main-col">
<h2>Présentation</h2>
<p> Après avoir obtenu mon titre professionnel de niveau 5 (bac +2) Développeur web et web mobile,
j'ai poursuivi mon cursus à l'ENI pour devenir concepteur développeur d'applications (niveau 6, équivalent bac + 4).<br>
Après avoir obtenu, mon titre professionnel, j'ai entamé ma première expérience professionnel au sein de Gladys. Je développe
une solution de gestion de projet en utilisant le framework PHP CodeIgniter pour le back-end et le framework JQuery pour le front-end.<br>
Lors de mon cursus à l'ENI, J'ai appris à analyser les besoins du client avec la formalisation des exigences à l'aide de diagramme UML.
Ensuite, j'ai approfondi le langages PHP avec un projet réalisé à l'aide du Framework Symfony et du moteur de template Twig.
J'ai découvert JAVA avec le développement de trois applications :<br>
- une application en client lourd avec Java SE<br>
- une application conçue selon l'architecture en couche avec Java EE.<br>
- une application avec le framework Spring et le moteur de template thymeleaf.<br>
Enfin, durant mon stage de fin d'étude chez Benevolt, j'ai réalisé une application
de centralisation de donnée avec le Framework Javascript Nuxt js et un serveur développé à l'aide du Framework PHP Laravel 8.
Il s'agit d'une application client-serveur qui sera utilisée en interne. L'intégration continue a été versionnée sur gitlab</p>
<div class="row">
<div class="columns contact-details">
<h2>Contact</h2>
<p class="address">
<span>Tanguy Jouvin</span><br>
<span>9 place saint félix<br>
44000 Nantes
</span><br>
<a href="mailto:tanguyJouvin@protonmail.com"><span>tanguyJouvin@protonmail.com</span></a>
</p>
</div>
</div> <!-- end row -->
</div> <!-- end row -->
</div> <!-- end .main-col -->
</div>
</section> <!-- About Section End-->
<!-- Resume Section
================================================== -->
<section id="resume">
<!-- Education
----------------------------------------------- -->
<div class="row education">
<div class="three columns header-col">
<h1><span>Etudes</span></h1>
</div>
<div class="nine columns main-col">
<div class="row item">
<div class="twelve columns">
<h3>ENI</h3>
<p class="info">Concepteur Développeur d'Application<span>•</span> <em class="date">2020 - 2021</em></p>
<p>
- Analyse et Conception d'une application : UML, modélisation d'une base de données ( mcd, mld, mpd) Datamodeler, maquettage avec Balsamiq<br />
- Développement Back-end orienté objet et conception en couche : Java EE, Spring<br />
- Approfondissement du langage de requête SQL avec les procédures stockées avec PL/SQL et transactions<br />
- Réalisation d'une application web structurée en couche : Java EE, servlet, JSP, Base de données gérée via SQL Server<br />
lien du dépôt github :<a href="https://github.com/Enchere-et-en-os/ENI-Encheres" target="_blank" > https://github.com/Enchere-et-en-os/ENI-Encheres</a><br />
- Développement Front-end avec Javascript, framework jQuery, Nuxt js<br />
- Développement Back-end en programmation orientée objet PHP et architecture MVC : Framework Symfony et Laravel<br />
- Réalisation d'une application web Sortir.com :<br />
- Analyse des besoins du client.
- Création de diagramme d'activité et diagramme de classe.
- Développement de l'application selon l'architecture MVC avec Symfony, le serveur WAMP, Base de données SQL.
lien du dépôt github : <a href="https://github.com/tanguyJouvin/ProjetSorties" target="_blank" > https://github.com/tanguyJouvin/ProjetSorties</a><br />
- Réalisation d'une application mobile avec Android :
lien du dépôt github : <a href="https://github.com/tanguyJouvin/AndroKado" target="_blank" > https://github.com/tanguyJouvin/AndroKado</a><br />
</p>
</div>
</div> <!-- item end -->
<div class="row item">
<div class="twelve columns">
<h3>Wild Code School</h3>
<p class="info">Développeur web et mobile<span>•</span> <em class="date">2019</em></p>
<p>
- Intégration et maquettage : HTML, CSS, wireframe MockFlow, Bootstrap<br />
- Front-end : framework Javascript React<br />
- Back-end : Node js, librairie Express, modélisation de base de donnée, merise, règles de sécurité<br />
- Utilisation des méthodes agiles : scrum, product owner, scrum master<br />
- Gestion des versions des applications avec git et hébergement sur github<br />
- Réalisation d'une application web de recherche de concert : React, consommation d'une API, gestion de la géolocalisation, création d'un moteur de recherche<br />
lien du dépôt github :<a href="https://github.com/tanguyJouvin/nantes-0219-js-wild-song" target="_blank" > https://github.com/tanguyJouvin/nantes-0219-js-wild-song</a><br />
- Réalisation d'un projet fullstack pour la société Ecoute Ecrit, une application d'auto-édition de livre :<br />
- front-end : React, Redux, Reactstrap, Axios, LocalStorage, création et gestion de compte utilisateur, React Router.<br />
- back-end : Node js, Express, MySQl, Axios, mise en place d'un routeur et d'un serveur, sécurisation des requêtes.<br />
lien du dépôt github :<a href="https://github.com/tanguyJouvin/ecoute_ecrit" target="_blank" > https://github.com/tanguyJouvin/ecoute_ecrit</a><br />
</p>
</div>
</div> <!-- item end -->
<div class="row item">
<div class="twelve columns">
<h3>AFPA</h3>
<p class="info">Technicien de maintenance CVC<span>•</span> <em class="date">2008</em></p>
<p>
Formation Génie climatique: maintenance, réglage, dépannage d'installations thermiques et énergétiques.
</p>
</div>
</div> <!-- item end -->
<div class="row item">
<div class="twelve columns">
<h3>ESRA</h3>
<p class="info">Ingénieur du Son<span>•</span> <em class="date">2005</em></p>
<p>
Formation audiovisuelle : post-production, mixage en studio, enregistrement pour diffusion, acoustique.
</p>
</div>
</div>
<div class="row item">
<div class="twelve columns">
<h3>UFR rennes2</h3>
<p class="info">Licence 1 Droit et Sciences politiques<span>•</span> <em class="date">2002</em></p>
</div>
</div>
<div class="row item">
<div class="twelve columns">
<h3>Lycée St Joseph de Lamballe</h3>
<p class="info">Baccalauréat en sciences économiques et sociales<span>•</span> <em class="date">2001</em></p>
</div>
</div>
</div> <!-- main-col end -->
</div> <!-- End Education -->
<!-- Work
----------------------------------------------- -->
<div class="row work">
<div class="three columns header-col">
<h1 id="taf"><span>Expériences </span><br/><br/>
<span>professionnelles</span></h1>
</div>
<div class="nine columns main-col">
<div class="row item">
<div class="twelve columns">
<h3>Développeur web Fullstack</h3>
<p class="info">Société Gladys<span>•</span> <em class="date">depuis Juin 2021</em></p>
<p>
Réalisation d'une solution destinée à la gestion de projet:<br />
-Front-end: Framework JQuery et sass pour le style<br />
-Back-end: Framework PHP Codeigniter, SGBDR SQL<br />
</p>
</div>
</div> <!-- item end -->
<div class="row item">
<div class="twelve columns">
<h3>Concepteur développeur d'applications</h3>
<p class="info">Société Benevolt<span>•</span> <em class="date">Janvier-Mars 2021</em></p>
<p>
Réalisation d'un annuaire centralisé de traitement d'emails:<br />
-Analyse des besoins, modélisation des données et collaboration à la gestion de projet.<br />
-Front-end: Framework Nuxt js et bootstrap-vue<br />
-Back-end: Framework PHP Laravel, SGBDR postgreSQL, Librairie PHP SpreadSheet<br />
</p>
</div>
</div> <!-- item end -->
<div class="row item">
<div class="twelve columns">
<h3>Développeur web</h3>
<p class="info">Société Ecoute-écrit<span>•</span> <em class="date">Mai-Juillet 2019</em></p>
<p>
Réalisation d'une application d'auto-édition de livre :<br />
-Analyse des besoins, modélisation et organisation en méthode agile.<br />
-Front-end: Framework React, Redux js et Reacstrap<br />
-Back-end: Framework Node Express, SGBDR MySQL<br />
</p>
</div>
</div> <!-- item end -->
<div class="row item">
<div class="twelve columns">
<h3>Technicien de Maintenance CVC</h3>
<p class="info">Engie Cofely, Idex energie, Cofely Axima, SPIE<span>•</span> <em class="date">2008-2019</em></p>
<p>
-Maintenance corrective d'installations de chauffage, de climatisation et de froid industriel<br />
-Réalisation de devis et proposition d'études d'installations aux clients<br />
-Mise au point et mise en service d'installations<br />
</p>
</div>
</div> <!-- item end -->
<div class="row item">
<div class="twelve columns">
<h3>Plombier</h3>
<p class="info">Interim<span>•</span> <em class="date">2002-2007</em></p>
<p>
-Travaux de plomberie<br />
-Installations de réseaux secondaires<br />
-Pose de centrales de traitement d'air et de réseaux aéroliques<br />
</p>
</div>
</div> <!-- item end -->
</div> <!-- main-col end -->
</div> <!-- End Work -->
</section>
<!--Skills Section
================================================== -->
<section id="portfolio">
<div class="row">
<h1>Compétences</h1><br>
<div class="twelve columns collapsed">
<!--Skills-wrapper -->
<div id="portfolio-wrapper" class="bgrid-quarters s-bgrid-thirds cf">
<div class="columns portfolio-item">
<div class="item-wrap">
<img alt="" src="images/icon/html5.svg">
</div>
</div> <!-- item end -->
<div class="columns portfolio-item">
<div class="item-wrap">
<img alt="" src="images/icon/iconfinder_social_style_3_css3_341095.svg">
</div>
</div> <!-- item end -->
<div class="columns portfolio-item">
<div class="item-wrap">
<img alt="" src="images/icon/Boostrap_logo.svg">
</div>
</div> <!-- item end -->
<div class="columns portfolio-item">
<div class="item-wrap">
<img alt="Java" src="images/icon/java ee.svg">
</div>
</div> <!-- item end -->
<div class="columns portfolio-item">
<div class="item-wrap">
<img alt="Java" src="images/icon/spring-boot-icon-200x196.png">
</div>
</div> <!-- item end -->
<div class="columns portfolio-item">
<div class="item-wrap">
<img alt="Js" src="images/icon/js.png">
</div>
</div> <!-- item end -->
<div class="columns portfolio-item">
<div class="item-wrap">
<img alt="React" src="images/icon/iconfinder_nuxt-dot-js_4691337.svg">
</div>
</div><!-- item end -->
<div class="columns portfolio-item">
<div class="item-wrap">
<img alt="Vue" src="images/icon/vue js.jpg">
</div>
</div><!-- item end -->
<div class="columns portfolio-item">
<div class="item-wrap">
<img alt="React" src="images/icon/iconfinder_React.js_logo_1174949.svg">
</div>
</div><!-- item end -->
<div class="columns portfolio-item">
<div class="item-wrap">
<img alt="PHP" src="images/icon/php.svg">
</div>
</div> <!-- item end -->
<div class="columns portfolio-item">
<div class="item-wrap">
<img alt="PHP" src="images/icon/symfony.svg">
</div>
</div> <!-- item end -->
<div class="columns portfolio-item">
<div class="item-wrap">
<img alt="Symfony" src="images/icon/iconfinder_194_Laravel_4519141.svg">
</div>
</div> <!-- item end -->
<div class="columns portfolio-item">
<div class="item-wrap">
<img alt="Node" src="images/icon/iconfinder_node_3069651.svg">
</div>
</div> <!-- item end -->
<div class="columns portfolio-item">
<div class="item-wrap">
<img alt="" src="images/icon/iconfinder_social_media_social_media_logo_git_2993773.svg">
</div>
</div> <!-- item end -->
<div class="columns portfolio-item">
<div class="item-wrap">
<img alt="" src="images/icon/iconfinder_logo_brand_brands_logos_ubuntu_2993667.svg">
</div>
</div> <!-- item end -->
<div class="columns portfolio-item">
<div class="item-wrap">
<img alt="" src="images/icon/iconfinder_mysql_4691303.svg">
</div>
</div> <!-- item end -->
<div class="columns portfolio-item">
<div class="item-wrap">
<img alt="" src="images/icon/iconfinder_postgresql_4691328.svg">
</div>
</div> <!-- item end -->
<div class="columns portfolio-item">
<div class="item-wrap">
<img alt="" src="images/icon/iconfinder_github_253591.svg">
</div>
</div> <!-- item end -->
<div class="columns portfolio-item">
<div class="item-wrap">
<img alt="tomcat" src="images/icon/Tomcat-logo.svg">
</div>
</div> <!-- item end -->
<div class="columns portfolio-item">
<div class="item-wrap">
<img alt="wamp" src="images/icon/wamp-logo.png">
</div>
</div> <!-- item end -->
<div class="columns portfolio-item">
<div class="item-wrap">
<img alt="agility" src="images/icon/scrum.png">
<p>scrum</p>
</div>
</div> <!-- item end -->
</div> <!-- portfolio-wrapper end -->
</div> <!-- twelve columns end -->
</section>
<!-- Testimonials Section
================================================== -->
<section id="testimonials">
<div class="text-container">
<div class="row">
<div class="two columns header-col">
<h1><span>Citations</span></h1>
</div>
<div clss="ten columns flex-container">
<div class="flexslider">
<ul class="slides">
<li>
<blockquote>
<p>
Si l’on veut résoudre un problème à l’aide d’un ordinateur, il est indispensable d’avoir recours à un algorithme car un ordinateur ne peut exécuter que des ordres précis et sans ambiguïté.
</p>
<cite> Ashok Kumar Chandra </cite>
</blockquote>
</li> <!-- slide ends -->
<li>
<blockquote>
<p>
Je gère en ne prenant pas de décisions et en laissant les choses progresser naturellement. C'est comme cela que l'on obtient les meilleurs résultats.
</p>
<cite>Il était une fois Linux : L'extraordinaire histoire d'une révolution accidentelle - 2001 - Linus Torvalds</cite>
</blockquote>
</li> <!-- slide ends -->
<li>
<blockquote>
<p>
Parce qu'une chose offre une difficulté énorme, ne va pas croire que ce soit une chose impossible aux forces humaines;
et si c'est quelque chose de possible et même de naturel à l'homme, pense que toi aussi tu es en état de le faire.
</p>
<cite>Marc Aurele</cite>
</blockquote>
</li> <!-- slide ends -->
</ul>
</div> <!-- div.flexslider ends -->
</div> <!-- div.flex-container ends -->
</div> <!-- row ends -->
</div> <!-- text-container ends -->
</section> <!-- Testimonials Section End-->
<!-- footer
================================================== -->
<footer id="contact">
<div class="row">
<div class="twelve columns">
<ul class="social-links">
<li><a href="https://github.com/tanguyJouvin"><i class="fa fa-github"></i></a></li>
<li><a href="https://www.linkedin.com/in/tanguy-j-081087167"><i class="fa fa-linkedin"></i></a></li>
<li><a href="mailto:tanguyJouvin@protonmail.com"><i class="fa fa-envelope"></i></a></li>
</ul>
</div>
<div id="go-top"><a class="smoothscroll" title="Back to Top" href="#home"><i class="icon-up-open"></i></a></div>
</div>
</footer> <!-- Footer End-->
<!-- Java Script
================================================== -->
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script>window.jQuery || document.write('<script src="js/jquery-1.10.2.min.js"><\/script>')</script>
<script type="text/javascript" src="js/jquery-migrate-1.2.1.min.js"></script>
<script src="js/jquery.flexslider.js"></script>
<script src="js/waypoints.js"></script>
<script src="js/jquery.fittext.js"></script>
<script src="js/magnific-popup.js"></script>
<script src="js/init.js"></script>
</body>
</html>