https://wiki.unissula.ac.id/index.php?action=history&feed=atom&title=React 2026-09-15T18:41:45Z Riwayat revisi halaman ini di wiki MediaWiki 1.46.0 https://wiki.unissula.ac.id/index.php?title=React&diff=7349&oldid=prev 2026-08-24T17:58:02Z

<p>Presentation V4: sitasi, referensi, Math, Wikimedia Commons, dan atribusi</p> <a href="https://wiki.unissula.ac.id/index.php?title=React&amp;diff=7349&amp;oldid=6949">Lihat perubahan</a>

Maintenance script https://wiki.unissula.ac.id/index.php?title=React&diff=6949&oldid=prev 2026-08-24T17:20:08Z

<p>Impor teks terkontrol dari Wikipedia bahasa Indonesia; revisi 28069316; atribusi sumber disertakan.</p> <p><b>Halaman baru</b></p><div>&#039;&#039;&#039;React&#039;&#039;&#039; (dikenal juga dengan &#039;&#039;&#039;React.js&#039;&#039;&#039; atau &#039;&#039;&#039;ReactJS&#039;&#039;&#039;) adalah libray [[JavaScript]] yang digunakan untuk membangun &#039;&#039;[[Antarmuka pengguna|user interface]]&#039;&#039; yang interaktif berbasis &#039;&#039;component&#039;&#039;. React yang dibuat oleh [[Facebook Inc.|Facebook]] (sekarang [[Meta Platforms|Meta]]) dan bersifat &#039;&#039;open source&#039;&#039; ([[sumber terbuka]]), sehingga dapat digunakan oleh siapa saja secara gratis. Saat ini React dikelola oleh [[Meta, Inc.|Meta]], komunitas, dan perusahaan individu.<br /> <br /> == Sejarah dan riwayat ==<br /> React dibuat oleh Jordan Walke, seorang [[insinyur perangkat lunak]] yang bekerja di Facebook. Jordan Walke merilis [[prototipe]] awal React yang kemudian diberi nama dengan &quot;&#039;&#039;FaxJS&#039;&#039;&quot;. React dibuat oleh Jordan Walke yang dipengaruhi oleh XHP, sebuah &#039;&#039;library component&#039;&#039; HTML untuk [[bahasa pemrograman]] [[PHP]]. XHP pertama kali digunakan pada fitur News Feed [[Facebook]] pada tahun 2011 dan kemudian digunakan pada [[Instagram]] pada tahun 2012.<br /> <br /> Terdapat [[Framework|kerangka kerja]] (&#039;&#039;framework&#039;&#039;) [[React native]] yang memungkinkan pengembang (&#039;&#039;developer&#039;&#039;) membuat aplikasi [[Android (sistem operasi)|Android]], [[IOS]], dan [[Universal Windows Platform]] (UWP) dengan menggunakan React. Kerangka kerja tersebut diperkenalkan oleh Facebook di acara React Conf pada Februari 2015 dan bersifat &#039;&#039;open source&#039;&#039; ([[sumber terbuka]]) pada Maret 2015.<br /> <br /> Pada tanggal 18 April 2017 Facebook mengumumkan React Fiber yang merupakan sebuah algoritma baru untuk &#039;&#039;rendering.&#039;&#039; React Fiber menjadi dasar dari setiap perubahan, termasuk peningkatan dan pengembangan fitur pada &#039;&#039;library&#039;&#039; React di masa mendatang. Meskipun dengan adanya perubahan tersebut, penulisan sintaks (&#039;&#039;syntax code&#039;&#039;) tidak mengalami perubahan. Hana saya, cara sintaks tersebut dijalankan yang berubah. Algoritma atau sistem &#039;&#039;rendering&#039;&#039; lama React yaitu Stack, dikembangkan pada saat fokus sistem pada perubahan dinamis yang tidak dipahami. Stack dinilai lambat dalam menggambar suatu animasi yang rumit, misalnya yaitu pada kondisi untuk menyelesaikan semuanya dalam satu bagian. Sementara React Fiber dapat membagi atau memecah animasi menjadi berdasarkan segmen yang dapat tersebar di beberapa &#039;&#039;frame.&#039;&#039; Demikian pula, struktur halaman dapat dipecah menjadi segmen-segmen yang dapat dipertahankan dan diperbarui secara terpisah. Fungsi JavaScript dan objek virtual DOM tersebut disebut &#039;&#039;fibers&#039;&#039; dan masing-masingnya dapat dioperasikan dan diperbarui secara terpisah, yang memungkinkan proses &#039;&#039;rendering&#039;&#039; menjadi lebih lancar.<br /> <br /> == Sintaks ==<br /> Berikut ini adalah contoh dasar penggunaan React untuk &#039;&#039;web&#039;&#039;, yang ditulis dalam [[JSX (JavaScript)|JSX]] dan [[JavaScript]] :Berdasarkan dokumen [[HTML]] di bawah ini :Fungsi (&#039;&#039;function&#039;&#039;)&lt;code&gt;Greeting&lt;/code&gt; adalah komponent (&#039;&#039;component&#039;&#039;) React yang menampilkan [[Hello world|&quot;Hello, World&quot;]]. Ketika ditampilkan pada &#039;&#039;web browser,&#039;&#039; maka hasilnya adalah &#039;&#039;rendering&#039;&#039; dari :<br /> <br /> == Fitur penting ==<br /> <br /> === Deklaratif ===<br /> React menganut paradigma [[pemrograman deklaratif]], yang mana pengembang (&#039;&#039;developer&#039;&#039;) mendesain tampilan untuk setiap status (&#039;&#039;state&#039;&#039;) aplikasi. Kemudian React akan memperbarui dan me-&#039;&#039;render&#039;&#039; komponen saat data berubah.<br /> <br /> === Komponen (&#039;&#039;component&#039;&#039;) ===<br /> Kode React dibangun atau terbuat dari entitas yang disebut komponen (&#039;&#039;component&#039;&#039;). Komponen-komponen tersebut dapat digunakan kembali (&#039;&#039;reusable&#039;&#039;) dan harus dibentuk dalam folder &#039;&#039;src&#039;&#039; yang ditulis dengan aturan Pascal Case sebagai konvensi penamaannya. Komponen dapat di-&#039;&#039;render&#039;&#039; ke elemen tertentu di DOM dengan menggunakan &#039;&#039;library&#039;&#039; React DOM. Ketika proses &#039;&#039;rendering&#039;&#039; pengembang (&#039;&#039;developer&#039;&#039;) dapat meneruskan (&#039;&#039;pass&#039;&#039;) nilai (&#039;&#039;values&#039;&#039;) yang ada di antara komponent, yang disebut dengan &#039;&#039;props.&#039;&#039;Pada contoh di atas, properti &lt;code&gt;name&lt;/code&gt; dengan nilai (valu) &quot;Gulshan&quot; telah diteruskan dari komponent dari &lt;code&gt;Example&lt;/code&gt;komponen ke komponen &lt;code&gt;Tool&lt;/code&gt;. Selain itu, bagian kode&lt;code&gt;return&lt;/code&gt; dibungkus dengan &#039;&#039;tag&#039;&#039; karena ada batasan dalam &lt;code&gt;return&lt;/code&gt; fungsinya, yaitu hanya dapat mengembalikan satu nilai. Jadi semua elemen dan komponen JSX terikat menjadi satu tag.<br /> <br /> Dua cara utama untuk mendeklarasikan komponen dalam React adalah dengan &#039;&#039;function components&#039;&#039; dan &#039;&#039;class-based components.&#039;&#039;<br /> <br /> === &#039;&#039;Functional Component&#039;&#039; ===<br /> &#039;&#039;Functional component&#039;&#039; dideklarasikan dengan fungsi yang mengembalikan (&#039;&#039;return&#039;&#039;) beberapa kode [[JSX]]. Pada React versi 16.8 ke atas, &#039;&#039;functional component&#039;&#039; dapat menggunakan &#039;&#039;state&#039;&#039; dengan menerapkan &#039;&#039;Hooks&#039;&#039;. Contohnya adalah sebagai berikut :<br /> <br /> === JSX ===<br /> JSX (&#039;&#039;JavaScript Syntax Extension&#039;&#039;) atau juga dikenal dengan Javascript XML. JSX merupakan &#039;&#039;extension&#039;&#039; React untuk sintaks bahasa pemrograman [[JavaScript]] yang menyediakan cara untuk menyusun elemen pada komponen react. Sintaks JSX mirip seperti HTML, sehingga mudah digunakan oleh para pengembang (&#039;&#039;developer&#039;&#039;).<br /> <br /> Komponen (&#039;&#039;component&#039;&#039;) React biasanya ditulis dengan menggunakan JSX, meskipun hal tersebut tidak harus dilakukan karena komponen juga dapat ditulis dalam JavaScript murni. JSX sama halnya dengan &#039;&#039;extension&#039;&#039; lain yang dibuah oleh [[Meta, Inc.|Facebook]] untuk [[bahasa pemrograman]] [[PHP]], yaitu [[XHP]].<br /> <br /> == Versi React ==<br /> <br /> <br /> == Lihat pula ==<br /> <br /> * [[Next.js]]<br /> * [[React Router]]<br /> * [[Vue.js]]<br /> * [[JavaScript]]<br /> <br /> == Daftar pustaka ==<br /> <br /> <br /> <br /> == Sumber dan atribusi ==<br /> <br /> Konten artikel ini diadaptasi dari [https://id.wikipedia.org/w/index.php?title=React&amp;oldid=28069316 Wikipedia bahasa Indonesia], revisi 28069316 (2025-10-17T13:44:17Z), yang tersedia berdasarkan lisensi Creative Commons Atribusi-BerbagiSerupa (CC BY-SA). Mohon gunakan konten ini secara bijak serta sesuai dengan ketentuan lisensi yang berlaku.</div>

Maintenance script