Bab 51 — Langkah Selanjutnya

Kamu sampai di akhir. Lima puluh bab, enam bagian, dari widget pertama sampai game yang utuh dan aplikasi yang siap dijual.

Bab ini bukan materi baru. Ia adalah peta tentang ke mana melangkah setelah ini, dan — mungkin lebih penting — bagaimana memastikan yang sudah kamu baca benar-benar menjadi keterampilan.

Yang sudah kamu lewati

   ┌─────────────────────────────────────────────────────────────┐
   │  I    FONDASI          Dart, widget, layout, state,         │
   │       Bab 1–13         form, navigasi, animasi, internals   │
   ├─────────────────────────────────────────────────────────────┤
   │  II   DATA             HTTP, penyimpanan lokal,             │
   │       Bab 14–16        kamera, lokasi, peta                 │
   ├─────────────────────────────────────────────────────────────┤
   │  III  STATE            Riverpod, Provider, BLoC lengkap     │
   │       Bab 17–26                                             │
   ├─────────────────────────────────────────────────────────────┤
   │  IV   FIREBASE         Auth, Firestore, FCM, offline sync,  │
   │       Bab 27–33        Maps, clean architecture             │
   ├─────────────────────────────────────────────────────────────┤
   │  V    PRODUK           Gemini, AdMob, Stripe, Git, rilis,   │
   │       Bab 34–41        ASO, marketing, model bisnis         │
   ├─────────────────────────────────────────────────────────────┤
   │  VI   GAME             Flame, komponen, collision,          │
   │       Bab 42–50        particle, Asteroids                  │
   └─────────────────────────────────────────────────────────────┘

Itu cakupan yang luas. Tetapi membaca bukan menguasai.

Cara mengubah bacaan menjadi keterampilan

Ini bagian yang paling menentukan, dan yang paling sering dilewati.

Bangun sesuatu yang kamu butuhkan sendiri. Bukan aplikasi tutorial, bukan klona aplikasi terkenal. Sesuatu yang benar-benar akan kamu pakai — pencatat pengeluaran dengan kategori yang sesuai kebiasaanmu, pengingat yang bekerja seperti caramu berpikir, apa pun.

Alasannya praktis: ketika kamu membangun sesuatu yang kamu pakai sendiri, kamu akan menemukan masalah nyata. Dan memecahkan masalah nyata adalah satu-satunya cara pengetahuan berpindah dari "pernah baca" menjadi "bisa".

Selesaikan sampai rilis, minimal sekali. Delapan puluh persen pertama sebuah aplikasi terasa menyenangkan. Dua puluh persen terakhir — ikon, penanganan error, layar kosong, penolakan izin, proses rilis — terasa membosankan.

Tetapi justru di dua puluh persen itulah sebagian besar pembelajaran terjadi. Aplikasi yang berhenti di 80% mengajarkan jauh lebih sedikit daripada aplikasi kecil yang benar-benar sampai ke tangan pengguna.

Baca kode orang lain. Buka repositori Flutter di GitHub dan telusuri bagaimana orang lain menyusun proyeknya. Kamu akan menemukan pola yang tidak pernah terpikirkan, dan juga menemukan bahwa banyak kode produksi lebih sederhana daripada yang kamu duga.

Kembali ke bab yang terasa kabur. Beberapa bab hanya benar-benar masuk akal setelah kamu mengalami masalah yang dibahasnya. Bab 12 tentang keys adalah contoh klasik — ia terasa abstrak sampai suatu hari daftar tugasmu tiba-tiba menampilkan data yang tertukar.

Ukuran proyek yang tepat

Proyek pertama yang baik: satu fitur inti, dikerjakan dengan benar.

Bukan "aplikasi media sosial dengan chat, feed, story, dan marketplace". Melainkan "pencatat kebiasaan yang menyimpan data secara lokal dan menampilkan grafik mingguan".

Yang kedua bisa selesai dalam dua minggu dan mengajarkan lebih banyak.

Yang belum dibahas

Situs ini luas, tetapi tidak lengkap. Beberapa hal penting yang sengaja tidak masuk, beserta ke mana mencarinya.

Testing yang menyeluruh

Bab 26 membahas pengujian BLoC, tetapi pengujian Flutter jauh lebih luas dari itu.

// Unit test — logika murni
test('menghitung total dengan benar', () { });

// Widget test — satu widget atau layar
testWidgets('menampilkan pesan kosong', (tester) async { });

