JSX

React 🟢 Junior

Définition

Syntaxe qui permet d'écrire du HTML dans du JavaScript. Le compilateur le transforme en appels React.createElement().

Analogie

C'est comme un moule a gâteau : tu dessines la forme en HTML, et React coule le JavaScript dedans.

Exemple de code

// JSX compile en createElement
const el = <h1 className="title">Bonjour</h1>;
// equivalent a :
const el2 = React.createElement('h1', { className: 'title' }, 'Bonjour');

Cas d'usage

Utilise dans chaque composant React pour décrire l'interface de manière déclarative.

Anti-pattern

Oublier que class s'écrit className et for s'écrit htmlFor en JSX.

Termes liés

#core#interview#syntax

En entretien

Explique-moi ce qu'est JSX.
C'est une syntaxe qui permet d'écrire du HTML dans du JavaScript, que le compilateur transforme en appels React.createElement(). On l'utilise dans chaque composant React pour décrire l'interface de manière déclarative.
Quel piège classique rencontre un débutant en JSX ?
Oublier que class s'écrit className et for s'écrit htmlFor en JSX, car ce sont des mots réservés en JavaScript. C'est une erreur fréquente en copiant du HTML brut.

Fiche mise à jour le 2026-09-27