React50 / 78

Tiga State Wajib: Loading, Error, dan Data

Setiap UI async harus mengelola 3 state utama agar tidak pernah menampilkan layar kosong atau crash saat jaringan bermasalah.

👀 Contoh dulu

if (isLoading) return <p>Memuat data...</p>;
if (error) return <p>Gagal memuat!</p>;
return <div>{data.name}</div>;

Hasilnya: User mendapat kepastian respon dalam situasi apa pun.

💡 Selalu sediakan Fallback UI untuk state loading dan error.

📝 Sekarang giliranmu

Terapkan early return untuk menangani status loading. Jika isLoading bernilai true, kembalikan elemen <p>Loading...</p>.

Preview