Développement web front-end
JavaScript : les bases pour dynamiser ses pages
Apprendre le langage, manipuler le DOM, gérer les formulaires et échanger avec un serveur.
- Durée
- 21 h · 3 jours
- Niveau
- Débutant
- Format
- Présentiel · Distanciel · Mixte
- Effectif max.
- 12 participants
Présentation
Ce programme initie à JavaScript côté navigateur. Les participants découvrent la syntaxe du langage, apprennent à manipuler la page et à réagir aux actions de l’utilisateur, puis à valider des formulaires et à communiquer avec un serveur. Chaque notion est mise en pratique sur un petit projet qui prend de l’ampleur au fil des trois jours.
À qui s’adresse ce programme
- Intégrateurs web souhaitant passer à la programmation
- Développeurs débutants
- Reconversions vers le développement web
Prérequis
- Connaissance de HTML et de CSS
- Logique de programmation de base (variables, conditions, boucles) appréciée
Objectifs pédagogiques
- Maîtriser la syntaxe de base de JavaScript
- Sélectionner et modifier les éléments de la page
- Réagir aux événements et valider les formulaires
- Écrire des fonctions et utiliser les fonctions fléchées
- Échanger avec un serveur de façon asynchrone
- Utiliser les apports récents du langage
Programme détaillé
6 modules · 21 h · 3 jours
Jour 1
Découvrir le langage
30 % théorie · 70 % pratique
- JavaScript et son écosystème
- Variables, types, opérateurs
- Conditions et boucles
- Tableaux, objets et JSON
- Console du navigateur et débogage de base
🛠 Ateliers pratiques
Premiers scripts1,5 h
Écrire une série de petits programmes en console.
✅ Livrable : Un fichier de scripts commentés
Fonctions et portée
50 % théorie · 50 % pratique
- Déclarer et appeler une fonction
- Paramètres, valeurs de retour et valeurs par défaut
- Fonctions fléchées
- Portée des variables et notion de this
- Fonctions de rappel
Jour 2
Manipuler le DOM
30 % théorie · 70 % pratique
- Arbre du document et sélecteurs
- Lire et modifier contenus et attributs
- Créer et supprimer des éléments
- Piloter les styles depuis JavaScript
- Gestion des événements et délégation
🛠 Ateliers pratiques
Liste de tâches interactive2 h
Construire une application de gestion de tâches dans la page.
✅ Livrable : Une application interactive
Formulaires et validation
50 % théorie · 50 % pratique
- Lire les valeurs d’un formulaire
- Écrire des contrôles de saisie
- Afficher les messages d’erreur
- Empêcher l’envoi et traiter les données
- Expressions régulières utiles
Jour 3
Échanges asynchrones avec un serveur
30 % théorie · 70 % pratique
- Principe de l’asynchronisme
- Promesses et async/await
- Appeler une API avec fetch
- Traiter la réponse JSON et gérer les erreurs
- Afficher des données distantes dans la page
🛠 Ateliers pratiques
Application météo ou citations2 h
Consommer une API publique et afficher les résultats.
✅ Livrable : Une page alimentée par une API
Adapter l’interface et aller plus loin
50 % théorie · 50 % pratique
- Media queries depuis JavaScript
- Nouveautés récentes du langage
- Stockage local dans le navigateur
- Utiliser un assistant d’IA pour apprendre et déboguer
- Pistes pour poursuivre : modules, outils, frameworks
Outils et technologies
CSS3HTML5JavaScriptVisual 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 et un navigateur récent
Ressources fournies
- Support de cours et dépôt d’exercices corrigés
Débouchés
- Un mini-projet interactif en JavaScript
- Capacité à lire et corriger du code JavaScript
- Préparation à l’apprentissage d’un framework
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.
