Tutoriel Réagir


Tutoriel React

2-16100309252M91.JPG

React est une bibliothèque JAVASCRIPT permettant de créer des interfaces utilisateur.

React est principalement utilisé pour créer une interface utilisateur. Beaucoup de gens pensent que React est le V (vue) de MVC.

React est né d'un projet interne à Facebook, utilisé pour créer le site Web d'Instagram et a été open source en mai 2013.

React a des performances élevées et une logique de code très simple. De plus en plus de gens ont commencé à y prêter attention et à l'utiliser.

Fonctionnalités de React

  • 1. Conception déclarative −React adopte un paradigme déclaratif, qui facilite la description des applications. .

  • 2. Efficacité −React minimise l'interaction avec le DOM en simulant le DOM.

  • 3. Flexible −React peut bien fonctionner avec des bibliothèques ou des frameworks connus.

  • 4.JSX - JSX est une extension de la syntaxe JavaScript. JSX n'est pas requis pour le développement de React, mais il est recommandé.

  • 5. Composants − La création de composants via React facilite la réutilisation du code et peut être bien appliquée dans le développement de grands projets.

  • 6. Flux de données de réponse unidirectionnelle - React implémente un flux de données de réponse unidirectionnelle, réduisant ainsi le code répété, c'est pourquoi il est meilleur que les données traditionnelles. La liaison est plus simple.

Ce que vous devez savoir avant de lire ce tutoriel :

Avant de commencer à apprendre React, vous devez avoir les connaissances de base suivantes :

  • HTML5

  • CSS

  • JavaScript

React First Exemple

Dans chaque chapitre, vous pouvez modifier l'exemple en ligne et cliquer sur le bouton pour voir le résultat.

Ce tutoriel utilise la version 0.14.7 de React. Vous pouvez télécharger la dernière version sur le site officiel http://facebook.github.io/react/.

Instance

<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8" />
    <title>Hello React!</title>
    <script src="http://static.php.cn/assets/react/react-0.14.7/build/react.min.js"></script>
    <script src="http://static.php.cn/assets/react/react-0.14.7/build/react-dom.min.js"></script>
    <script src="http://static.php.cn/assets/react/browser.min.js"></script>
  </head>
  <body>
    <div id="example"></div>
    <script type="text/babel">
      ReactDOM.render(
        <h1>Hello, world!</h1>,
        document.getElementById('example')
      );
    </script>
  </body>
</html>

Exécuter l'instance»

Cliquez sur le bouton « Exécuter l'instance » pour afficher l'instance en ligne