// Golden test — perbandingan visual
testWidgets('kartu produk sesuai desain', (tester) async {
  await expectLater(
    find.byType(KartuProduk),
    matchesGoldenFile('kartu_produk.png'),
  );
});

// Integration test — alur lengkap di perangkat nyata

Golden test khususnya layak dipelajari: ia menangkap perubahan visual yang tidak disengaja, sesuatu yang sulit dilakukan dengan cara lain.

Cari: dokumentasi resmi flutter_test, paket golden_toolkit, dan integration_test.

Internasionalisasi

Kalau aplikasimu akan dipakai di lebih dari satu bahasa, flutter_localizations dan paket intl adalah jalur resminya.

# pubspec.yaml
dependencies:
  flutter_localizations:
    sdk: flutter
  intl: any

flutter:
  generate: true

// Dipakai seperti ini
Text(AppLocalizations.of(context)!.selamatDatang)

Seperti disinggung di Bab 39, lokalisasi juga membuka pasar baru dengan persaingan ASO yang jauh lebih rendah — salah satu peluang paling diremehkan.

Aksesibilitas

Bagian yang paling sering diabaikan dan paling berdampak bagi sebagian pengguna.

Semantics(
  label: 'Tombol tambah polling baru',
  button: true,
  child: FloatingActionButton(
    onPressed: _tambah,
    child: const Icon(Icons.add),
  ),
)

Beberapa hal yang perlu diperiksa:

• Kontras warna minimal 4,5:1 untuk teks biasa.
• Ukuran sentuh minimal 48×48 piksel.
• Label semantik pada ikon tanpa teks.
• Skala teks — aplikasimu harus tetap terbaca ketika pengguna memperbesar ukuran font sistem.

Flutter menyediakan pemeriksa bawaan:

testWidgets('memenuhi standar aksesibilitas', (tester) async {
  await tester.pumpWidget(const AplikasiSaya());

  await expectLater(tester, meetsGuideline(textContrastGuideline));
  await expectLater(tester, meetsGuideline(androidTapTargetGuideline));
  await expectLater(tester, meetsGuideline(labeledTapTargetGuideline));
});

Navigasi lanjutan

Bab 7 membahas Navigator dasar. Untuk aplikasi dengan deep link, guard autentikasi, dan navigasi bersarang, go_router adalah rekomendasi resmi tim Flutter.

final router = GoRouter(
  routes: [
    GoRoute(
      path: '/',
      builder: (context, state) => const Beranda(),
      routes: [
        GoRoute(
          path: 'poll/:id',
          builder: (context, state) =>
              DetailPoll(id: state.pathParameters['id']!),
        ),
      ],
    ),
  ],
  redirect: (context, state) {
    final masuk = context.read<PenyediaAuth>().sudahMasuk;
    if (!masuk && state.matchedLocation != '/login') return '/login';
    return null;
  },
);

redirect itu yang membuatnya berharga — guard autentikasi terpusat, alih-alih diperiksa di setiap layar.

Animasi tingkat lanjut

Bab 11 membahas dasar animasi. Untuk yang lebih jauh:

• CustomPainter — menggambar apa pun dari nol. Sudah kamu sentuh di Bagian VI lewat Flame.
• Rive — animasi interaktif yang bisa merespons state aplikasi.
• flutter_animate — sintaks berantai yang sangat ringkas untuk animasi dekoratif.
• Shader — efek visual tingkat lanjut lewat FragmentProgram.

Desktop dan web

Flutter berjalan di keenam platform, tetapi masing-masing punya pertimbangannya sendiri.

Untuk desktop: menu bar, jendela yang bisa diubah ukurannya, klik kanan, pintasan papan ketik, drag and drop berkas.

Untuk web: ukuran bundel awal, SEO (Flutter Web tidak ramah mesin pencari), URL yang bermakna, dan perilaku tombol kembali peramban.

Prinsip responsif dari Bab 10 menjadi jauh lebih penting di sana.

Native yang lebih dalam

Ketika tidak ada paket yang menyediakan yang kamu butuhkan, kamu bisa menulis kode platform sendiri.

// Memanggil kode native
const channel = MethodChannel('com.contoh.app/native');

Future<String> ambilSesuatu() async {
  return await channel.invokeMethod('namaMetode');
}

Cari: Platform Channels, Pigeon (menghasilkan kode penghubung yang bertipe aman), dan FFI untuk memanggil pustaka C secara langsung.

Sumber untuk terus belajar

Dokumentasi resmi

Sumber	Untuk
docs.flutter.dev	Rujukan utama, sangat baik
api.flutter.dev	Dokumentasi setiap kelas
dart.dev	Bahasa Dart
pub.dev	Paket

