Notice: This page requires JavaScript to function properly.
Please enable JavaScript in your browser settings or update your browser.
Apprendre Introduction à JSX dans React | Introduction aux Fondamentaux de React
Maîtrise de React
course content

Contenu du cours

Maîtrise de React

Maîtrise de React

2. Stylisation dans les Applications React
3. Hooks et Contexte React
4. React in the Real World

book
Introduction à JSX dans React

En React, nous utilisons une extension de syntaxe de JavaScript appelée JSX (JavaScript XML) pour construire nos interfaces utilisateur. JSX nous permet d'écrire du code semblable à HTML directement dans JavaScript.

JavaScript dans HTML

L'un des grands avantages de JSX est qu'il combine la puissance de JavaScript avec HTML. Nous pouvons utiliser des expressions et de la logique JavaScript directement dans le code semblable à HTML. Pour intégrer du JavaScript, placez-le entre des accolades, comme ceci : { JavaScript code }.

Comment fonctionne JSX : Un exemple

Voyons JSX en action avec un exemple simple. Supposons que nous voulions rendre un élément de titre dans l'application React :

Dans cet exemple, nous utilisons JSX pour créer une constante appelée element qui contient un élément <h1> avec le texte "Hello, React!".

Remarque

Sous le capot, React prend ce code JSX et le rend efficacement dans le DOM, en faisant un moyen transparent et puissant de construire des interfaces utilisateur.

1. Que signifie JSX dans React ?

2. Quelle est la manière correcte de créer un élément HTML qui afficherait la chaîne Hey there, React Developer! ?

Que signifie JSX dans React ?

Que signifie JSX dans React ?

Sélectionnez la réponse correcte

Quelle est la manière correcte de créer un élément HTML qui afficherait la chaîne `Hey there, React Developer!` ?

Quelle est la manière correcte de créer un élément HTML qui afficherait la chaîne Hey there, React Developer! ?

Sélectionnez la réponse correcte

Tout était clair ?

Comment pouvons-nous l'améliorer ?

Merci pour vos commentaires !

Section 1. Chapitre 4
We're sorry to hear that something went wrong. What happened?
some-alt