La syntaxe JSX

Voir la vidéo
Description Sommaire

Pour découvrir React nous avons utiliser la fonction React.createElement mais cela produit un code qui est assez verbeux et assez peu lisible. Pour simplifier la création d'éléments React il est possible d'utiliser une syntaxe spécifique : La syntaxe JSX.

Cette syntaxe étant propre à React elle n'est pas comprise par le navigateur et il nous faudra donc un outil pour convertir le JSX en JavaScript. On peut utiliser différents outils pour cela (Webpack avec babel, Parcel, Rollup avec babel, Esbuild...) mais pour commencer notre découverte on va se contenter de charger babel en mode standalone (cette approche ne sera utilisée qu'à des fins didactique).

<script src="https://unpkg.com/babel-standalone@6/babel.min.js"></script>
<script src="app.js" type="text/babel" defer>

Cela permet de travailler avec React dans le navigateur et d'expérimenter. Nous verrons les outils qui permettent de convertir le JSX en React plus tard dans cette formation.

Publié
Technologies utilisées
Auteur :
Grafikart
Partager