Baca kode sumber Flutter

Ini saran yang terdengar menakutkan tetapi sangat berharga. Di VS Code, tekan Ctrl+Klik (atau Cmd+Klik) pada nama widget apa pun — kamu akan dibawa ke kode sumbernya.

Kode Flutter ditulis dengan sangat baik dan penuh komentar yang menjelaskan alasan di balik keputusannya. Membaca implementasi ListView atau Scaffold mengajarkan lebih banyak tentang cara berpikir Flutter daripada tutorial mana pun.

Mengikuti perkembangan

Flutter berubah cepat. Beberapa cara tetap mengikuti:

• Flutter release notes — setiap rilis stabil punya catatan yang jelas.
• Flutter YouTube channel — seri "Widget of the Week" sangat efisien.
• Flutter Forward / Google I/O — pengumuman besar tahunan.
• Komunitas Flutter Indonesia — grup Telegram dan Discord aktif.

Kembali ke sumber asli

Seluruh transkrip kursus yang menjadi bahan situs ini tersedia sebagai PDF referensi. Kalau ada penjelasan yang terasa terlalu padat di sini, versi panjangnya ada di sana.

Proyek Final

⭐⭐⭐⭐⭐ · beberapa hari sampai beberapa minggu

Situs ini punya enam mini proyek, satu untuk tiap Bagian. Yang ini berbeda: ia menuntut keenamnya sekaligus, dalam satu aplikasi yang utuh. Kerjakan setelah kamu merasa cukup nyaman dengan sebagian besar materinya — atau kerjakan sekarang juga kalau kamu tipe yang belajar paling cepat dengan cara tenggelam.

Apa yang akan kamu bangun

Jurnal Perjalanan Sosial — aplikasi mencatat perjalanan. Setiap entri berisi foto dari kamera, lokasi tempat foto itu diambil, catatan teks, dan tanggal. Entri tersimpan di perangkat sehingga bisa dibuat di tengah hutan tanpa sinyal, lalu tersinkron ke cloud ketika koneksi kembali. Teman yang kamu izinkan bisa melihat dan berkomentar, dan kamu mendapat notifikasi ketika itu terjadi.

Aplikasi ini dipilih karena setiap Bagian punya alasan sendiri untuk ada di sini, bukan ditempelkan supaya daftarnya lengkap.

Bagian I hadir karena jurnal perjalanan adalah aplikasi yang penampilannya penting. Foto besar, transisi yang halus dari daftar ke detail, tata letak yang bekerja di ponsel maupun tablet. Ini bukan lapisan gula — aplikasi jurnal yang jelek terasa tidak pantas dipercaya kenangan.

Bagian II hadir karena sumber datanya adalah perangkat itu sendiri: kamera dan GPS. Dan karena entri harus bisa dibuat saat offline, basis data lokal adalah tempat entri lahir, bukan sekadar cache.

Bagian III hadir karena state aplikasi ini tidak sederhana. Status sinkronisasi tiap entri, status koneksi, status autentikasi, dan daftar yang tersaring semuanya berubah dari sumber berbeda dan harus terlihat konsisten di banyak layar sekaligus. Ini titik di mana setState benar-benar menyerah.

Bagian IV hadir untuk akun, penyimpanan cloud, berbagi, dan notifikasi komentar. Dan untuk pertanyaan yang selalu muncul di aplikasi offline-first: apa yang terjadi kalau kamu mengubah entri di dua perangkat sebelum keduanya sempat tersinkron.

Bagian V hadir karena aplikasi yang tidak pernah dirilis mengajarkan jauh lebih sedikit. Ikon, splash, README, kebijakan privasi — dua puluh persen terakhir yang paling sering dilewati.

Bagian VI hadir dalam porsi kecil dan menyenangkan: ketika kamu mencapai entri kesepuluh, aplikasi merayakannya dengan animasi partikel. Bukan game, cukup satu ledakan kecil yang membuat orang tersenyum.

Prasyarat

Seluruh situs. Kalau ada Bagian yang belum kamu baca, kerjakan mini proyeknya dulu.

Requirement fungsional

