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
|
---
title: Développeur web front-end
slug: Learn/Front-end_web_developer
translation_of: Learn/Front-end_web_developer
original_slug: Apprendre/Front-end_web_developer
---
<p>{{learnsidebar}}</p>
<p>Bienvenue dans notre parcours d'apprentissage pour les développeurs Web front-end!</p>
<p>Ici, nous vous proposons un cours structuré qui vous apprendra tout ce que vous devez savoir pour devenir un développeur Web front-end. Parcourez simplement chaque section, en apprenant de nouvelles compétences (ou en améliorant celles existantes) au fur et à mesure. Chaque section comprend des exercices et des évaluations pour tester votre compréhension avant d'aller de l'avant.</p>
<h2 id="Sujets_abordés">Sujets abordés</h2>
<p>Les sujets abordés sont :</p>
<ul>
<li>Configuration de base et apprendre à apprendre</li>
<li>Les normes du Web et les bonnes pratiques (telles que l'accessibilité et la compatibilité entre navigateurs)</li>
<li>HTML, le langage qui donne la structure et le sens du contenu Web</li>
<li>CSS, le langage utilisé pour styliser les pages Web</li>
<li>JavaScript, le langage de script utilisé pour créer des fonctionnalités dynamiques sur le Web</li>
<li>Les outils utilisés pour faciliter le développement Web moderne côté client.</li>
</ul>
<p>Vous pouvez parcourir les sections dans l'ordre, mais chacune d'elles est également indépendante. Par exemple, si vous connaissez déjà le HTML, vous pouvez passer à la section CSS.</p>
<h2 id="Prérequis">Prérequis</h2>
<p>Vous n'avez pas besoin de connaissances préalables pour commencer ce cours. Tout ce dont vous avez besoin, c'est d'un ordinateur capable de faire fonctionner des navigateurs web modernes, d'une connexion internet et d'une volonté d'apprendre.</p>
<p>Si vous n'êtes pas sûr que le développement web front-end est fait pour vous, et/ou si vous souhaitez une introduction en douceur avant de commencer un cours plus long et plus complet, consultez d'abord notre module <a href="/en-US/docs/Learn/Getting_started_with_the_web">Commencer avec le web</a>.</p>
<h2 id="Obtenir_de_laide">Obtenir de l'aide</h2>
<p>Nous avons essayé de rendre l'apprentissage du développement web front-end aussi simple que possible, mais vous resterez probablement bloqué parce que vous ne comprenez pas quelque chose, ou parce que du code ne fonctionne pas.</p>
<p>Ne paniquez pas. Nous avons tous des problèmes, que nous soyons débutants ou professionnels du développement web. L'article <a href="/en-US/docs/Learn/Learning_and_getting_help">Apprendre et obtenir de l'aide</a> avous donne une série de conseils pour rechercher des informations et vous aider. Si vous êtes toujours bloqués, n'hésitez pas à poser une question sur notre <a href="https://discourse.mozilla.org/c/mdn/learn/">forum de discussion</a>.</p>
<p>Allons-y. Bonne chance !</p>
<h2 id="Le_parcours_dapprentissage">Le parcours d'apprentissage</h2>
<h3 id="Pour_commencer">Pour commencer</h3>
<p>Temps nécessaire: 1–2 heures</p>
<h4 id="Prérequis_2">Prérequis</h4>
<p>Rien d'autre que des connaissances de base en informatique.</p>
<h4 id="Comment_saurai-je_que_je_suis_prêt_à_passer_à_autre_chose">Comment saurai-je que je suis prêt à passer à autre chose ?</h4>
<p>Il n'y a pas d'évaluation dans cette partie du cours. Mais assurez-vous de ne pas sauter d'étape. Il est important de vous préparer à faire des exercices plus tard dans le cours.</p>
<h4 id="Guides_fondamentaux">Guides fondamentaux</h4>
<ul>
<li><a href="/en-US/docs/Learn/Getting_started_with_the_web/Installing_basic_software">Installation des logiciels de base</a> — configuration des outils de base (15 min de lecture)</li>
<li><a href="/en-US/docs/Learn/Getting_started_with_the_web/The_web_and_web_standards">Contexte du web et des standards du web</a> (45 min de lecture)</li>
<li><a href="/en-US/docs/Learn/Learning_and_getting_help">Apprendre et obtenir de l'aide</a> (45 min de lecture)</li>
</ul>
<h3 id="Sémantique_et_structure_avec_HTML">Sémantique et structure avec HTML</h3>
<p>Temps nécessaire: 35–50 heures</p>
<h4 id="Prérequis_3">Prérequis</h4>
<p>Rien d'autre que des connaissances informatiques de base, et un environnement de développement web de base.</p>
<h4 id="Comment_saurai-je_que_je_suis_prêt_à_passer_à_autre_chose_2">Comment saurai-je que je suis prêt à passer à autre chose ?</h4>
<p>Les évaluations de chaque module sont conçues pour tester vos connaissances sur le sujet. En complétant les évaluations, vous confirmez que vous êtes prêt à passer au module suivant.</p>
<h4 id="Guides_fondamentaux_2">Guides fondamentaux</h4>
<ul>
<li><a href="/en-US/docs/Learn/HTML/Introduction_to_HTML">Introduction au HTML</a> (15–20 heures de lecture/exercices)</li>
<li><a href="/en-US/docs/Learn/HTML/Multimedia_and_embedding">Multimédia et intégration</a> (15–20 heures de lecture/exercices)</li>
<li><a href="/en-US/docs/Learn/HTML/Tables">Tableaux HTML</a> (5–10 heures de lecture/exercices)</li>
</ul>
<h3 id="Design_et_mise_en_page_avec_le_CSS">Design et mise en page avec le CSS</h3>
<p>Temps nécessaire: 90–120 heures</p>
<h4 id="Prérequis_4">Prérequis</h4>
<p>Il est recommandé d'avoir des connaissances de base en HTML avant de commencer à apprendre le CSS. Vous devriez au moins étudier <a href="/en-US/docs/Learn/HTML/Introduction_to_HTML">l'introduction au HTML</a> d'abord.</p>
<h4 id="Comment_saurai-je_que_je_suis_prêt_à_passer_à_autre_chose_3">Comment saurai-je que je suis prêt à passer à autre chose ?</h4>
<p>Les évaluations de chaque module sont conçues pour tester vos connaissances sur le sujet. En complétant les évaluations, vous confirmez que vous êtes prêt à passer au module suivant.</p>
<h4 id="Guides_fondamentaux_3">Guides fondamentaux</h4>
<ul>
<li><a href="/en-US/docs/Learn/CSS/First_steps">Premiers pas avec CSS</a> (10–15 heures de lecture/exercices)</li>
<li><a href="/en-US/docs/Learn/CSS/Building_blocks">Les élements de base du CSS</a> (35–45 heures de lecture/exercices)</li>
<li><a href="/en-US/docs/Learn/CSS/Styling_text">Mise en forme du texte</a> (15–20 heures de lecture/exercices)</li>
<li><a href="/en-US/docs/Learn/CSS/CSS_layout">Mise en page CSS</a> (30–40 heures de lecture/exercices)</li>
</ul>
<h4 id="Ressources_complémentaires">Ressources complémentaires</h4>
<ul>
<li><a href="/en-US/docs/Web/CSS/Layout_cookbook">CSS layout cookbook</a></li>
</ul>
<h3 id="Interactivité_avec_JavaScript">Interactivité avec JavaScript</h3>
<p>Temps nécessaire: 135–185 heures</p>
<h4 id="Prérequis_5">Prérequis</h4>
<p>ll est recommandé d'avoir des connaissances de base en HTML avant de commencer à apprendre JavaScript. Vous devriez au moins étudier l'<a href="/en-US/docs/Learn/HTML/Introduction_to_HTML">Introduction au HTML</a> d'abord.</p>
<h4 id="Comment_saurai-je_que_je_suis_prêt_à_passer_à_autre_chose_4">Comment saurai-je que je suis prêt à passer à autre chose ?</h4>
<p>Les évaluations de chaque module sont conçues pour tester vos connaissances sur le sujet. En complétant les évaluations, vous confirmez que vous êtes prêt à passer au module suivant.</p>
<h4 id="Guides_fondamentaux_4">Guides fondamentaux</h4>
<ul>
<li><a href="/en-US/docs/Learn/JavaScript/First_steps">Premiers pas avec JavaScript</a> (30–40 heures de lecture/exercices)</li>
<li><a href="/en-US/docs/Learn/JavaScript/Building_blocks">Les éléments de base de JavaScript</a> (25–35 heures de lecture/exercices)</li>
<li><a href="/en-US/docs/Learn/JavaScript/Client-side_web_APIs">API web côté client</a> (30–40 heures de lecture/exercices)</li>
<li><a href="/en-US/docs/Learn/JavaScript/Objects">Introduction aux objets JavaScript</a> (25–35 heures de lecture/exercices)</li>
<li><a href="/en-US/docs/Learn/JavaScript/Asynchronous">JavaScript asynchrone</a> (25–35 heures de lecture/exercices)</li>
</ul>
<h3 id="Formulaires_web_-_Travailler_avec_les_données_des_utilisateurs">Formulaires web - Travailler avec les données des utilisateurs</h3>
<p>Temps nécessaire: 40–50 heures</p>
<h4 id="Prérequis_6">Prérequis</h4>
<p>Les formulaires nécessitent des connaissances en HTML, CSS et JavaScript. Étant donné la complexité du travail avec les formulaires, il s'agit d'un sujet spécifique.</p>
<h4 id="Comment_saurai-je_que_je_suis_prêt_à_passer_à_autre_chose_5">Comment saurai-je que je suis prêt à passer à autre chose ?</h4>
<p>Les évaluations de chaque module sont conçues pour tester vos connaissances sur le sujet. En complétant les évaluations, vous confirmez que vous êtes prêt à passer au module suivant.</p>
<h4 id="Guides_fondamentaux_5">Guides fondamentaux</h4>
<ul>
<li><a href="/en-US/docs/Learn/Forms">Fomulaires web</a> (40–50 heures)</li>
</ul>
<h3 id="Faire_profiter_le_Web_à_tout_le_monde">Faire profiter le Web à tout le monde</h3>
<p>Temps nécessaire: 60–75 heures</p>
<h4 id="Prérequis_7">Prérequis</h4>
<p>Il est conseillé de connaître les langages HTML, CSS et JavaScript avant de parcourir cette section. De nombreuses techniques et meilleures pratiques concernent de multiples technologies.</p>
<h4 id="Comment_saurai-je_que_je_suis_prêt_à_passer_à_autre_chose_6">Comment saurai-je que je suis prêt à passer à autre chose ?</h4>
<p>Les évaluations de chaque module sont conçues pour tester vos connaissances sur le sujet. En complétant les évaluations, vous confirmez que vous êtes prêt à passer au module suivant..</p>
<h4 id="Guides_fondamentaux_6">Guides fondamentaux</h4>
<ul>
<li><a href="/en-US/docs/Learn/Tools_and_testing/Cross_browser_testing">Tests multi-navigateurs</a> (25–30 heures de lecture/exercices)</li>
<li><a href="/en-US/docs/Learn/Accessibility">Accessibilité</a> (20–25 heures de lecture/exercices)</li>
</ul>
<h3 id="Outils_modernes">Outils modernes</h3>
<p>Temps nécessaire: 55–90 heures</p>
<h4 id="Prérequis_8">Prérequis</h4>
<p>Il est conseillé de connaître les langages HTML, CSS et JavaScript avant de parcourir cette section, car les outils abordés fonctionnent en parallèle avec bon nombre de ces technologies.</p>
<h4 id="Comment_saurai-je_que_je_suis_prêt_à_passer_à_autre_chose_7">Comment saurai-je que je suis prêt à passer à autre chose ?</h4>
<p>Il n'y a pas d'articles d'évaluation spécifiques dans cet ensemble de modules. Les études de cas à la fin des deuxième et troisième modules vous préparent à saisir l'essentiel des outils modernes.</p>
<h4 id="Guides_fondamentaux_7">Guides fondamentaux</h4>
<ul>
<li><a href="/en-US/docs/Learn/Tools_and_testing/GitHub">Git et GitHub</a> (5 heures de lecture)</li>
<li><a href="/en-US/docs/Learn/Tools_and_testing/Understanding_client-side_tools">Comprendre les outils de développement web côté client</a> (20–25 heures de lecture)</li>
<li>
<p><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks">Comprendre les frameworks JavaScript côté client</a> (30-60 heures de lecture/exercices)</p>
</li>
</ul>
|