Liste des exercices - Cours 122

Vue d'ensemble

Module	Titre	Exercices	Objectif
1	Bases JavaScript	9	Stocker des données
2	Conditions	6	Prendre des décisions
3	Boucles	4	Répéter des actions
4	Fonctions	4	Organiser ton code
5	Tableaux	11	Gérer des listes
6	Objets	10	Structurer des données
7	DOM	7	Manipuler la page
8	Événements & Formulaires	8	Réagir et récupérer
9	Promesses & API	8	Communiquer avec un serveur
10	Mini-projet guidé	6	Créer une vraie app !
Total		73

Accéder à Nuxy pour faire les exercices

Module 1 : Bases JavaScript

Tu vas apprendre à : stocker et manipuler des données

#	Exercice	Concept
1.1	Hello JavaScript !	console.log(), commentaires
1.2	Variables avec let	let, réassignation
1.3	Constantes avec const	const, convention MAJUSCULES
1.4	Types de données	String, Number, Boolean, null, undefined
1.5	Opérations mathématiques	+, -, *, /, %
1.6	Concaténation de texte	+ pour joindre des chaînes
1.7	Manipuler du texte	.length, .toUpperCase(), .trim(), .includes()
1.8	Les méthodes console	console.log, console.warn, console.error
1.9	L'environnement navigateur	alert, prompt, confirm

Ressources : Variables • Types • Chaînes

Module 2 : Conditions

Tu vas apprendre à : prendre des décisions dans ton code

#	Exercice	Concept
2.1	Première condition	if / else
2.2	Comparaisons et égalité	===, !==, <, >
2.3	Opérateurs logiques	&&, ||, !
2.4	Conditions multiples	else if
2.5	Le switch/case	switch, case, break
2.6	L'opérateur ternaire	condition ? valeurA : valeurB

Ressources : Conditions • Opérateurs

Module 3 : Boucles

Tu vas apprendre à : répéter des actions automatiquement

#	Exercice	Concept
3.1	La boucle while	while, condition d'arrêt
3.2	La boucle for	for, compteur, itération
3.3	Parcourir avec for...of	for...of, tableaux
3.4	do...while et break	do...while, break

Ressources : Boucles

Module 4 : Fonctions

Tu vas apprendre à : organiser ton code en blocs réutilisables

#	Exercice	Concept
4.1	Première fonction	Déclaration, appel
4.2	Fonction avec paramètres	Passer des valeurs
4.3	Fonction avec return	Retourner un résultat
4.4	Arrow function	() => {}

Ressources : Fonctions • Fonctions fléchées

Module 5 : Tableaux

Tu vas apprendre à : gérer des listes de données

#	Exercice	Concept
5.1	Créer un tableau	Déclaration, accès par index
5.2	Accéder aux éléments	Index, .length, dernier élément
5.3	Modifier un tableau	push, pop, shift, unshift
5.4	Parcourir un tableau	forEach
5.5	Trier un tableau	sort(), fonction de comparaison
5.6	Filtrer un tableau	filter()
5.7	Transformer un tableau	map()
5.8	Boucles for et for...of	for, for...of sur tableaux
5.9	Copier et fusionner	Spread ..., concat
5.10	Décomposer un tableau	Destructuring [a, b] = tableau
5.11	Décomposer un objet	Destructuring {nom, age} = objet

Ressources : Tableaux • Templates littéraux

Module 6 : Objets

Tu vas apprendre à : structurer et manipuler des données complexes

#	Exercice	Concept
6.1	Créer un objet	Création, propriétés clé-valeur
6.2	Accéder aux propriétés	Notation point et crochets
6.3	Modifier un objet	Ajout, modification, suppression
6.4	Tableau d'objets	Combiner tableaux et objets
6.5	Parcourir des objets	for...in, Object.keys()
6.6	Filtrer un tableau d'objets	filter() sur objets
6.7	Trier un tableau d'objets	sort() sur objets
6.8	Ajouter et supprimer des objets	push, splice, filter
6.9	Modifier un objet dans un tableau	find(), mise à jour ciblée
6.10	Techniques avancées de parcours	reduce(), chaînage de méthodes

