Aller au contenu principal
LaPolaris lance ses formations, profitez de -40% jusqu'au 30 juin ! En savoir plus
Formation 3 jours (21 heures) 790.00 € HT 474.00 € HT Tarif lancement - jusqu'au 30/06/2026

JavaScript fondamentaux : le langage du web

Maîtriser les bases de JavaScript pour créer des pages web interactives. Variables, fonctions, DOM, événements : tout ce qu'il faut pour prendre en main le langage du web.

Dernière mise à jour le 28/03/2026

Public visé

  • Développeurs débutants souhaitant acquérir les bases du JavaScript
  • Intégrateurs HTML/CSS voulant ajouter de l'interactivité à leurs interfaces
  • Personnes en reconversion vers le développement web front-end
  • Toute personne ayant des notions de HTML/CSS et souhaitant progresser vers le développement

Objectifs pédagogiques

  • Comprendre la syntaxe JavaScript ES6+ et ses fondamentaux
  • Manipuler le DOM pour modifier dynamiquement une page web
  • Gérer les événements utilisateur (clics, formulaires, clavier)
  • Effectuer des requêtes asynchrones vers une API avec Fetch et les promesses
  • Déboguer une application JavaScript avec les DevTools du navigateur
  • Structurer son code avec les modules ES6

Prérequis

  • Maîtrise des bases de HTML et CSS (niveau formation FND-HTM recommandée)
  • Savoir utiliser un éditeur de code (VS Code ou équivalent)
  • Aucune connaissance préalable en programmation requise

Programme détaillé

Jour 1 (7h) – Les bases du langage + introduction au DOM

Module 1 – Les bases du langage (5h)

Variables et types de données (1h30)
  • Déclarer et nommer des variables : bonnes pratiques
  • Les types de données : texte, nombre, booléen, valeur vide
  • La portée des variables : quand une variable est-elle accessible ?
  • Construire des chaînes de texte dynamiques

Opérateurs, conditions et boucles (1h30)
  • Comparer des valeurs et combiner des conditions
  • Prendre des décisions dans le code : si / sinon, cas multiples
  • Répéter des actions : boucles classiques et boucles sur des collections
  • Interrompre ou sauter une itération

Fonctions (1h)
  • Définir une fonction et lui passer des paramètres
  • La syntaxe moderne des fonctions fléchées
  • Valeurs par défaut et paramètres multiples
  • Retourner un résultat depuis une fonction

Tableaux et objets (1h)
  • Créer et manipuler des listes de données
  • Filtrer, transformer et rechercher dans une liste
  • Structurer des données complexes avec les objets
  • Fusionner et copier des tableaux et objets

Exercice pratique (30min)
  • Manipulation d'un catalogue de produits : filtrage, transformation et affichage

Module 2 – Le DOM (2h)

Introduction au DOM (1h)
  • Qu'est-ce que le DOM ? Le lien entre HTML et JavaScript
  • Trouver un élément dans la page
  • Naviguer dans la structure d'une page

Modification du contenu et des styles (1h)
  • Modifier le texte et le contenu d'un élément
  • Changer les attributs d'un élément
  • Ajouter, supprimer ou basculer une classe CSS
  • Modifier l'apparence d'un élément depuis le code

Jour 2 (7h) – DOM avancé, événements et introduction à l'asynchrone

Module 2 (suite) – Événements (4h)

Création et suppression d'éléments (1h30)
  • Créer un nouvel élément et l'insérer dans la page
  • Supprimer ou déplacer un élément existant
  • Dupliquer un élément
  • Cas pratique : générer dynamiquement une liste de cartes depuis des données

Événements et interactions utilisateur (2h30)
  • Réagir à une action utilisateur : clic, frappe clavier, soumission de formulaire
  • Accéder aux informations de l'événement déclenché
  • Empêcher le comportement par défaut du navigateur
  • Gérer des éléments ajoutés dynamiquement
  • Cas pratique : formulaire interactif avec validation en temps réel

Module 3 – L'asynchrone (3h)

Comprendre l'asynchrone (1h30)
  • Pourquoi certaines opérations prennent du temps ?
  • Exécuter du code après qu'une action soit terminée
  • Enchaîner des opérations asynchrones proprement
  • Gérer les succès et les erreurs

La syntaxe moderne de l'asynchrone (1h30)
  • Écrire du code asynchrone qui ressemble à du code synchrone
  • Gérer les erreurs de manière élégante
  • Lancer plusieurs opérations en parallèle
  • Cas pratique : simulation d'appels distants avec des délais

