-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
132 lines (119 loc) · 6.77 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
<!DOCTYPE html>
<html lang="fr">
<head>
<title>Mon CV</title>
<meta charset="UTF-8">
<meta name="Mon CV" content="CV en ligne développeur web Mattéo DROUIN">
<link rel="stylesheet" href="style.css" />
<script src="https://kit.fontawesome.com/8a08e6dc64.js" crossorigin="anonymous"></script>
<link href="https://fonts.googleapis.com/css2?family=Montserrat:wght@300&display=swap" rel="stylesheet">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="shortcut icon" type="image/png" href="photo_profil.png">
</head>
<!--PHOTO-->
<body>
<section class="photo">
<h6> <img class="photo--style" src="photo_profil.png" alt="photo de profil de mattéo drouin développeur web"> </h6>
</section>
<!--HEADER-->
<header class="nom-prenom-job">
<h1 class="style--matteo">Mattéo <span class="style--drouin"> DROUIN </span> </h1>
<p class="style--developpeur"> <span class="underline--developpeur">Dévelo</span>ppeur web Junior </p>
</header>
<!--CONTACT-->
<section class="contact">
<h2> CONTACT </h2>
<p class="contact__text"> Adresse <br> Tours, France </p>
<p class="contact__text"> Téléphone <br> 06 26 23 73 19 </p>
<p class="contact__text"> E-mail <br> <a href="mailto:matteodrouin33@gmail.com"> matteodrouin33@gmail.com </a> </p>
<p class="contact__text"> Site Web <br> <a href="https://www.facebook.com/matteo.drouin.7/" title="Mon facebook personnel"> Page facebook </a> </p>
<p class="contact__text"> Skype <br> @nomUtilisateur.skype </p>
</section>
<!--FORMATION-->
<section class="formation">
<h3> <i class="fas fa-graduation-cap"></i> FORMATION </h3>
<div class="sous-partie__formation-experienceprofessionelle">
<h5 class="sous-partie--left"> <i class="far fa-dot-circle"></i> 2020 <br> <span class="align--bigdot">En ligne</span> </h5>
<article class="sous-partie--right">
<h4>OPEN CLASSROOM</h4>
<p> Développeur Web Junior <br><br> Optimisation de site web existant, Création de site e-commerce, Création d'API, Création de réseau social d'entreprise. </p>
</article>
</div>
<div class="sous-partie__formation-experienceprofessionelle">
<h5 class="sous-partie--left"> <i class="fas fa-circle"></i> 2016-2019 <br> <span class="align">Nantes</span> </h5>
<article class="sous-partie--right">
<h4> AUDENCIA BACHELOR </h4>
<p> Etudiant <br><br> Bureautique, Comptabilité, Gestion de projet, Finance, Fiscalité, Droit, Marketing, Ressources Humaines, Statistiques, Langues Vivantes, Techniques commerciales. </p>
</article>
</div>
</section>
<!--A PROPOS DE MOI-->
<article class="a-propos-de-moi">
<h2> A PROPOS DE MOI</h2>
<p class="a-propos-de-moi__text"> Ancien étudiant en école de commmerce possédant une expérience sur des postes commercials et ressources humaines, à la recherche d’un nouveau challenge en m’investissant sur le long terme en réorientation vers les métiers du développement web. </p>
</article>
<!--EXPERIENCE PROFESSIONELLE-->
<section class="experience-professionelle">
<h3> <i class="fas fa-suitcase"></i> EXPERIENCE PROFESSIONELLE </h3>
<div class="sous-partie__formation-experienceprofessionelle">
<h5 class="sous-partie--left"> <i class="far fa-dot-circle"></i>Aujourd'hui <br> <span class="align">France</span> </h5>
<article class="sous-partie--right">
<h4> Freelance </h4>
<p> Développeur web <br><br> Intégrer du contenu conformément à une maquette,
Préparer des éléments graphiques et textuels à intégrer à une page web,
Adapter l'affichage d'un site web à des écrans de petite taille,
Utiliser un système de gestion de versions pour le suivi du projet et son hébergement,
Définir la structure d'une page web à partir d'une maquette,
Assurer la conformité d'une page web aux standards HTML et CSS.</p>
</article>
</div>
<div class="sous-partie__formation-experienceprofessionelle">
<h5 class="sous-partie--left"> <i class="far fa-dot-circle"></i>2019 <br> <span class="align"> Loches, France</span> </h5>
<article class="sous-partie--right">
<h4> MANPOWER </h4>
<p> Chargé de recrutement <br><br> Accueil physique et téléphonique Sourçing avec vivier Manpower RDV agence, Création de contrats / Arrêt de travail / Gestion litiges, Approfondissement connaissances législation du travail. </p>
</article>
</div>
<div class="sous-partie__formation-experienceprofessionelle">
<h5 class="sous-partie--left"> <i class="fas fa-circle"></i> 2018 <br> <span class="align"> Tours, France </span> </h5>
<article class="sous-partie--right">
<h4> HB ESPACE BUSINESS </h4>
<p> Assistant de Direction <br><br> Animation des réseaux sociaux du centre d"affaire et maison d'hotes, Prospection Phoning, Accueil Physique & Téléphonique, Visite des locaux à louer.</p>
</article>
</div>
<div class="sous-partie__formation-experienceprofessionelle">
<h5 class="sous-partie--left"> <i class="fas fa-circle"></i> Actuellement<br> <span class="align">France </span> </h5>
<article class="sous-partie--right">
<h4> SERVEUR EXTRA </h4>
<p> Le nôtre, Potel & Chabot, Gauthier.</p>
</article>
</div>
</section>
<!--LOISIRS-->
<section class="loisirs">
<h2> LOISIRS </h2>
<div class="flex__loisirs">
<i class="far fa-futbol"></i>
<i class="fas fa-running"></i>
<i class="fas fa-music"></i>
</div>
</section>
<!--RECOMMANDATION-->
<section class="recommandation">
<h3> <i class="fas fa-pencil-alt"></i> RECOMMANDATION </h3>
<div class="conteneur__recommandation-items">
<ul class="recommandation--left">
<li class="bold--recommandation">MAXIME KLEMAN</li>
<li class="bold--recommandation">Directeur, mon agence</li>
<li class="bold--recommandation">Telephone: </li>
<li> E-mail: Loreipsumdolor</li>
</ul>
<ul class="recommandation--right">
<li class="bold--recommandation">MAXIME KLEMAN</li>
<li class="bold--recommandation">Directeur, mon agence</li>
<li class="bold--recommandation">Telephone: </li>
<li> E-mail: Loreipsumdolor</li>
</ul>
</div>
</section>
</body>