Belajar React
React adalah library JavaScript untuk membangun antarmuka dari komponen. Kuncinya ada di state: data yang, kalau berubah, membuat tampilan ikut diperbarui.
Pastikan dasar JavaScript-mu sudah kuat (terutama array method, destructuring, dan arrow function), lalu mulai dari panduan React dari nol, useState, dan beda props dengan state. Setelah itu baru useEffect dan useRef.
Latihan React interaktif ada di Hyper Sheets: materi, kuis, dan game per konsep, gratis.
Mulai dari sini
-
React · 22 menitBelajar React dari Nol: Panduan Lengkap Komponen, Props, State, dan Hooks
Panduan lengkap belajar React untuk pemula, apa itu React, cara install dengan Vite, JSX, component, props dan state, useState dan useEffect, mini-project aplikasi catatan, kesalahan umum, dan FAQ.
-
React · 10 menituseState Adalah: Cara Kerja State dan Hook useState di React untuk Pemula
useState adalah hook React untuk menyimpan data yang bisa berubah di dalam komponen. Pahami sintaks, perbedaan state vs variabel biasa, functional update, dan aturan pentingnya lewat contoh interaktif.
-
React · 10 menitPerbedaan Props dan State di React: Kapan Pakai Masing-Masing?
Perbedaan props dan state di React: props dikirim dari komponen induk dan read-only, state milik komponen sendiri dan bisa berubah. Lengkap dengan contoh kode & diagram.
-
![Perbandingan useEffect(fn) dan useEffect(fn, []) dan useEffect(fn, [x])](/covers/useeffect-adalah-800.webp)
React · 10 menituseEffect Adalah: Cara Pakai Hook useEffect di React (Panduan Pemula + Dependency Array)
useEffect adalah hook React untuk menjalankan side effect. Pahami dependency array (tanpa array vs [] vs [deps]), cleanup, dan cara pakainya lewat contoh interaktif.
Semua artikel React lainnya
-
React · 9 menituseRef Adalah: Cara Kerja Hook useRef di React untuk Mengakses DOM dan Menyimpan Nilai Tanpa Re-render
useRef adalah hook React untuk mengakses elemen DOM langsung dan menyimpan nilai yang bertahan antar render tanpa memicu re-render. Pahami perbedaannya dengan useState lewat contoh interaktif.
-
React · 8 menitConditional Rendering React Adalah: 4 Cara Menampilkan UI Berdasarkan Kondisi
Conditional rendering di React adalah menampilkan JSX berbeda berdasarkan kondisi. Pelajari 4 pola: if/else, ternary, operator &&, dan early return null, lengkap dengan tabel kapan pakai mana dan jebakan angka 0.
Latihan React langsung di browser
Materi interaktif, kuis, dan game React di Hyper Sheets. Gratis, tanpa install.