• Masuk dengan akun (email atau Google), dengan gerbang navigasi reaktif yang mengawasi status autentikasi.
• Membuat entri: satu atau beberapa foto dari kamera atau galeri, lokasi yang terisi otomatis dari GPS dan bisa digeser manual di peta, catatan teks, dan tanggal.
• Entri bisa dibuat sepenuhnya saat offline dan tersimpan seketika. Ia berangkat ke cloud sendiri ketika koneksi kembali, tanpa pengguna perlu menekan apa pun.
• Setiap entri menampilkan status sinkronisasinya sendiri — tersimpan lokal, sedang dikirim, atau sudah tersinkron.
• Daftar entri dengan foto besar, dan transisi Hero ke layar detail.
• Peta yang menampilkan seluruh entri sebagai penanda, dan mengetuk penanda membuka entrinya.
• Berbagi satu entri ke pengguna lain. Penerima bisa melihat dan berkomentar, tetapi tidak bisa mengubah atau menghapus.
• Push notification ketika seseorang berkomentar di entrimu, dan mengetuknya membuka entri itu — dalam ketiga keadaan aplikasi.
• Penyaring dan pencarian: berdasarkan rentang tanggal, dan berdasarkan teks di dalam catatan.
• Mode gelap yang benar-benar terbaca, dan tata letak yang menyesuaikan di layar selebar tablet.
• Saat pengguna mencapai entri kesepuluh, animasi partikel perayaan muncul sekali.

Requirement teknis

• Arsitektur berlapis dengan Riverpod atau BLoC. Tidak ada setState untuk state yang dipakai lebih dari satu widget, dan lapisan logika tidak mengimpor package:flutter/material.dart.
• Basis data lokal adalah sumber kebenaran untuk UI. Jaringan hanya mekanisme sinkronisasi di latar belakang, bukan yang ditunggu layar.
• Tabel lokal punya kolom status sinkronisasi, waktu perubahan, dan jumlah percobaan. Kegagalan satu entri tidak boleh menghentikan entri lain, dan ada batas percobaan.
• Foto diperkecil sebelum disimpan maupun diunggah, dan disalin ke direktori dokumen — bukan dibiarkan di direktori sementara.
• Aturan keamanan Firestore dan Storage ditulis dan diterapkan: hanya pemilik yang bisa mengubah entrinya, hanya yang diberi akses yang bisa membacanya.
• Token FCM disimpan, diperbarui, dan dihapus saat keluar akun.
• Kunci API tidak ada di dalam kode, dan tidak ada berkas rahasia yang pernah ter-commit.
• Minimal lima pengujian untuk lapisan logika dan repository, termasuk satu yang menguji perilaku saat sinkronisasi gagal.
• Aplikasi punya ikon peluncur, splash, nama, dan application ID sendiri — bukan com.example.*.
• Repositori Git dengan riwayat commit yang bermakna, README yang layak, dan draf kebijakan privasi yang menyebut data apa yang dikumpulkan dan kenapa.

Checklist penerimaan

• Mode pesawat selama satu jam: membuat tiga entri, menutup aplikasi, membukanya lagi, lalu menyalakan koneksi. Ketiganya tersinkron sendiri, dan tidak ada satu pun yang terkirim dua kali.
• Dua akun di dua perangkat: berbagi entri, berkomentar, dan notifikasi sampai dengan benar termasuk saat aplikasi tertutup.
• Mengubah entri yang sama di dua perangkat sebelum keduanya tersinkron tidak menghasilkan kehilangan data yang diam-diam. Kamu boleh memilih strategi penyelesaian konflik yang sederhana, asal kamu bisa menjelaskannya.
• flutter test lolos, dan flutter analyze bersih.
• flutter run --release di perangkat fisik berjalan tanpa masalah yang tidak muncul di mode debug.
• Kamu bisa menyerahkan tautan repositorinya ke orang lain, dan mereka bisa menjalankannya hanya dengan membaca README.

Tantangan ekstra (opsional)

• Saran catatan dari AI: kirim lokasi dan tanggal ke Gemini, dan biarkan ia mengusulkan kalimat pembuka untuk entri. Isi kolom yang bisa diedit — jangan simpan langsung.
• Pengelompokan penanda di peta, supaya perjalanan dengan ratusan entri tetap terbaca.
• Ekspor satu perjalanan menjadi PDF berisi foto, peta, dan catatan.
• Rilis ke jalur pengujian tertutup Play Store, dan minta lima orang memasangnya. Umpan balik dari lima pengguna sungguhan lebih berharga daripada lima puluh jam menebak.

Terjebak?

Jangan bangun ini dari luar ke dalam. Mulai dari entri yang tersimpan lokal dan tampil di daftar — tanpa akun, tanpa cloud, tanpa peta. Kalau itu sudah kokoh, tambahkan satu lapisan pada satu waktu, dan pastikan aplikasi tetap utuh setelah setiap lapisan. Proyek sebesar ini gagal bukan karena satu bagian terlalu sulit, melainkan karena terlalu banyak bagian setengah jadi sekaligus.

