web:framework:react

Ceci est une ancienne révision du document !


React

NodeJS requis

Création du projet :

npx create-react-app my-app

Eventuellement avec le support typeScript :

npx create-react-app my-app --template typescript

Démarrage du serveur

cd my-app
npx start

En React, tout est composant, et les composants peuvent être créés à partir de fonctions, ou de classes.

Un composant peut être créé à partir d'une fonction :

function App() {
  return (
    <div className="App">
      <h1>Hello World!</h1>
    </div>
  );
}

export default App;

Imbrication & propriétés

Un composant peut définir des propriétés (props passé en paramètre de la fonction, ou au constructeur de la classe).

Composant MyTytle disposant d'une propriété title :

function MyTitle(props) {
  return (
    <h1>
        {props.title}
    </h1>
  );
}

export default MyTitle;

Et les initialiser en JSX via l'attribut du même nom.
Utilisation de MyTitle dans l'App :

function App() {
  return (
    <div className="App">
      <MyTitle title="Hello World!"/>
    </div>
  );
}

export default App;

  • web/framework/react.1678927221.txt.gz
  • Dernière modification : il y a 3 ans
  • de jcheron