React1 / 78

Kenapa React Ada?

Dengan JavaScript biasa kamu memberi perintah langkah demi langkah: cari elemennya di halaman, lalu ganti isinya sendiri (document.querySelector(...).textContent = ...). Cara ini disebut imperatif, dan jadi melelahkan begitu halaman punya puluhan bagian yang bisa berubah. React memakai cara deklaratif: kamu cukup menulis 'seperti apa tampilannya untuk data ini', lalu React yang mengurus perubahan di halaman. Satu kalimat yang perlu kamu ingat sepanjang track ini: tampilan adalah hasil dari data.

👀 Contoh dulu

// cara lama (imperatif) — kamu yang mengatur DOM sendiri
document.querySelector("#judul").textContent = "Beranda";

// cara React (deklaratif) — kamu cukup mendeskripsikan hasilnya
function Beranda() {
  return <h1>Beranda</h1>;
}

Hasilnya: Keduanya menampilkan judul yang sama, tapi versi React tidak menyentuh document sama sekali.

💡 Perhatikan: di versi React tidak ada perintah 'cari elemen lalu ubah'. Yang ada hanya deskripsi hasil akhirnya.

📝 Sekarang giliranmu

Sebuah halaman dashboard perlu judul bertuliskan Dashboard. Tulis versi React-nya: sebuah fungsi bernama Judul yang mengembalikan elemen <h1> berisi teks itu — tanpa menyentuh document.

Preview