Développement web front-end
JavaScript avancé : objets, asynchrone et modules
Maîtriser les mécanismes profonds du langage pour écrire un code robuste, modulaire et maintenable.
- Durée
- 21 h · 3 jours
- Niveau
- Intermédiaire
- Format
- Présentiel · Distanciel · Mixte
- Effectif max.
- 12 participants
Présentation
Ce programme s’adresse aux développeurs qui utilisent déjà JavaScript et veulent comprendre ce qui se passe sous le capot : contextes d’exécution, prototypes, closures, programmation asynchrone, modules et API du navigateur. On y apprend à éviter les pièges classiques du langage, à structurer un projet en modules et à déboguer efficacement.
À qui s’adresse ce programme
- Développeurs front-end et full stack
- Équipes qui reprennent ou refactorisent du code JavaScript existant
- Développeurs venant d’autres langages
Prérequis
- Pratique courante des bases de JavaScript
- Connaissance du DOM et de HTML/CSS
Objectifs pédagogiques
- Expliquer les contextes d’exécution, le hoisting et le comportement de this
- Utiliser prototypes, classes et héritage
- Appliquer la programmation fonctionnelle et les closures
- Maîtriser promesses, async/await et la boucle d’événements
- Organiser son code en modules et le contrôler avec un linter
- Utiliser les API HTML5 de stockage et de communication
Programme détaillé
6 modules · 21 h · 3 jours
Jour 1
Outils de débogage et pièges du langage
30 % théorie · 70 % pratique
- Déboguer avec les outils du navigateur et de l’éditeur
- Typage faible et conversions implicites
- Hoisting, portée et contexte global
- Mode strict et erreurs fréquentes
- Comparaisons et valeurs falsy
🛠 Ateliers pratiques
Chasse aux bugs1,5 h
Corriger un jeu de scripts contenant des bugs typiques.
✅ Livrable : Une liste de bugs expliqués et corrigés
Programmation objet en JavaScript
50 % théorie · 50 % pratique
- Objets littéraux et fonctions constructeurs
- Prototypes et chaîne de prototypes
- Classes, héritage et champs privés
- Getters, setters et encapsulation
- Composition plutôt qu’héritage
Jour 2
Programmation fonctionnelle et closures
30 % théorie · 70 % pratique
- Fonctions anonymes, fléchées et IIFE
- Closures et état privé
- map, filter, reduce et chaînage
- Fonctions pures et immutabilité
- Currying et composition
🛠 Ateliers pratiques
Boîte à outils fonctionnelle1,5 h
Écrire une petite bibliothèque d’utilitaires fonctionnels.
✅ Livrable : Une bibliothèque testée
Asynchronisme et boucle d’événements
30 % théorie · 70 % pratique
- Pile, file de messages et boucle d’événements
- Promesses et enchaînements
- async/await et gestion des erreurs
- Promise.all, race et allSettled
- Annulation et délais d’attente
🛠 Ateliers pratiques
Client d’API robuste1,5 h
Écrire un module d’appels API avec reprise sur erreur.
✅ Livrable : Un client d’API fiable
Jour 3
Modules et qualité du code
30 % théorie · 70 % pratique
- Modules ES : import et export
- Organiser un projet en modules
- Linter et formateur
- Bonnes pratiques de nommage et de structure
- Bundlers : principes
🛠 Ateliers pratiques
Refactorisation en modules1,5 h
Découper un script monolithique en modules.
✅ Livrable : Un projet modulaire
API HTML5 et JavaScript côté serveur
50 % théorie · 50 % pratique
- Validation de formulaires et stockage local
- IndexedDB, WebSockets et service workers : panorama
- JavaScript dans le navigateur ou dans Node.js
- Écrire un petit serveur REST
- Nouveautés récentes du langage
Outils et technologies
JavaScriptNode.jsVisual Studio Code
Méthodes pédagogiques
- Alternance d’exposés courts et de travaux pratiques
- Démonstrations en direct par le formateur
- Projet fil rouge construit au fil des modules
- Corrections collectives et échanges sur les bonnes pratiques
Évaluation
- Exercices pratiques corrigés à chaque module
- Mini-projet réalisé en fin de formation
- Quiz de validation des acquis
Matériel requis
- Un ordinateur avec une connexion internet
- Un éditeur de code, un navigateur récent et Node.js
Ressources fournies
- Support de cours et dépôt d’exercices corrigés
Débouchés
- Un code plus fiable et mieux structuré
- Aisance avec les frameworks modernes
- Capacité à déboguer des bugs subtils
Les cours vidéo associés
Mes cours en vidéo qui accompagnent ce programme : pour préparer la formation ou réviser ensuite. Accès gratuit avec un compte.
