Full Stack Web Developer

## Présentation du projet Vous allez démarrer la construction d'une application To-Do List (liste de tâches) en JavaScript ES6+. Ce mini-projet se déroule en deux parties : cette première partie est entièrement centrée sur la **structure HTML**, la *...

Dans les chapitres précédents, vous avez appris à sélectionner des éléments du Document Object Model (le DOM, c'est-à-dire la représentation en mémoire de votre page HTML), à en modifier le contenu, et à créer ou supprimer des nœuds dynamiquement. No...

RAPPEL THÉORIQUE Dans les chapitres précédents, tu as appris à sélectionner des éléments du DOM, à modifier leur contenu, à jouer avec classList, et surtout à créer, insérer et supprimer des nœuds. Tu as aussi manipulé des tableaux d'objets et découv...

Jusqu'ici, vous avez appris à sélectionner des éléments existants dans une page web et à modifier leur contenu ou leurs classes. Nous franchissons maintenant une étape essentielle : apprendre à créer de nouveaux éléments, à les insérer dans la page, ...

RAPPEL THÉORIQUE Dans le chapitre précédent, tu as appris à sélectionner des éléments du DOM avec des méthodes comme document.querySelector et document.querySelectorAll, puis à modifier leur contenu textuel. Nous allons maintenant nous concentrer sur...

RAPPEL THÉORIQUE Le DOM (Document Object Model) est la représentation en mémoire de ta page HTML sous forme d'arbre de nœuds. JavaScript peut lire et modifier cet arbre grâce à l'objet global 'document'. Pour agir sur un élément, tu dois d'abord le s...

Jusqu'à présent, vous avez appris à manipuler des données en JavaScript : les variables, les tableaux, les objets, les boucles et les méthodes comme map, filter ou reduce. Ces compétences sont essentielles, mais elles restaient jusqu'ici confinées da...

Depuis la version 2015 du langage JavaScript, appelée ES6 (abréviation de ECMAScript 2015), plusieurs outils syntaxiques ont été ajoutés pour écrire un code plus court, plus lisible et moins répétitif. Ce chapitre se concentre sur trois de ces outils...

RAPPEL THÉORIQUE Un tableau d'objets est simplement un tableau (array) dont chaque élément est un objet littéral. C'est la structure de données la plus courante en développement web : c'est ainsi qu'on représente une liste de produits, d'utilisateurs...

RAPPEL THÉORIQUE Un objet littéral en JavaScript est une structure qui regroupe des données (les propriétés) et des comportements (les méthodes) sous un même nom. On le déclare avec des accolades, chaque paire étant composée d'une clé et d'une valeur...

Après avoir manipulé les tableaux, leurs boucles et leurs méthodes avancées comme map, filter et reduce, il est temps de découvrir une autre structure fondamentale de JavaScript : l'objet littéral. Là où un tableau range des valeurs dans un ordre num...

RAPPEL THÉORIQUE En JavaScript ES6, les méthodes de tableau map, filter et reduce sont des outils fondamentaux pour manipuler des collections de données sans écrire de boucles manuelles. Le mental model à retenir : ces méthodes ne modifient pas le ta...

Jusqu'à présent, vous avez appris à parcourir un tableau avec les boucles for, for…of et while. Ces boucles fonctionnent parfaitement, mais elles exigent que vous écriviez vous-même toute la mécanique : initialiser un compteur, gérer les indices, pré...

Les boucles sont un des piliers de la programmation. Elles permettent de répéter automatiquement une même action plusieurs fois, sans avoir à réécrire le code manuellement. Dans le langage JavaScript, elles sont particulièrement utiles pour parcourir...

RAPPEL THÉORIQUE En JavaScript ES6+, un tableau (array) permet de stocker une collection ordonnée de valeurs. On le crée avec des crochets : const notes = [12, 8, 15, 17, 6]. Chaque élément est accessible par son indice, en commençant à zéro : notes[...

RAPPEL THÉORIQUE Un tableau (array) en JavaScript est une structure ordonnée qui contient plusieurs valeurs accessibles par leur indice, en commençant à 0. Le mental model utile : imaginez une rangée de casiers numérotés. `taches[0]` désigne le premi...

Après avoir manipulé les variables, les fonctions, les conditions et les événements du navigateur, il est temps de découvrir l'une des structures de données les plus utilisées en JavaScript : le tableau. Un tableau (en anglais array) est une structur...

Après avoir découvert les variables, les fonctions, les conditions et les premiers événements du navigateur, il est temps de prendre du recul et d'adopter le point de vue d'un développeur professionnel. Écrire du code qui fonctionne ne suffit pas : i...

Écrire un script qui fonctionne est une chose. Écrire un script que d'autres personnes (ou vous-même dans six mois) pourront lire, comprendre et modifier facilement en est une autre. Ce chapitre de synthèse rassemble les bonnes pratiques qui transfor...

RAPPEL THÉORIQUE Jusqu'ici, vous avez manipulé des variables, des fonctions et vu un aperçu des événements du navigateur. Il est temps de relier ces briques. Un événement est une action de l'utilisateur (clic, survol, saisie clavier) que le navigateu...

Jusqu'à présent, vous avez appris à écrire des variables, des conditions et des fonctions en JavaScript. Vous avez même utilisé la commande prompt pour demander des informations à l'utilisateur, comme dans l'atelier du compteur de clics. Mais dans un...

RAPPEL THÉORIQUE En JavaScript, une variable déclarée avec 'let' peut être modifiée après sa création, contrairement à 'const' qui reste constante. Pour un compteur, on utilise donc 'let compteur = 0;' car sa valeur va évoluer. La fonction native 'pr...

La portée, appelée en anglais scope, désigne la zone de ton programme dans laquelle une variable ou une fonction est accessible et utilisable. Comprendre la portée est essentiel car cela détermine où tu peux lire ou modifier une valeur, et où tu obti...

RAPPEL THÉORIQUE Une fonction est un bloc de code réutilisable qui accomplit une tâche précise. En JavaScript ES6, on peut la déclarer de façon classique (function additionner(a, b) { return a + b; }) ou sous forme de fonction fléchée (const addition...

RAPPEL THÉORIQUE En JavaScript ES6, une fonction est un bloc de code réutilisable qui prend éventuellement des paramètres en entrée et retourne une valeur. Les fonctions fléchées (arrow functions) offrent une syntaxe concise : `const saluer = (nom) =...