Web

Web modern dengan React: apa yang perlu disepakati dulu

Ilustrasi pengembangan web dengan React

React fleksibel, tetapi fleksibilitas tanpa aturan membuat onboarding engineer baru mahal dan deploy lambat. Kesepakatan awal menghemat minggu debat di PR review.

Fokus artikel ini: konvensi folder, batas data fetching, dan hal-hal kecil yang sebaiknya ditulis sekali lalu dipatuhi — sebelum komponen server, klien, dan route API saling bertumpuk.

Folder, nama, dan lapisan UI

Pilih satu pola — misalnya feature-based atau type-based — lalu dokumentasikan dalam README singkat. Saya suka mengelompokkan route, komponen halaman, dan hook data per fitur agar import tidak menyebar ke seluruh repo.

  • Tentukan apakah komponen “presentasional” vs “container” (atau setara) — konsisten lebih penting dari sempurna.
  • Sepakati penamaan event handler dan props boolean agar diff PR mudah dibaca.
  • Letakkan util bersama di modul kecil; hindari “god folder” /utils tanpa struktur.

Data fetching dan performa

Sepakati kapan data diambil di server, di route loader, atau di klien — serta bagaimana menangani loading, error, dan cache. Tanpa itu, halaman yang sama bisa berperilaku beda tiap developer.

Setelah kontrak dasar jalan, barulah optimalkan bundle, code splitting, dan pola cache lanjutan sesuai metrik nyata, bukan asumsi awal.