/
index.html
400 lines (378 loc) · 17.3 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
<!-- TOUT FAIRE AUSSI EN AGLAIS AVEC TUILE QUI TOURNE, ou autre-->
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="x-ua-compatible" content="ie=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Flavien Girier - Développeur Web Junior</title>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.0/css/bootstrap.min.css"
integrity="sha384-9gVQ4dYFwwWSjIDZnLEWnxCjeSWFphJiwGPXr1jddIhOegiu1FwO5qRGvFXOdJZ4" crossorigin="anonymous">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.0.13/css/all.css"
integrity="sha384-DNOHZ68U8hZfKXOrtjWvjxusGo9WQnrNx2sqG0tfsghAvtVlRW3tvkXWZh58N9jp" crossorigin="anonymous">
<link href="https://cdn.rawgit.com/michalsnik/aos/2.1.1/dist/aos.css" rel="stylesheet">
<link rel="stylesheet" href="style.css">
</head>
<body>
<header>
<div class="frame">
<div class="box">
<div class="main">
<div class="image">
<div class="circle1"></div>
<div class="circle2"></div>
<img src="images/profil_picture.jpg" alt="profil_picture" id="my-picture">
</div>
<h1>Girier Flavien</h1>
<h2 id="title">Developpeur PHP Junior</h2>
<!-- CONTACT MODAL -->
<button type="button" class="fadeInUpBig btn btn-dark contact" data-toggle="modal"
data-target="#contactModal">
Contact
</button>
<!-- Modal Contact -->
<div class="modal fade" id="contactModal" tabindex="-1" role="dialog"
aria-labelledby="contactModalLabel"
aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">Mes coordonnées</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
<div class="hiddenContainer">
<div>
<a href="mailto:girier.flavien@gmail.com" target="_blank">girier.flavien@gmail.com</a>
</div>
<div>06.46.33.61.21</div>
<div>3e Arrodissement de Lyon</div>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary modal-close" data-dismiss="modal">Close
</button>
</div>
</div>
</div>
</div>
</div>
<div class="social">
<div class="container">
<div class="row mx-auto">
<div class="col-lg-1 offset-4">
<a href="https://www.linkedin.com/in/flavien-girier-7a145b43/" target="_blank"><img
src="images/linkedin_logo.png" alt="linkedin_logo" class="icon"></a>
</div>
<div class="col-lg-1">
<a href="http://www.viadeo.com/p/002264bqmcoeqp31" target="_blank"><img
src="images/viadeo_logo.png" alt="viadeo_logo"
class="icon"></a>
</div>
<div class="col-lg-1">
<a href="https://twitter.com/Flavien_Girier" target="_blank"><img
src="images/twitter_logo.png"
alt="twitter_logo"
class="icon"></a>
</div>
<div class="col-lg-1">
<a href="https://github.com/Flavien-Girier" target="_blank"><img
src="images/github_logo.png"
alt="github_logo" class="icon"></a>
</div>
</div>
</div>
</div>
</div>
</div>
</header>
<!-- start section About -->
<section class="about">
<div class="container-fluid">
<div class="container text-center">
<div class="row">
<div class="col-sm-12 cover-text">
<h1>A propos de moi</h1>
</div>
<div>
<p>Diplômé en marketing, j’ai entrepris de poursuivre et de compléter mes compétences
dans le développement web. Fort maintenant d’une maitrise des bases de
l’informatique, je m’épanoui pleinement lorsque je peux créer du contenu et
accompagner la vie d’un projet.</p>
<p>Mes expériences dans le domaine du marketing et de la gestion de produit est un
atout qui me permet de comprendre rapidement les objectifs d’un client et d’optimiser
l’efficacité de mon travail.</p>
<p>J'ai pour objectif de devenir développeur PHP confirmé et éventuellement devenir
lead dev d’ici quelques années. Sur le long terme, le statut de chef de projet ou Product owner
pourrait m'intéresser.</p>
</div>
</div>
</div>
</div>
</section>
<!-- start section Skills -->
<section class="skills">
<div class="container-fluid">
<div class="row">
<div class="col-sm-12 cover-text">
<h1>Compétences</h1>
</div>
</div>
</div>
<div class="mx-auto card">
<div class="row mx-auto card-front">
<h2>Back-End</h2>
</div>
<div class="row mx-auto card-back">
PHP 7<br>
Symfony 3<br>
MySQL<br>
</div>
</div>
<div class="mx-auto card">
<div class="row mx-auto card-front">
<h2>Front-End</h2>
</div>
<div class="row mx-auto card-back">
HTML5<br>
CSS3<br>
Boostrap 3 & 4<br>
jQuery<br>
VueJS (en cours)<br>
</div>
</div>
<div class="mx-auto card">
<div class="row mx-auto card-front">
<h2>Outils</h2>
</div>
<div class="row mx-auto card-back">
LINUX Ubuntu <br>
PhpStorm <br>
Git / GitHub <br>
Méthode SCRUM <br>
Photoshop <br>
</div>
</div>
<div class="mx-auto card">
<div class="row mx-auto card-front">
<h2>Langue</h2>
</div>
<div class="row mx-auto card-back">
Francais - Langue Maternelle <br>
Anglais courant (TOEIC : 935)
</div>
</div>
</section>
<!-- start section Experiences -->
<section class="experience">
<div class="container-fluid">
<div class="container text-center">
<div class="row">
<div class="col-sm-12 cover-text">
<h1>Expériences Développeur Web Junior</h1>
</div>
</div>
</div>
<div class="container">
<div class="row mx-auto">
<p>Création d’un site internet, AMO-Concept <br>
Equipe de 5 personnes <br>
Onepage vitrine avec formulaire de contact, système de comptes utilisateurs et
d’un back-office permettant l’upload par l’admin et le download de documents
par les clients et les partenaires <br>
Réalisation de Wireframes, développement du Front puis des fonctionnalités
Back, échanges réguliers avec le client, organisation de sprint et partage des
tâches <br> Réalisé avec Symfony 3.4 – Méthodologie agile SCRUM – Normes PSR - GitHub</p>
</div>
</div>
<div class="container">
<div class="row mx-auto">
<p>
Création d’un site fictif, Bug Cooker <br>
Réalisation d’un site vitrine d’un restaurant de nourriture d’insectes <br>
HTML/CSS - Boostrap - GitHub</p>
</div>
</div>
</div>
</section>
<!-- start section Formation -->
<section>
<div class="container-fluid ">
<div class="container text-center">
<div class="row">
<div class="col-sm-12 cover-text">
<h1>Formation</h1>
</div>
</div>
</div>
<div class="row">
<div class="col-lg-12">
<div class="timeline" data-aos="fade-down-right">
<div class="timeline-entry">
<div class="timeline-title text-center">
<h3>Wild Code School</h3><br>
<h3>2018</h3>
<a href="https://wildcodeschool.fr/"><img src="images/wcs_logo.png" alt="wcs_logo"
class="w-50 mt-4"></a>
</div>
<div class="timeline-body">
<p>Formation Développement Web PHP / Symfony</p>
<ul class="text-muted">
<li>Apprentisage du langague PHP</li>
<li>Utilisation du framework Symfony</li>
<li>Réalisation de projet client et fictif</li>
<li>Mise en pratique de méthode Agile SCRUM</li>
</ul>
</div>
</div>
</div>
<div class="timeline" data-aos="fade-down-left">
<div class="timeline-entry">
<div class="timeline-title text-center">
<h3>ESDES - Ecole de management</h3><br>
<h3>2012-2014</h3>
<a href="http://www.esdes.fr/"><img src="images/esdes_logo.png" alt="profil_picture"
class="w-75 mt-4"></a>
</div>
<div class="timeline-body">
<p>Master Marketing / Communication / Vente</p>
<ul class="text-muted">
<li>Marketing</li>
<li>Communication</li>
<li>Vente</li>
</ul>
</div>
</div>
</div>
<div class="timeline" data-aos="fade-down-right">
<div class="timeline-entry">
<div class="timeline-title text-center">
<h3>Université Claude Bernard Lyon 1</h3><br>
<h6>Année en Erasmus dans l’université de Lappeenranta, Finlande</h6><br>
<h3>2011-2012</h3>
<a href="https://www.univ-lyon1.fr/"><img src="images/univ_logo.png" alt="profil_picture"
class="w-75 mt-4"></a>
</div>
<div class="timeline-body">
<p>Licence Droit, Economie, Gestion</p>
<ul class="text-muted">
<li>Economie</li>
<li>Marketing</li>
<li>Commerce internationale</li>
</ul>
</div>
</div>
</div>
<div class="timeline" data-aos="fade-down-left">
<div class="timeline-entry">
<div class="timeline-title text-center">
<h3>Université Claude Bernard Lyon 1</h3><br>
<h3>2009-2011</h3>
<a href="https://iut.univ-lyon1.fr/formation/offre-de-formations/gea-villeurbanne-doua-/gea-gestion-des-entreprises-et-des-administrations-villeurbanne-doua--790766.kjsp"><img
src="images/univ_logo.png" alt="profil_picture" class="w-75 mt-4"></a>
</div>
<div class="timeline-body">
<p>Diplôme Universitaire de Technologie : Gestion des Entreprise et des Administrations
(GEA)</p>
<ul class="text-muted">
<li>Statistiques</li>
<li>Macroéconomie / Microéconomie</li>
<li>Comptabilité</li>
<li>Communication</li>
</ul>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- start section Autres expériences -->
<section>
<div class="container-fluid ">
<div class="container-fluid ">
<div class="container text-center">
<div class="row">
<div class="col-sm-12 cover-text">
<h1>Autres expériences</h1>
</div>
</div>
</div>
<div class="container text-center">
<div class="row mx-auto">
<p>Assistant d’Exploitation chez SEVEA (2017)
Gestion de projet du nouveau concept magasins / Création de retro planning</p>
</div>
<div class="row mx-auto">
<p>Conseiller Clientèle Particulier - Crédit Agricole (2016)
Accueil de la clientèle, prise de rendez-vous / Gestion des opérations courantes /
Entretiens services et épargne</p>
</div>
<div class="row mx-auto">
<p>Assistant Chef de produit accessoires chez Subsonic (2014)
Gestion des gammes de produits et des E-boutiques</p>
</div>
<div class="row mx-auto">
<p>Chargé Marketing et communication dans la start-up Carolei, la maison des pâtes
fraîches, Québec (2011)
Réalisation du plan marketing et de supports de communication / Gestion des </p>
</div>
</div>
</div>
</div>
</section>
<!-- start section Loisirs -->
<section>
<div class="container-fluid">
<div class="container text-center">
<div class="row">
<div class="col-sm-12 cover-text">
<h1>Loisirs</h1>
</div>
</div>
<div class="container">
<div class="row" data-aos="fade-right">
<div class="mx-auto">
<i class="fas fa-film"></i>
<p>Quentin Tarantino, Christopher Nolan, Alejandro Gonzalez Inarritu.</p></div>
</div>
<div class="row" data-aos="fade-left">
<div class="mx-auto">
<i class="fas fa-music"></i><p>Flûte traversière, guitare basse</p>
</div>
</div>
<div class="row" data-aos="fade-right">
<div class="mx-auto">
<i class="fas fa-futbol"></i>
<p>Escalade, Soccer 5</p>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- Button Download resume -->
<div class="container-fluid ">
<div class="container">
<div class="row">
<div class="btn-cv mx-auto">
<button type="button" class="btn-outline-cv"><a href="#">Télécharger mon CV</a></button>
</div>
</div>
</div>
</div>
<script src="https://cdn.rawgit.com/michalsnik/aos/2.1.1/dist/aos.js"></script>
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js"
integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo"
crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.0/umd/popper.min.js"
integrity="sha384-cs/chFZiN24E4KMATLdqdvsezGxaGsi4hLGOzlXwp5UZB1LY//20VyM2taTB4QvJ"
crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.0/js/bootstrap.min.js"
integrity="sha384-uefMccjFJAIv6A+rW+L4AHf99KvxDjWSu1z9VI8SKNVmz4sk7buKt/6v9KI65qnm"
crossorigin="anonymous"></script>
<script src="javascript.js"></script>
</body>
</html>