Jour 3 (7h) – Communication avec les APIs, modules et mini-projet

Module 3 (suite) – Communiquer avec une API (2h)

Récupérer des données depuis un serveur (1h)
  • Envoyer une requête à un serveur et récupérer la réponse
  • Lire et afficher des données reçues dans la page
  • Gérer les erreurs réseau et les réponses inattendues

Envoyer des données vers un serveur (1h)
  • Soumettre des données à une API
  • Formater correctement les données avant envoi
  • Gérer les différents types de réponse du serveur
  • Cas pratique : soumission d'un formulaire vers une API

Module 4 – Organisation du code et bonnes pratiques (3h)

Découper son code en modules (1h)
  • Pourquoi séparer son code en fichiers ?
  • Exporter et importer des fonctions entre fichiers
  • Organiser un projet de façon lisible et maintenable

Structure d'un projet front-end (1h)
  • Arborescence recommandée d'un projet
  • Séparer la structure, le style et le comportement
  • Conventions de nommage et lisibilité du code

Déboguer une application (1h)
  • Inspecter l'état de son application à tout moment
  • Mettre en pause l'exécution pour analyser un problème
  • Surveiller les échanges réseau entre la page et le serveur
  • Identifier et corriger les erreurs les plus fréquentes

Module 5 – Mini-projet fil rouge (2h)
  • Cahier des charges : liste de tâches connectée à un serveur
  • Fonctionnalités : afficher, ajouter, supprimer et filtrer des tâches
  • Organisation du code en modules
  • Revue de code collective : lisibilité, gestion des erreurs, structure
  • Retour formateur individualisé

Compétences visées

  • Écrire du JavaScript moderne (ES6+) : variables, fonctions fléchées, destructuring
  • Manipuler le DOM dynamiquement : sélection, création et modification d'éléments
  • Gérer des événements et interactions utilisateur
  • Consommer une API REST simple en JavaScript asynchrone
  • Organiser un projet front-end avec des modules

Modalités et méthodes pédagogiques

 Formation délivrée en présentiel ou distanciel (visioconférence). Le formateur alterne entre méthode démonstrative (live coding), méthode interrogative (questionnement des apprenants) et méthode active (exercices pratiques et mini-projet fil rouge). Chaque module s'appuie sur des cas concrets issus du terrain. 

Modalités d'évaluation

  • En cours de formation : exercices pratiques corrigés à chaque module, études de cas
  • En fin de formation : réalisation d'un mini-projet applicatif évalué par le formateur
  • Questionnaire d'auto-évaluation des acquis en fin de parcours

Critères d'évaluation

  • Capacité à écrire du JavaScript syntaxiquement correct et fonctionnel
  • Manipulation autonome du DOM et des événements
  • Réalisation d'un appel API et affichage des données reçues
  • Structuration et lisibilité du code produit
  • Autonomie dans la résolution de problèmes simples

Modalités de validation

Attestation de fin de formation délivrée à l'issue du parcours, conditionnée à une assiduité d'au moins 80 % et à la réalisation du mini-projet final. L'attestation précise les objectifs atteints et les compétences acquises. 

Moyens pédagogiques et techniques

  • Support de cours numérique mis à disposition des apprenants
  • Environnement de développement : VS Code + navigateur Chrome
  • Exercices pratiques progressifs pour chaque module
  • Accès à un dépôt de ressources et d'exemples de code
  • Pour le distanciel : visioconférence (Microsoft Teams), partage d'écran, chat en direct
  • Accès à la plateforme pédagogique LaPolaris (supports, ressources, émargement)

Accessibilité aux personnes en situation de handicap

Nos formations sont accessibles aux personnes en situation de handicap. Pour toute situation nécessitant un aménagement (matériel, temporel ou pédagogique), nous vous invitons à nous contacter avant l'inscription afin d'étudier les adaptations possibles. Référent handicap : contact@lapolaris.fr

Suivi et accompagnement

  • Feuilles d'émargement signées par demi-journée (présentiel) ou émargement numérique (distanciel)
  • Traçabilité des activités pédagogiques réalisées
  • Attestation d'assiduité délivrée en fin de formation
  • Suivi individuel de la progression via les exercices pratiques

Conditions d'accès

Formation accessible sur inscription, sous réserve de validation des prérequis.

Délais d'accès

Inscription possible jusqu'à 5 jours ouvrés avant le début de la session. Pour toute demande urgente, nous contacter directement.