Search by

    Terakhir diperbaharui: Mar 1, 2021

    JSX

    Untuk menulis code di React kita menggunakan syntax extension yang disebut JSX.

    Menulis code di React bisa menggunakan syntax JavaScript biasa, tetapi mari kita lihat perbedaannya:

    JavaScript

    1ReactDOM.render(
    2 React.DOM.div({ id: 'title' }, React.DOM.h1(null, 'Hi Dino')),
    3
    4 document.getElementById('app')
    5);

    JSX

    1ReactDOM.render(
    2 <div id="title">
    3 <h1>Hi Dino</h1>
    4 </div>
    5
    6 document.getElementById('app')
    7)

    Sekilas JSX terlihat seperti perpaduan antara JavaScript & HTML, JSX memungkinkan kita untuk menyertakan code HTML ke dalam code JavaScript.

    Karena React sendiri digunakan untuk membuat UI, kemampuan dapat menyertakan HTML ke dalam JavaScript jelas sangat membantu. Oleh karena itu, penggunaan JSX pada React sangat direkomendasikan.

    Sampai disini kita cukup tahu bahwa penggunaan JSX sangat direkomendasikan untuk menulis code di React, kita lanjutkan membahas konsep dasar yang lain yaitu Component.