JavaScript : Introduction
Le langage du web : d'où vient JavaScript, où il s'exécute (navigateur, Node.js) et tout ce qu'on peut construire avec, avant de plonger dans React.
JavaScript : Introduction
Avant React, avant Next.js, avant tout framework, il y a JavaScript. C'est le langage sur lequel repose tout le web moderne. Avant de parler composants ou de rendu, posons les fondations : qu'est-ce que JavaScript, et qu'est-ce qu'on peut faire avec ?
# JavaScript, c'est quoi ?
JavaScript (souvent abrégé JS) est le langage de programmation du web. À l'origine, il a été créé pour une seule chose : rendre les pages web interactives, c'est-à-dire réagir à un clic, valider un formulaire ou mettre à jour du contenu sans recharger la page.
Ses caractéristiques principales :
- Interprété : pas de compilation préalable, le code s'exécute directement (dans le navigateur ou via un moteur comme Node).
- Dynamiquement typé : une variable n'a pas de type fixe, contrairement au C# où tout est défini à la compilation. (C'est ce que TypeScript vient rajouter par-dessus.)
- Multi-paradigme : on peut coder de façon impérative, orientée objet ou fonctionnelle.
Surtout, c'est le seul langage que les navigateurs comprennent nativement. HTML et CSS décrivent la page ; JavaScript la fait vivre.
# Un peu d'histoire
JavaScript est créé en 1995 par Brendan Eich chez Netscape, en une dizaine de jours seulement. Le nom « JavaScript » est un pur coup marketing pour surfer sur la popularité de Java à l'époque. Les deux langages n'ont pourtant aucun lien technique.
Le langage est ensuite standardisé sous le nom ECMAScript. La version ES6 (2015) marque un tournant majeur : elle modernise complètement le langage (let/const, fonctions fléchées, classes, modules, promesses) et pose les bases du JavaScript qu'on écrit aujourd'hui.
# Le langage du navigateur
Dans une page web, les trois technologies se répartissent les rôles :
| Techno | Rôle |
|---|---|
| HTML | La structure (le squelette) |
| CSS | Le style (l'apparence) |
| JavaScript | Le comportement (l'interactivité) |
Concrètement, JavaScript peut manipuler la page (le DOM), réagir aux actions de l'utilisateur et mettre à jour l'affichage en temps réel :
document.querySelector("#bouton").addEventListener("click", () => {
document.querySelector("#message").textContent = "Bouton cliqué !";
});document.querySelector("#bouton").addEventListener("click", () => { document.querySelector("#message").textContent = "Bouton cliqué !";});# Pas que le navigateur : Node.js
Longtemps, JavaScript est resté cantonné au navigateur. Puis en 2009, Node.js le libère : il permet d'exécuter du JavaScript en dehors du navigateur, directement sur une machine.
Résultat : on peut désormais écrire des serveurs, des API, des outils en ligne de commande et des scripts entièrement en JavaScript. Un même langage côté client et côté serveur, c'est l'un des grands atouts de l'écosystème JS. (Ce portfolio lui-même tourne sur Node.)
# Qu'est-ce qu'on peut faire avec ?
Parti d'un simple langage de scripts pour navigateur, JavaScript est aujourd'hui partout :
| Domaine | Exemples |
|---|---|
| Sites & apps web | Interfaces interactives (front-end) |
| Serveurs & API | Node.js, Express, NestJS |
| Applications mobiles | React Native, Ionic |
| Applications desktop | Electron (VS Code, Discord sont en Electron) |
| Outils & automatisation | Scripts, CLI, build tools |
Autrement dit : on peut construire une application complète, du front au back, avec un seul langage.
# L'écosystème
La force de JavaScript, c'est aussi son écosystème gigantesque. Au centre : npm (Node Package Manager), le plus grand registre de paquets au monde, avec des millions de bibliothèques réutilisables installables en une commande.
C'est dans cet écosystème que sont nés les grands frameworks front : React, Vue, Angular, Svelte. Ils partent tous du même constat : manipuler le DOM à la main devient vite ingérable sur une grosse application.
Et c'est précisément là qu'arrive React.
# Pour résumer
- JavaScript est le langage du web, né en 1995, aujourd'hui exécuté partout : navigateur et serveur (via Node).
- On peut tout construire avec : sites interactifs, serveurs, apps mobiles et desktop, scripts.
- Son écosystème (npm) a donné naissance aux frameworks front modernes.
Prochaine étape : découvrir React, la bibliothèque JavaScript qui simplifie la création d'interfaces. Direction React & Next.js : Introduction.
Pour aller plus loin
JavaScript : Les bases
Variables (let / const), types, fonctions, conditions et boucles : la boîte à outils de base pour écrire du JavaScript au quotidien.
JavaScript : Opérateurs modernes
Truthy / falsy, court-circuit avec && et ||, nullish coalescing (??) et optional chaining (?.) : les opérateurs qu'on lit à chaque ligne de JSX.
JavaScript : Les modules
Découper son code en fichiers avec import / export : exports nommés et par défaut, ESM contre CommonJS, et comment React organise tout ça.
JavaScript : Portée & closures
Où vivent les variables (portée globale, de fonction, de bloc), le hoisting, et les closures : le mécanisme qui fait tourner useState en React.