State Management Lanjutan: Provider

Tujuan Pembelajaran

• Menjelaskan keterbatasan setState pada aplikasi besar.
• Memahami konsep provider untuk state global.
• Menggunakan ChangeNotifier dan ChangeNotifierProvider.
• Menerapkan context.watch dan context.read.

Uraian Materi

Ketika banyak widget harus berbagi data yang sama, meneruskan data secara manual menjadi rumit (prop drilling). Solusinya adalah state management global. Provider adalah solusi resmi yang direkomendasikan – ringan dan mudah dipahami.

Pertama tambahkan dependensi pada pubspec.yaml:

dependencies:
  flutter:
    sdk: flutter
  provider: ^6.1.2

ChangeNotifier

Kelas model yang menampung state membuatnya bersifat reaktif dengan mewarisi ChangeNotifier. Setiap perubahan memanggil notifyListeners agar widget yang mendengarkan diperbarui. Contoh model penghitung:

class Penghitung extends ChangeNotifier {
  int nilai = 0;
  void tambah() { nilai++; notifyListeners(); }
  void kurang() { nilai--; notifyListeners(); }
}

Menyediakan State dengan Provider

Di bagian atas pohon, bungkus aplikasi dengan ChangeNotifierProvider:

ChangeNotifierProvider(
  create: (_) => Penghitung(),
  child: const MyApp(),
)

Membaca dan Memodifikasi State

Dalam widget, context.watch<Penghitung>() dipakai ketika tampilan perlu ikut berubah setiap ada notifikasi, sedangkan context.read untuk aksi yang tidak membangun ulang tampilan. Pembeda ini penting untuk performa: watch pada build, read pada pada tap.

final p = context.watch();
Text('${p.nilai}')

context.read().tambah();

Latihan Pemindahan Data

Praktik menggunakan provider untuk menyimpan data pengguna yang dipakai lintas halaman, menunjukkan cara berpindah dari setState lokal ke state global yang dibagikan banyak widget.

Perbandingan dengan Pola Lain

Selain Provider, terdapat pola lain seperti setState lokal, InheritedWidget, Riverpod, dan Bloc. Provider dipilih karena ringan dan mudah dipelajari sebagai langkah awal. Pemahaman dasar Provider membekali peserta berpindah ke solusi state management lain dengan konsep yang serupa.

MultiProvider untuk Beberapa State

Ketika aplikasi membutuhkan lebih dari satu state global, MultiProvider membungkus beberapa provider sekaligus. Contoh umum: state autentikasi terpisah dari state keranjang. Peserta berlatih menyusun MultiProvider dan mengakses masing-masing state dari widget yang berbeda.

Watch vs Read untuk Kinerja

context.watch membangun ulang widget setiap ada perubahan, sedangkan context.read hanya membaca nilai tanpa menyebabkan rebuild. Menggunakan watch hanya saat benar-benar memerlukan pembaruan membuat aplikasi lebih efisien dan mengurangi pekerjaan tanpa manfaat.

Praktik Keranjang Belanja

Proyek mini pada pertemuan ini adalah keranjang belanja: menambah item, menghapus, dan menampilkan jumlah total yang diperbarui otomatis di berbagai halaman. Proyek ini menguatkan pola state global yang nantinya dipakai pada aplikasi proyek akhir.

Aktivitas Pembelajaran

• Mendiskusikan kelemahan setState pada state besar.
• Menambahkan paket provider pada proyek.
• Menulis model ChangeNotifier.
• Mengimplementasikan provider pada aplikasi multi-halaman.

Tugas dan Latihan

• Ganti state counter setState menjadi Provider.
• Buat state keranjang belanja (tambah/hapus) berbasis Provider.
• Tampilkan jumlah item keranjang pada app bar lintas halaman.

Evaluasi

Evaluasi dilakukan melalui pengamatan hasil praktikum, kuis singkat di akhir pertemuan, dan pemantauan proyek. Peserta yang belum mencapai indikator tertentu diberikan remedial melalui bimbingan ulang dan latihan tambahan pada pertemuan berikutnya.

Panduan Belajar Mandiri

Untuk menguatkan pemahaman, peserta disarankan membaca ulang kode yang telah dibuat, mencoba memodifikasi nilai dan properti, lalu mengamati perubahannya melalui hot reload. Eksperimen kecil-kecil semacam ini membangun intuisi yang tidak diperoleh hanya dari teori.

Kesulitan yang ditemui selama praktik dicatat pada jurnal belajar dan dibawa ke pertemuan berikutnya. Konsistensi belajar mandiri di antara sesi mempercepat penguasaan materi dan membuat praktikum di kelas berjalan lebih efektif.

Ringkasan Pertemuan

Pada pertemuan ke-12 fokus pembelajaran adalah state management lanjutan: provider. Seluruh indikator tujuan difokuskan pada penguasaan materi tersebut secara praktis, sehingga peserta tidak hanya mengenal konsep tetapi mampu menerapkannya langsung dalam proyek Flutter yang sedang dikembangkan. Ringkasan nilai utama: menjelaskan keterbatasan setstate pada aplikasi besar..

Kemampuan peserta diukur melalui penyelesaian latihan yang mencerminkan penerapan nyata, bukan sekadar hafalan. Setiap konsep baru selalu dikaitkan dengan materi sebelumnya agar terbentuk pemahaman yang utuh dan berkesinambungan sepanjang kurikulum.

Refleksi Diri

Bagian berikut mengajak peserta menelaah kembali sejauh mana materi telah dikuasai. Kejujuran dalam menilai diri menentukan efektivitas langkah perbaikan selanjutnya.

• Apakah saya dapat menjelaskan kembali pokok materi pertemuan ini tanpa melihat catatan?
• Apakah saya berhasil menyelesaikan seluruh latihan praktikum secara mandiri?
• Bila ada kendala, bagian manakah yang paling sulit dan bagaimana rencana saya mengatasinya?

Asesmen dan Tindak Lanjut

Hasil praktikum dan kuis digunakan untuk memetakan penguasaan peserta. Peserta yang nilainya belum memenuhi kriteria mengulang latihan pada bagian yang kurang dengan pendampingan, sedangkan yang telah menguasai diberikan pengayaan berupa pengembangan fitur tambahan. Catatan perbaikan disampaikan melalui umpan balik tertulis atau lisan.

Kesetiaan mengikuti alur pertemuan demi pertemuan merupakan kunci keberhasilan pengelolaan state dan interaksi pengguna secara dinamis. Materi berikutnya dibangun di atas kompetensi yang telah dicapai, sehingga menuntaskan pembelajaran setiap pertemuan menjadi bagian penting dari pencapaian akhir. Peserta disarankan mempersiapkan diri membaca panduan praktikum sebelum pertemuan berikutnya tiba.

Dengan selesainya pertemuan ini, peserta menambah satu kompetensi pada peta belajar Mobile Programming. Kemajuan itu dicatat dan menjadi dasar penilaian akhir serta bahan diskusi proyek yang menutup keseluruhan kurikulum.