Présentation
JavaScript est vraiment LE langage de programmation que vous devez connaître si vous voulez vous lancer dans le développement web. Et ça tombe bien : avec ce cours, vous êtes sûr de ne pas passer à côté d’une notion importante, car il est complet ! En plus de ça, ce cours vous permettra de réaliser 8 projets, des dizaines d’exercices et une cinquantaine de challenges en cours de vidéo !
Vous êtes sur le cours le plus complet, le plus pédagogique et le plus clair concernant JavaScript, et en plus : il est continuellement mis à jour ! Le plan de ce cours a été réalisé après des semaines de travail, en concordance avec ce qu’il y a de mieux en terme de pédagogie pour apprendre et surtout retenir chaque concept évoqué.
Ce n’est pas un cours dans lequel vous êtes jeté dans la jungle : vous serez continuellement suivi avec la possibilité de poser des questions à n’importe quel moment pour avoir une réponse précise de notre équipe.
Que vous soyez débutant ou déjà bien avancé avec le JavaScript, ce cours vous apprendra de nouvelles choses et de nouvelles façons de programmer, tant il est complet.
Si vous êtes motivé, intéressé par JavaScript, et que vous recherchez un cours dans lequel vous ne serez pas déçu : arrêtez-vous. Vous êtes à la bonne porte !
J'aurai plaisir à vous aider à atteindre vos objectifs.
Prérequis
Vous devez avoir quelques notions de base en HTML pour profiter à 100% de votre cours.
Plan du cours
Tout ouvrir
Partie 1 : Avant de commencer ce cours
-
1. Qu’allons-nous faire dans cette formation ?
Extrait
-
-
3. Comment réussir cette formation ?
Extrait
-
4. Comment poser mes questions ?
Extrait
Partie 2 : Orientation
-
5. Commencez la formation selon votre niveau
Partie 3 : Reprenons par la base
-
6. Qu'est-ce que JavaScript
Extrait
-
7. Quels logiciels utiliser ?
-
8. Quelles extensions installer ?
-
9. Où allons-nous placer notre code Javascript ?
-
10. Comment fonctionne VS Code ?
Partie 4 : Les variables et les opérateurs
-
11. Qu'est-ce qu'une variable ?
-
12. Déclarons nos premières variables (Let, Const et Var)
-
13. Découvrons la concaténation
-
-
15. Faisons des opérations mathématiques
Partie 5 : Demander des informations aux utilisateurs
-
16. Qu'est-ce qu'une boîte de dialogue ?
-
17. Afficher une information
-
18. Demander une confirmation
-
19. Demander des renseignements
Partie 6 : Tout sur les fonctions
-
20. Qu’est-ce qu’une fonction ?
-
21. Ecrivons notre première fonction
Extrait
-
22. Ajoutons des paramètres à notre fonction
-
23. Note concernant la portée des variables
-
24. Parlons des variables globales et des variables locales
-
25. Les fonctions qui retournent quelque chose
-
26. Les paramètres par défaut
Extrait
-
27. Utiliser une fonction déjà existante
-
28. Convertissons nos données
-
29. Les fonctions anonymes
Partie 7 : Exerçons-nous sur les fonctions
-
30. Exercice #1 : Débutant
-
31. Correction de l’exercice 1
-
-
33. Correction de l’exercice 2
Partie 8 : La logique avec JavaScript
-
34. Qu'est-ce qu'une condition ?
-
35. Les conditions (if / else)
-
36. Fiche technique sur les opérateurs de comparaison
-
37. Les conditions (switch)
-
38. Vérifier plusieurs conditions d'un coup (OR / AND)
-
39. Vérifier le contraire d'une condition (NOT)
-
40. Les conditions ternaires
-
41. Qu'est-ce qu'une boucle ?
-
-
43. Les boucles (do...while)
-
-
45. Qu'en est-il des autres boucles ?
-
46. Casser la boucle : break et continue
-
Partie 9 : Projet #1 - Calculatrice
-
48. Qu'allons-nous faire dans ce projet ?
Extrait
-
49. Partons sur de bonnes bases
-
50. Etape 1 : Demander un mode de calcul
-
51. Etape 2 : Demander deux nombres à utiliser
-
52. Etape 3 : Créer les 4 fonctions
-
53. Etape 4 : Appeler la fonction à utiliser
-
54. Etape 5 : Afficher le résultat
-
55. Etape 6 : Gérer les exceptions
-
-
57. (Facultatif) Proposer de refaire un calcul
Partie 10 : Les fonctions et la logique
-
58. La portée des variables
-
59. Parlons de la récursivité
Extrait
Partie 11 : Exercice sur les fonctions récursives
-
60. Que devez-vous faire ?
-
Partie 12 : Tout savoir sur les tableaux
-
62. Qu’est-ce qu’un tableau ?
-
63. Créer un tableau simple
-
64. Créer un tableau à plusieurs dimensions
-
65. Créer un tableau associatif
-
66. Accéder à un élément (index / length)
-
67. Ajouter un élément (push / unshift)
-
68. Retirer un élément (pop / shift)
-
69. Retrouver un élément grâce à sa valeur (indexOf)
-
70. Concaténer pour afficher (join)
-
71. La fonction ultime (splice)
-
72. Les boucles (for...in)
-
73. Les boucles (for...of)
-
74. Les boucles (foreach)
-
75. Notes sur les fonctions fléchées
-
76. Concaténer un tableau associatif
-
77. Fiche technique sur les principales fonctions des tableaux
Partie 13 : Notions avancées sur les fonctions JavaScript
-
78. Les fonctions fléchées
-
79. Les fermetures (closures)
Partie 14 : Utilisons le potentiel de JavaScript
-
80. Qu'est-ce qu'un objet ?
-
-
82. L'affectation par décomposition (destructuring)
-
83. Précisions sur les prochains objets : à quoi servent-ils ?
-
-
-
-
-
88. Fiche technique sur les objets Set, Map, WeakSet et WeakMap
-
89. Ajouter un nombre infini d'arguments (le REST parameter)
-
90. L'opérateur de décomposition (le spread operator)
Partie 15 : Parlons du BOM (Browser Object Model)
-
91. Qu'est-ce que le BOM ?
-
92. Voici comment aborder cette section
-
93. L'objet principal : Window
-
-
-
-
-
98. Et enfin : l'objet Document
Partie 16 : Communiquons avec un site internet
-
99. Qu'est-ce que le DOM ?
-
100. [NOTE] Attention à votre balise <script></script>
-
101. [Magazine Offert] Le petit guide du voyageur sur CodePen
-
102. Accéder aux éléments du DOM
-
103. Modifier des éléments du DOM (textContent, innerHTML)
-
104. Ajouter des éléments au DOM (append, prepend, insertBefore)
-
105. Supprimer des éléments du DOM
Partie 17 : Modifions le style de nos éléments
-
106. Quelles sont les étapes pour modifier le style d’un élément ?
-
107. Modifier le style des éléments
-
108. Fiche technique sur les fonctions intéressantes liées au DOM
Partie 18 : Projet #2 - Pratiquons tout ce que nous venons de voir !
-
109. Que devez-vous faire ?
-
Partie 19 : Les évènements (le clic, le double-clic, etc)
-
111. Qu'est-ce qu'un évènement ?
-
112. Les écouteurs : onclick, ...
-
113. Les écouteurs via les propriétés JavaScript
-
114. Les écouteurs via le gestionnaire d'évènements
-
115. Gérer la propagation des évènements et stopPropagation
-
116. Planifier l'exécution d'un script (setTimeout, setInterval)
-
117. Fiche technique sur les principaux évènements
Partie 20 : Exercices sur les évènements
-
118. Exercice 1 : Faire un timer
-
119. Exercice 1 : Correction
-
120. Exercice 2 : Faire un bouton "spoiler"
-
121. Exercice 2 : Correction
Partie 21 : Projet #3 - Générateur de citations
-
122. Qu'allons-nous faire dans ce projet ?
Extrait
-
123. Etape 1 : Partir sur de bonnes bases
-
124. Etape 2 : Récupérer les éléments nécessaires
-
125. Etape 3 : Créer les variables utiles
-
126. Etape 4 : Détecter le clic du bouton "Nouvelle Citation"
-
127. Etape 5 : Générer un nombre aléatoire
-
128. Etape 6 : Mettre à jour le contenu
-
Partie 22 : Projet #4 guidé : Les formulaires et JavaScript
-
130. Qu'allons-nous faire dans ce projet ?
Extrait
-
131. Partons sur de bonnes bases
-
132. Etape 1 : Sélectionner les éléments
-
133. Etape 2 : Cacher l'erreur
-
134. Etape 3 : Générer un nombre aléatoire
-
135. Etape 4 : Vérifier que l'utilisateur donne bien un nombre
-
136. Etape 5 : Agir à l'envoi du formulaire
-
137. Etape 6 : Créer la fonction vérifier
Partie 23 : La programmation orientée objet
-
138. Qu’est-ce que la programmation orientée objet ?
-
139. Créer un objet littéral
-
140. Créer un objet avec un constructeur personnalisé
-
141. Les prototypes (chaîne des prototypes)
-
142. Créer un objet avec le constructeur Object
-
143. Comprendre l'héritage
-
-
145. Créer un objet avec une classe et un constructeur
-
146. Les Getter et les Setter
Partie 24 : Projet #5 - Fight Simulator
-
147. Qu'allons-nous faire dans ce projet ?
-
148. Etape 1 : Partir sur de bonnes bases
-
149. Etape 2 : Comprendre la structure des classes
-
150. Etape 3 : Créer la classe Personnage
-
151. Etape 4 : Créer la classe Magicien
-
152. Etape 5 : Créer la classe Guerrier
-
153. Etape 6 : Initialiser nos personnages et les faire combattre
-
Partie 25 : Devenez maître du temps
-
155. Récupérer la date actuelle
-
156. Utiliser l'objet Date
-
157. Les Getter et Setter disponibles de l'objet Date
-
158. Transformer une date au format local
-
159. Utiliser les "templates string" avec les dates
Partie 26 : Utiliser les API
-
160. Qu’est-ce qu’une API et comment ça fonctionne ?
-
161. L'extension à utiliser pour faciliter votre apprentissage
-
162. Récupérez le code pour la prochaine session
-
163. Utiliser une API : récupérer le prix du bitcoin (XMLHttpRequest)
-
164. Utiliser une API : envoyer des données
Partie 27 : Projet #6 - Une application météo
-
165. Qu'allons-nous faire dans ce projet ?
Extrait
-
166. Etape 1 : Comprendre le fonctionnement de l'API
-
167. Etape 2 : Construire la requête AJAX
-
168. Etape 3 : Mettre à jour l'interface
-
169. Etape 4 : Détecter le clic du bouton "Changer de ville"
-
170. Etape 5 : Appeler la fonction recevoirTemperature(ville)
-
Partie 28 : Utilisons les requêtes asynchrones, Callbacks & Promises
-
172. Qu'est-ce qu'un programme asynchrone ?
-
173. Nous avons déjà utilisé des requêtes asynchrones !
-
-
Partie 29 : Améliorons nos requêtes avec Fetch et Axios
-
176. Qu'est-ce que Fetch ?
-
177. Récupérer des données avec Fetch
-
178. Envoyer des données avec Fetch
-
179. Et la librairie Axios dans tout ça ?
-
180. Utilisons Axios pour récupérer des données
-
181. Utilisons Axios pour envoyer des données
Partie 30 : Stocker des données dans le navigateur avec JavaScript
-
-
183. Fiche technique sur les cookies et HttpOnly
-
184. LocalStorage et SessionStorage
Partie 31 : Projet #7 : Créer un thème qui se souvient de nous
-
185. Que devez-vous faire ?
-
186. Etape 1 : Comprendre le fonctionnement du programme
-
187. Etape 2 : Sélectionner les éléments nécessaires
-
188. Etape 3 : Rendre notre bouton fonctionnel
-
189. Etape 4 : Changer les classes au clic
-
190. Etape 5 : Créer la fonction modeSombre()
-
191. Etape 6 : Regarder si la préférence de l'utilisateur existe déjà
-
Partie 32 : Et si on écrivait plus vite avec jQuery ?
-
193. Qu’est-ce que jQuery ?
-
194. Comment utiliser jQuery ?
-
195. Sélectionner un élément
-
196. Modifier le contenu d'un élément
-
197. Modifier le style d'un élément
-
198. Ajouter et supprimer un élément
-
199. Modifier les attributs d'un élément
-
200. Ajouter des évènements
-
201. Faire une requête AJAX
-
202. Ajouter des animations
Partie 33 : Les inclassables
-
203. Géolocaliser un utilisateur
-
204. Créer des modules (import, export)
-
205. Utiliser le mode strict
Partie 34 : Projet #8 guidé - Application de météo géolocalisée
-
206. Que devez-vous faire ?
-
207. Etape 1 : Isoler la variable qui contient la ville à utiliser
-
208. Etape 2 : Vérifier que la géolocalisation est disponible
-
209. Etape 3 : Récupérer la position actuelle
-
210. Etape 4 : Utiliser une nouvelle API proposée par OpenWeatherMap
-
211. Etape 5 : Prévoir le cas où la géolocalisation ne peut pas se faire
-
212. Etape 6 : Définir les options
Partie 35 : Conclusion
-
213. Félicitations ! Vous avez terminé cette formation !