Panduan Memakai Situs Ini

Selamat datang. Sebelum menyelam ke bab pertama, luangkan lima menit untuk memahami bagaimana materi di sini disusun. Situs ini cukup besar — lima puluh satu bab — dan mengetahui peta wilayahnya akan menghemat banyak waktu kamu.

Dari mana isi situs ini berasal

Materi di sini disintesis dari enam kursus Flutter yang berbeda. Masing-masing punya gaya dan kekuatannya sendiri, dan bab-bab di situs ini menggabungkan bagian terbaik dari semuanya.

Sumber	Fokus	Kontribusi terbesar
1_flutter_core	Dasar Flutter & Dart, berbasis proyek	Dart mendalam, Expense Tracker, Meals App, Shopping List, Favorite Places
1_flutter_zero-to-hero	Katalog widget per kebutuhan UI	Layout, input, clean UI, responsive, null safety
2_flutter_bloc-zero-to-hero	State management dengan BLoC	Stream, Cubit, Bloc, arsitektur berlapis, testing
3_flutter-monetize	Sisi bisnis aplikasi	ASO, marketing, model monetisasi
4_flutter_ai-chatbot-n-firebase	Firebase & AI	Auth, Firestore, FCM, Stripe, Gemini, Riverpod
5_flutter_flame	Game 2D	Game loop, component, collision, particle, Asteroids

Dua kursus pertama sama-sama membahas fondasi Flutter, tetapi dari sudut yang berbeda: yang satu berjalan lewat proyek berurutan, yang lain menyusun materi sebagai katalog widget. Di situs ini keduanya dilebur per topik, bukan disajikan sebagai dua bab terpisah yang tumpang tindih. Jadi ketika kamu membaca bab Layout, kamu mendapat katalog widget yang lengkap sekaligus contoh penggunaannya di dalam proyek nyata.

Peta enam bagian

┌─────────────────────────────────────────────────────────────────┐
│  I · FONDASI FLUTTER & DART                       Bab 1  – 13   │
│  Dart, widget, layout, state, form, navigasi,                   │
│  list, theming, responsif, animasi, internals, debugging        │
└───────────────────────────┬─────────────────────────────────────┘
                            │  wajib untuk semua orang
                            ▼
┌─────────────────────────────────────────────────────────────────┐
│  II · DATA, JARINGAN & PERANGKAT                  Bab 14 – 16   │
│  HTTP & REST, penyimpanan lokal, kamera/lokasi/peta             │
└───────────────────────────┬─────────────────────────────────────┘
                            │
                            ▼
┌─────────────────────────────────────────────────────────────────┐
│  III · STATE MANAGEMENT                           Bab 17 – 26   │
│  Riverpod  ·  Provider  ·  BLoC (7 bab)                         │
└───────────────────────────┬─────────────────────────────────────┘
                            │
                            ▼
┌─────────────────────────────────────────────────────────────────┐
│  IV · FIREBASE & BACKEND                          Bab 27 – 33   │
│  Auth, Firestore, Storage, FCM, offline sync, Maps, MVVM        │
└───────────────────────────┬─────────────────────────────────────┘
                            │
              ┌─────────────┴─────────────┐
              ▼                           ▼
┌──────────────────────────┐  ┌──────────────────────────────────┐
│  V · PRODUK & MONETISASI │  │  VI · GAME 2D DENGAN FLAME       │
│  Bab 34 – 41             │  │  Bab 42 – 50                     │
│  Gemini, AdMob, Stripe,  │  │  Game loop, component, joystick, │
│  Git, rilis, ASO, bisnis │  │  collision, particle, Asteroids  │
└──────────────────────────┘  └──────────────────────────────────┘

Bagian V dan VI berdiri sejajar, bukan berurutan. Setelah menguasai Bagian I sampai IV kamu boleh memilih salah satu — atau melewati keduanya kalau memang belum relevan.

Pilih jalur yang sesuai

Kamu benar-benar baru. Baca berurutan dari Bab 1 sampai Bab 13, jangan melompat. Fondasi Flutter itu saling bertumpuk: kamu tidak akan paham kenapa setState bekerja seperti itu kalau belum paham widget tree. Setelah Bab 13, lanjutkan ke Bagian II dan III.

Kamu sudah bisa bikin UI sederhana. Lompati Bab 1–4, tapi tetap baca Bab 5 (state), Bab 12 (tiga pohon & keys), dan Bab 13 (debugging). Ketiganya sering dilewati pemula dan justru menjadi sumber kebingungan berbulan-bulan sesudahnya.

Kamu datang untuk state management. Mulai dari Bab 17, lalu putuskan: kalau proyekmu kecil sampai menengah, cukup Riverpod (Bab 18). Kalau proyekmu besar dan dikerjakan tim, baca seluruh rangkaian BLoC (Bab 20–26).

Kamu datang untuk Firebase. Bagian IV bisa dibaca cukup mandiri, asalkan kamu sudah nyaman dengan Future, Stream, dan async/await — yang dibahas di Bab 2 dan Bab 14.

Kamu datang untuk bikin game. Bagian VI hanya butuh Bab 1–5 sebagai bekal. Flame punya dunianya sendiri dan tidak memakai widget tree Flutter untuk isi gamenya.

Cara membaca tiap bab

Setiap bab disusun dengan pola yang sama supaya kamu cepat terbiasa:

1. Pembuka — masalah apa yang sebenarnya sedang kita pecahkan.
2. Konsep — penjelasan naratif, sering disertai diagram ASCII atau Mermaid.
3. Kode utuh — bukan potongan sepuluh baris, tetapi berkas lengkap yang bisa kamu salin ke proyek dan jalankan. Bagian penting dibedah baris per baris.
4. Ikhtisar — ringkasan poin kunci di akhir bab, supaya mudah ditinjau ulang.

Kode ditandai dengan nama berkasnya, jadi kamu tahu persis di mana ia seharusnya berada:

// lib/main.dart
import 'package:flutter/material.dart';

void main() {
  runApp(const MyApp());
}

Menyiapkan lingkungan kerja

Sebelum mulai, pastikan tiga hal ini beres. Detail lengkapnya ada di Bab 1.

# 1. Pastikan Flutter SDK terpasang dan sehat
flutter doctor

# 2. Buat proyek latihan
flutter create belajar_flutter
cd belajar_flutter

# 3. Jalankan di emulator atau perangkat
flutter run

Kalau flutter doctor masih menampilkan tanda silang merah, selesaikan itu dahulu. Belajar Flutter sambil melawan lingkungan yang belum siap adalah cara tercepat untuk menyerah.

Transkrip asli

Situs ini adalah rangkuman, bukan pengganti sumbernya. Kalau ada penjelasan yang terasa terlalu padat dan kamu ingin mendengar versi panjangnya, seluruh transkrip mentah tiap kursus tersedia sebagai PDF di halaman Referensi. PDF itu disusun per folder sumber, berurutan sesuai nomor berkas, lengkap dengan daftar isi.

---

Sudah siap? Mulai dari Bab 1 — Pengantar Flutter & Dart.