Tutorial React


Tutorial React

2-16100309252M91.JPG

React ialah perpustakaan JAVASCRIPT untuk membina antara muka pengguna.

React digunakan terutamanya untuk membina UI Ramai orang berpendapat bahawa React ialah V (pandangan) dalam MVC.

React berasal sebagai projek dalaman di Facebook, digunakan untuk membina tapak web Instagram dan sumber terbuka pada Mei 2013.

React mempunyai prestasi tinggi dan logik kod yang sangat mudah Semakin ramai orang mula memberi perhatian dan menggunakannya.

Ciri Reaksi

  • 1. Reka Bentuk Pengisytiharan −React mengamalkan paradigma deklaratif yang boleh menerangkan aplikasi dengan mudah.

  • 2. Kecekapan −React meminimumkan interaksi dengan DOM dengan mensimulasikan DOM.

  • 3. Fleksibel −React boleh berfungsi dengan baik dengan perpustakaan atau rangka kerja yang diketahui.

  • 4.JSX − JSX ialah lanjutan sintaks JavaScript. JSX tidak diperlukan untuk pembangunan React, tetapi ia disyorkan.

  • 5. Komponen − Membina komponen melalui React menjadikannya lebih mudah untuk menggunakan semula kod dan boleh digunakan dengan baik dalam pembangunan projek besar.

  • 6. Aliran data tindak balas sehala − React melaksanakan aliran data tindak balas sehala, dengan itu mengurangkan kod berulang, itulah sebabnya ia lebih baik daripada data tradisional Pengikatan lebih mudah.

Apa yang anda perlu tahu sebelum membaca tutorial ini:

Sebelum anda mula belajar React, anda perlu mempunyai pengetahuan asas berikut:

  • HTML5

  • CSS

  • JavaScript

React First Contoh

Dalam setiap bab, anda boleh mengedit contoh dalam talian dan klik butang untuk melihat hasilnya.

Tutorial ini menggunakan React versi 0.14.7 Anda boleh memuat turun versi terkini daripada tapak web rasmi 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>

Run Instance»

Klik butang "Run Instance" untuk melihat contoh dalam talian