Deklaratif
React membuat proses pembuatan antarmuka pengguna interaktif menjadi lebih mudah. Buat tampilan sederhana untuk setiap state di aplikasi Anda, dan React akan secara efisien memperbarui dan me-render hanya komponen yang diperlukan ketika data Anda berubah.
Tampilan yang deklaratif membuat jalannya kode Anda menjadi lebih terprediksi dan lebih mudah untuk di-debug.
Berbasis Komponen
Bangun komponen-komponen terenkapsulasi yang mengatur state-nya sendiri, kemudian gabungkan mereka untuk membentuk antarmuka pengguna yang lebih kompleks.
Karena logika pada komponen React ditulis langsung menggunakan JavaScript (bukan menggunakan templat), Anda dapat dengan mudah mengoper data melalui aplikasi Anda dan menempatkan state agar tetap berada di luar DOM.
Belajar Sekali, Tulis di Mana saja
Kami tidak berasumsi mengenai teknologi yang Anda gunakan di dalam stak Anda, jadi Anda dapat mengembangkan fitur baru menggunakan React tanpa menulis ulang kode yang sudah ada.
React juga dapat digunakan untuk me-render di server menggunakan Node dan menulis aplikasi telepon seluler menggunakan React Native.
Sebuah Komponen Sederhana
Komponen React menggunakan sebuah method bernama render() yang menerima masukan data dan mengembalikan sesuatu untuk ditampilkan. Contoh ini menggunakan sebuah sintaksis menyerupai XML yang disebut JSX. Masukan data yang dioper ke dalam komponen dapat diakses oleh render() melalui this.props.
JSX bersifat opsional dan bukan menjadi prasyarat untuk menggunakan React. Anda dapat mencoba Babel REPL untuk melihat kode JavaScript dasar yang dihasilkan setelah langkah kompilasi JSX.
Memuat contoh kode...
Sebuah Stateful Component
Selain menerima data masukan (yang dapat diakses melalui this.props), sebuah komponen dapat memiliki data state internal (yang dapat diakses melalui this.state). Ketika data state pada sebuah komponen berubah, markup yang di-render oleh komponen tersebut juga akan diperbarui dengan memanggil kembali render().
Memuat contoh kode...
Sebuah Aplikasi
Menggunakan props dan state, kita dapat membuat sebuah aplikasi Todo simpel. Contoh ini menggunakan state untuk mencatat daftar item dan teks yang dimasukkan oleh pengguna. Walaupun event handler terlihat seperti di-render secara langsung, event handler-event handler tersebut akan dikumpulkan untuk kemudian nantinya diimplementasikan menggunakan event delegation.
Memuat contoh kode...
Sebuah Komponen Menggunakan Plugin Eksternal
React memungkinkan Anda untuk berinteraksi dengan library dan framework lain. Contoh ini menggunakan remarkable, sebuah library Markdown eksternal, untuk mengkonversi nilai dari <textarea> secara real-time.