Kesalahan yang wajar terjadi

Beberapa hal yang hampir semua orang alami. Mengetahuinya sejak awal menghemat waktu.

Terlalu cepat memakai arsitektur berat. Seperti dibahas di Bab 33, arsitektur adalah obat untuk gejala. Meminum obat sebelum sakit tidak membantu. Mulai sederhana, tambahkan struktur ketika kamu merasakan kebutuhannya.

Mengumpulkan tutorial tanpa membangun. Menonton dua puluh kursus tidak membuatmu bisa. Membangun satu aplikasi kecil sampai selesai membuatmu bisa.

Mengejar kesempurnaan sebelum rilis. Aplikasi yang tidak pernah dirilis tidak mengajarkan apa pun tentang pengguna nyata.

Mengabaikan performa sampai terlambat. Pakai --profile dan DevTools sejak awal, seperti dibahas di Bab 13.

Menyimpan rahasia di aplikasi. Peringatan yang diulang di Bab 27, Bab 34, Bab 36, dan Bab 37 — karena memang sesering itu terjadi.

Membangun untuk semua orang. Aplikasi yang mencoba menyenangkan semua orang biasanya tidak menyenangkan siapa pun. Pilih satu jenis pengguna dan layani mereka dengan sangat baik.

Daftar periksa proyek berikutnya

Sesuatu yang bisa kamu pakai untuk proyek nyata pertamamu.

Persiapan

• Ide yang kamu sendiri butuhkan
• Satu fitur inti, bukan lima
• Nama diperiksa di DJKI, toko aplikasi, dan domain (Bab 41)
• Application ID final — tidak bisa diubah nanti (Bab 38)

Pengembangan

• Git sejak commit pertama, dengan .gitignore yang benar (Bab 37)
• State management dipilih dan konsisten (Bagian III)
• Struktur folder ditetapkan di awal
• Rahasia lewat --dart-define, tidak pernah di-commit
• Tema terpusat, bukan gaya inline (Bab 9)
• Penanganan error, layar kosong, dan status memuat (Bab 14)

Sebelum rilis

• Diuji dalam mode --release di perangkat fisik (Bab 38)
• Aturan keamanan Firestore sudah benar (Bab 29)
• Crashlytics terpasang (Bab 38)
• Ikon, splash, dan nama aplikasi final
• Kebijakan privasi tersedia dan jujur
• Kata kunci ASO diriset dan dipasang (Bab 39)
• Tangkapan layar dengan teks konteks
• Cara menghapus akun tersedia (Bab 41)

Sesudah rilis

• Pantau retensi D1/D7, bukan hanya unduhan (Bab 40)
• Tanggapi setiap ulasan
• Perbaiki crash sebelum menambah fitur
• Minta ulasan pada momen yang tepat (Bab 39)

Penutup

Ada satu hal yang tidak bisa diajarkan oleh situs mana pun, dan itu adalah kebiasaan menyelesaikan.

Sebagian besar orang yang belajar pemrograman berhenti di tengah — bukan karena materinya terlalu sulit, tetapi karena selalu ada hal berikutnya yang lebih menarik untuk dipelajari daripada menyelesaikan yang sedang dikerjakan.

Aplikasi kecil yang selesai dan dirilis mengajarkan lebih banyak daripada lima proyek ambisius yang berhenti di tengah jalan. Ia juga memberi sesuatu yang tidak diberikan tutorial: pengguna nyata yang memakai sesuatu yang kamu buat, dan memberitahumu apa yang salah dengan cara yang tidak pernah terpikirkan.

Situs ini adalah rangkuman dari ratusan jam video. Tetapi ia hanya berguna kalau kamu menutupnya dan mulai membangun.

Selamat mengerjakan.

---

Kembali ke mana pun

• Panduan Memakai Situs Ini — peta seluruh bab
• Referensi & Transkrip Asli — PDF sumber lengkap
• Bab 1 — Pengantar Flutter & Dart — dari awal

Transkrip asli

Bab ini disintesis dari 1_flutter_zero-to-hero/12_next-steps.md (6 video: Let's talk about State Management, Internationalizing, Let's talk about Firebase, Publish, Animations, Recap) dan 3_flutter-monetize/21_further-resources.md. Lihat PDF Zero to Hero dan PDF Monetize.