Ressources : Objets • Tableaux

Module 7 : DOM

Tu vas apprendre à : manipuler les éléments de la page

#	Exercice	Concept
7.1	Sélectionner un élément	querySelector
7.2	Modifier le contenu	textContent, innerHTML
7.3	Modifier le style	style, propriétés CSS
7.4	Gérer les classes	classList.add/remove/toggle
7.5	Sélectionner plusieurs éléments	querySelectorAll
7.6	Bouton interactif	Combiner sélection et modification
7.7	Créer des éléments	createElement, appendChild

Ressources : Accéder aux éléments • Modifier le contenu • Créer des éléments

Module 8 : Événements & Formulaires

Tu vas apprendre à : réagir aux actions et récupérer les saisies utilisateur

#	Exercice	Concept
8.1	Ajouter un événement	addEventListener, click
8.2	L'objet event	event.target, propriétés
8.3	Événements sur plusieurs éléments	Boucle + addEventListener
8.4	Empêcher le comportement par défaut	preventDefault()
8.5	Lire la valeur d'un champ	.value, input event
8.6	Cases à cocher	.checked, état booléen
8.7	Valider un formulaire	Validation HTML5 et JavaScript
8.8	Soumettre un formulaire	submit event, collecte des données

Ressources : Événements • Formulaires • Validation

Module 9 : Promesses & API

Tu vas apprendre à : communiquer avec un serveur distant

#	Exercice	Concept
9.1	Comprendre les Promises	new Promise, resolve, reject
9.2	Chaîner les Promises	.then(), .catch()
9.3	Comprendre async/await	async, await, lisibilité
9.4	Récupérer des données	fetch() GET, .json()
9.5	Gérer les erreurs API	try/catch, codes HTTP
9.6	Envoyer des données (POST)	fetch() POST, body, headers
9.7	Modifier des données (PUT)	fetch() PUT, mise à jour
9.8	Supprimer des données (DELETE)	fetch() DELETE

Ressources : API JSONPlaceholder

Module 10 : Mini-projet guidé

Tu vas créer : une application "Gestionnaire de produits" complète !

#	Exercice	Fonctionnalité
10.1	Structure HTML de l'app	Squelette HTML/CSS
10.2	Afficher les produits	Charger et afficher depuis l'API
10.3	Recherche de produits	Recherche en temps réel
10.4	Tri et filtre par catégorie	Tri et filtrage dynamiques
10.5	Ajouter un produit (POST)	Formulaire d'ajout avec validation
10.6	Modifier et supprimer (PUT/DELETE)	CRUD complet

Ressources : localStorage • Créer des éléments

Progression visuelle

NIVEAU 1 - Fondamentaux (Modules 1-4)
══════════════════════════════════════
[■■■■] Variables      → Tu sais stocker des données
[■■■■] Conditions     → Tu sais prendre des décisions
[■■■■] Boucles        → Tu sais répéter des actions
[■■■■] Fonctions      → Tu sais organiser ton code

NIVEAU 2 - Structures de données (Modules 5-6)
══════════════════════════════════════
[■■■■] Tableaux       → Tu sais gérer des listes
[■■■■] Objets         → Tu sais structurer des données

NIVEAU 3 - Interaction (Modules 7-8)
══════════════════════════════════════
[■■■■] DOM            → Tu sais manipuler la page
[■■■■] Événements     → Tu sais réagir aux actions

NIVEAU 4 - Application (Modules 9-10)
══════════════════════════════════════
[■■■■] API            → Tu sais communiquer avec un serveur
[■■■■] Mini-projet    → Tu sais créer une vraie app !

Conseil

Faites les exercices dans l'ordre ! Chaque module s'appuie sur les précédents.