java php laravel linux mysql sql bootstrap html css query java php laravel linux mysql sql bootstrap html css query

Monday, May 4, 2026

flutter build APK

🎓 Artikel 16 dari 16 🏆 Project Akhir 🔥 Final Episode

Project Akhir Bagian 2 —
Build & Deploy Aplikasi ke APK Android

Saatnya misi terbesar: ubah kode Flutter-mu menjadi file APK nyata yang bisa diinstal di HP Android siapapun. Ini bukan sekadar latihan — ini peluncuran resmimu sebagai developer!

build APK Flutter Android deploy Flutter release mode signing APK Dart from Zero to Zorro
⏱️
Estimasi Baca
12–15 Menit
🎯
Level
Project Akhir
📅
Tahun
2026
🏗️
Seri
Dart From Zero to Zorro

Pernah nggak kamu download aplikasi dari teman, instal di HP, terus mikir: "Kapan ya gue bisa bikin yang kayak gini sendiri?" Nah, hari ini jawaban itu ada di tanganmu. Di artikel penutup seri Dart From Zero to Zorro ini, kita akan melakukan proses build APK Flutter Android deploy secara lengkap — dari kode yang sudah kamu bangun di artikel 15, sampai jadi file .apk yang bisa langsung diinstal di HP Android siapa pun. Ini bukan cuma latihan teknis biasa. Ini adalah momen di mana kamu resmi bisa menyebut dirimu Flutter Developer. 🚀

📐 Konsep Kunci
APK = Paket siap-edar aplikasi Android kamu
APK (Android Package Kit) adalah format file yang berisi semua yang dibutuhkan untuk menjalankan aplikasi di Android — kode, aset, manifest, dan tanda tangan digital. Flutter mengompilasi kode Dart kamu menjadi kode native, lalu membungkusnya dalam satu file APK yang siap distribusikan.

🔬 Apa Bedanya Debug vs Release Mode saat Build APK Flutter?

Bayangkan kamu lagi masak. Saat latihan di dapur, kamu boleh cicipin terus, lihat resep berkali-kali, dan biarin kompor menyala lama. Tapi saat sajikan ke tamu, kamu mau hasilnya rapi, cepat, dan optimal — tidak ada bahan setengah jadi di meja.

Begitu pula Flutter. Mode debug dipakai saat development (bisa hot reload, ada overlay debug), sedangkan mode release adalah versi "sajian ke tamu" — dioptimasi penuh untuk performa terbaik dan ukuran terkecil. Untuk build APK Android deploy yang sesungguhnya, kamu wajib pakai mode release.

Aspek 🐛 Debug Mode 🚀 Release Mode
Ukuran APK Besar (~30–80 MB) Lebih kecil (~10–25 MB)
Performa Lebih lambat Dioptimasi penuh
Hot Reload ✅ Tersedia ❌ Tidak ada
Debug Banner Ada (banner merah) Tidak ada
Tanda Tangan Debug keystore (auto) Keystore milikmu
💡
Tips
Selalu test aplikasimu dalam mode debug dulu sampai tidak ada bug, baru build release. Jangan langsung release kalau fitur masih belum stabil — tamu tidak suka makanan setengah matang!

🛠️ Langkah-Langkah Build APK Flutter Android — Deploy Siap Jalan

Oke, kita masuk ke inti artikel. Berikut panduan lengkap proses build APK Flutter Android deploy dari nol sampai file APK tersedia di folder kamu. Ikuti setiap langkah dengan teliti ya!

1
Pastikan Flutter SDK & Dependencies Siap
Buka terminal di root project Flutter kamu, lalu jalankan perintah berikut untuk memastikan semua bersih dan siap:
Terminal 
flutter clean
flutter pub get
flutter doctor
Pastikan flutter doctor tidak menunjukkan error kritis (khususnya di bagian Android toolchain).
2
Buat Keystore untuk Tanda Tangan APK
Keystore adalah "cap resmi" developer — seperti tanda tangan notaris di dokumen legal. APK release wajib ditandatangani. Jalankan perintah berikut di terminal (bukan di folder project, tapi di folder yang aman, misalnya ~/keystore/):
Terminal 
keytool -genkey -v \
  -keystore ~/keystore/my-release-key.jks \
  -keyalg RSA -keysize 2048 \
  -validity 10000 \
  -alias my-key-alias
Kamu akan diminta mengisi nama, organisasi, negara, dan password. Simpan password ini baik-baik — kalau hilang, kamu tidak bisa update aplikasi di masa depan!
⚠️
Perhatian Penting
Jangan simpan file keystore di dalam folder project Git! Kalau kamu push ke GitHub tanpa sengaja, siapa pun bisa menyalin identitas digitalmu sebagai developer. Simpan di tempat yang aman dan backup di cloud storage private.
3
Konfigurasi Keystore di Project Flutter
Buat file android/key.properties di project-mu dengan isi berikut:
android/key.properties 
storePassword=PASSWORD_KAMU
keyPassword=PASSWORD_KAMU
keyAlias=my-key-alias
storeFile=/Users/namamu/keystore/my-release-key.jks
Sesuaikan path storeFile dengan lokasi keystore-mu. Tambahkan juga key.properties ke dalam .gitignore agar tidak terupload ke Git!
4
Edit android/app/build.gradle untuk Signing Config
Buka file android/app/build.gradle dan tambahkan konfigurasi signing berikut:
android/app/build.gradle 
// Tambahkan di bagian atas, sebelum android {}
def keystoreProperties = new Properties()
def keystorePropertiesFile = rootProject.file('key.properties')
if (keystorePropertiesFile.exists()) {
    keystoreProperties.load(
        new FileInputStream(keystorePropertiesFile)
    )
}

android {
    // ...
    signingConfigs {
        release {
            keyAlias       keystoreProperties['keyAlias']
            keyPassword    keystoreProperties['keyPassword']
            storeFile      keystoreProperties['storeFile']
                           ? file(keystoreProperties['storeFile'])
                           : null
            storePassword  keystoreProperties['storePassword']
        }
    }
    buildTypes {
        release {
            signingConfig signingConfigs.release
        }
    }
}
5
Jalankan Perintah Build APK Release
Inilah momen yang kamu tunggu-tunggu. Kembali ke terminal di root folder project, dan jalankan:
Terminal 
flutter build apk --release
Tunggu beberapa menit sampai proses selesai. APK siap pakai akan tersimpan di: build/app/outputs/flutter-apk/app-release.apk
⚡
Insight Penting
Selain flutter build apk, kamu juga bisa build App Bundle (.aab) dengan perintah flutter build appbundle. Format AAB adalah format yang direkomendasikan untuk upload ke Google Play Store karena ukurannya lebih kecil dan lebih efisien.

📱 Deploy APK ke HP Android — Dari File ke Tangan Pengguna

Setelah file app-release.apk tersedia, kamu punya beberapa pilihan untuk mendistribusikannya. Ini adalah tahap deploy dalam siklus hidup aplikasimu!

📊 Perbandingan Cara Deploy APK
🔌
Via USB (ADB)
Paling cepat saat development. Langsung install ke HP yang terhubung.
⭐ Direkomendasikan
📁
Transfer File
Copy APK ke HP via kabel atau Bluetooth, install manual dari File Manager.
☁️
Google Drive / Link
Upload APK ke Drive, share link ke tester. Cocok untuk beta testing.
🏪
Google Play Store
Publikasikan ke dunia! Upload AAB ke Play Console (butuh akun developer $25).
🚀 Full Deploy
📲
Install Langsung via ADB (paling simpel)
Hubungkan HP ke komputer via USB, aktifkan USB Debugging di Developer Options, lalu jalankan:
Terminal 
flutter install
🔥
Fakta Menarik
Flutter menggunakan Dart AOT (Ahead-of-Time) compilation saat build release. Artinya kode Dart kamu dikompilasi ke kode native ARM sebelum dijalankan — bukan diinterpretasi saat runtime. Hasilnya? Performa aplikasimu mendekati aplikasi yang ditulis langsung dalam Kotlin atau Swift!

🎨 Kustomisasi Penting Sebelum Deploy: Nama, Icon & Versi

Sebelum APK kamu beredar, ada beberapa hal yang harus disesuaikan agar aplikasimu terlihat profesional — bukan aplikasi bernama "myapp" dengan icon bawaan Flutter. Ini bagian dari proses build APK Flutter Android deploy yang sering dilupakan pemula!

A
Ubah Nama & Versi Aplikasi (pubspec.yaml)
pubspec.yaml 
name: todo_app_zorro
description: Aplikasi To-Do List buatan saya sendiri!
version: 1.0.0+1   # format: versi+buildNumber
B
Ubah Nama App di Android (AndroidManifest.xml)
android/app/src/main/AndroidManifest.xml 
<application
    android:label="Todo Zorro"
    android:icon="@mipmap/ic_launcher">
Untuk icon, gunakan package flutter_launcher_icons agar prosesnya lebih mudah dan otomatis untuk semua ukuran.
💡
Tips Pro: Flutter Launcher Icons
Tambahkan flutter_launcher_icons: ^0.13.1 ke dev_dependencies di pubspec.yaml, letakkan gambar iconmu di assets/icon.png, lalu jalankan dart run flutter_launcher_icons. Package ini akan otomatis generate icon untuk semua resolusi!
🏁 Kesimpulan & Penutup Seri

Selamat! Kamu Telah Menyelesaikan Seluruh Seri Dart From Zero to Zorro 🎉

Di artikel pamungkas ini, kita telah menuntaskan proses build APK Flutter Android deploy secara menyeluruh. Mulai dari memahami perbedaan debug vs release mode, membuat keystore sebagai cap resmi developer, mengkonfigurasi signing di Gradle, menjalankan perintah build, hingga mendeploy APK ke HP Android — semuanya sudah kamu lalui!

Ingat poin-poin kunci ini:

✅ Gunakan Release Mode untuk APK final — bukan Debug!
✅ Keystore adalah identitas developer — simpan dengan aman dan jangan hilang!
✅ Perintah ajaib: flutter build apk --release
✅ APK tersimpan di build/app/outputs/flutter-apk/app-release.apk
✅ Untuk Play Store, gunakan App Bundle (.aab) bukan APK biasa
Dari 16 artikel dalam seri ini, kamu telah menguasai dasar-dasar Dart, konsep OOP, Flutter widget, state management, hingga build & deploy APK. Perjalanan dari Zero ke Zorro ini bukan akhir — ini justru awal dari karir developer-mu yang sebenarnya! 🗡️
💬 Berhasil build APK pertamamu? Share pengalamanmu di kolom komentar! Sudah kamu install di HP siapa? 😄
📚 Lihat Semua 16 Artikel 🔗 Share Artikel Ini
🏷️ Tags
#BelajarDart #DartFromZeroToZorro #BuildAPKFlutter #AndroidDeploy #FlutterRelease #FlutterDeveloper #DartPemula #ProjectAkhir #Artikel16
📖
Seri Belajar Dart: Dart From Zero to Zorro
Artikel ini adalah bagian dari seri lengkap 16 artikel belajar Dart & Flutter dari nol. Mulai dari sintaks dasar hingga deploy APK Android!
🗺️ Lihat Daftar Isi Lengkap
🧭 Navigasi Seri
← Artikel Sebelumnya
Artikel 15 — Project Akhir Bagian 1: Bangun Aplikasi To-Do List Lengkap
🔗 [isi URL artikel 15 setelah publish]
🏆
Ini adalah artikel terakhir dalam seri!
Kamu telah menyelesaikan seluruh seri Dart From Zero to Zorro. Selamat! 🎉
By at No comments:
Gmail  Blogger   Twitter   Facebook  

flutter project to do app

🚀 PROJECT: TO-DO APP 📱 FLUTTER 🎯 ARTIKEL 15 / 16

Project Akhir Bagian 1
Bangun Aplikasi
To-Do List Lengkap

Saatnya semua ilmu Dart & Flutter yang kamu pelajari dalam seri ini diwujudkan jadi sebuah aplikasi nyata. Siap meluncur? 🛸

⏱️
Estimasi Baca
12–15 Menit
🏆
Level
Project Akhir
📅
Tahun
2026
📦
Seri
Dart From Zero to Zorro

Pernah nggak kamu buka aplikasi to-do list di HP, terus tiba-tiba kepikiran: "Gimana ya cara bikinnya?" Nah, artikel ini adalah jawabannya — dan lebih dari itu. Kalau kamu sudah mengikuti seri Dart From Zero to Zorro dari artikel pertama, kamu sudah punya semua bahan untuk membangun sebuah project Flutter to-do list Android yang fungsional dan siap digunakan. Ini bukan latihan kecil-kecilan. Ini adalah proyek nyata yang akan kamu banggakan.

Di Bagian 1 ini, kita akan menyiapkan fondasi proyek: struktur folder, model data, manajemen state, dan UI utama aplikasi. Anggap ini seperti membangun fondasi rumah — kalau fondasinya kokoh, bangunan di atasnya pasti kuat. 🏗️

📐 Definisi Project

Project Flutter To-Do List Android adalah aplikasi mobile yang memungkinkan pengguna menambah, menandai selesai, dan menghapus tugas — dengan data yang tersimpan secara lokal di perangkat. Proyek ini menggabungkan: State Management, Local Storage, Widget Tree, dan Clean Architecture — semua yang sudah kamu pelajari dalam seri ini.

🎯 Kenapa Project Flutter To-Do List Android Adalah Proyek Terbaik untuk Pemula?

Bayangkan kamu baru belajar masak. Guru terbaik tidak akan langsung menyuruhmu bikin rendang 8 jam. Mereka minta kamu goreng telur dulu — sederhana, tapi mengajarkan semua teknik dasar: panas api, timing, dan rasa.

To-Do List adalah "goreng telur"-nya dunia Flutter. Sederhana di permukaan, tapi di baliknya tersembunyi hampir semua konsep penting yang perlu kamu kuasai sebagai Flutter developer.

Konsep Flutter Dipakai di To-Do App? Di Mana?
StatefulWidget ✅ Ya Tambah / hapus tugas
ListView.builder ✅ Ya Menampilkan daftar tugas
SharedPreferences / Hive ✅ Ya Simpan data lokal
Model Class (OOP) ✅ Ya Struktur data Task
setState() & Rebuild ✅ Ya Update UI saat tugas berubah
🔥
Fakta Menarik

Hampir 90% tutorial Flutter untuk pemula menggunakan To-Do List sebagai proyek pertama. Bukan kebetulan — aplikasi ini memaksa kamu memahami siklus hidup data dari input pengguna → state → penyimpanan → tampilan. Itu adalah alur kerja semua aplikasi mobile modern.

🛠️ Step-by-Step: Membangun Project Flutter To-Do List Android dari Nol

Ikuti setiap langkah berikut dengan seksama. Kita mulai dari membuat project baru hingga UI yang siap dijalankan di Android.

1

Buat Project Flutter Baru

Buka terminal, arahkan ke folder kerjamu, dan jalankan perintah berikut. Nama project pakai huruf kecil dan underscore.

Terminal 
flutter create todo_app_dart
cd todo_app_dart
flutter run
2

Tambahkan Dependency di pubspec.yaml

Kita pakai shared_preferences untuk menyimpan data lokal dan uuid untuk membuat ID unik setiap tugas.

pubspec.yaml 
dependencies:
  flutter:
    sdk: flutter
  shared_preferences: ^2.2.3
  uuid: ^4.3.3
💡
Tips

Setelah mengubah pubspec.yaml, selalu jalankan flutter pub get di terminal agar dependency ter-download otomatis. Lupa langkah ini adalah penyebab error #1 pemula.

3

Buat Model Class: task.dart

Buat file baru di lib/models/task.dart. Model ini adalah blueprint data setiap tugas — seperti KTP untuk setiap item di daftar kamu.

lib/models/task.dart 
class Task {
  final String id;
  String title;
  bool isDone;
  DateTime createdAt;

  Task({
    required this.id,
    required this.title,
    this.isDone = false,
    DateTime? createdAt,
  }) : createdAt = createdAt ?? DateTime.now();

  // Konversi ke Map untuk disimpan di SharedPreferences
  Map<String, dynamic> toMap() => {
    'id': id,
    'title': title,
    'isDone': isDone,
    'createdAt': createdAt.toIso8601String(),
  };

  // Buat Task dari Map saat membaca data
  factory Task.fromMap(Map<String, dynamic> map) => Task(
    id: map['id'],
    title: map['title'],
    isDone: map['isDone'],
    createdAt: DateTime.parse(map['createdAt']),
  );
}
4

Buat Service Penyimpanan: task_service.dart

File ini bertanggung jawab menyimpan dan membaca data dari SharedPreferences. Buat di lib/services/task_service.dart.

lib/services/task_service.dart 
import 'dart:convert';
import 'package:shared_preferences/shared_preferences.dart';
import '../models/task.dart';

class TaskService {
  static const String _key = 'tasks_data';

  Future<List<Task>> loadTasks() async {
    final prefs = await SharedPreferences.getInstance();
    final data = prefs.getString(_key);
    if (data == null) return [];
    final List decoded = jsonDecode(data);
    return decoded.map((e) => Task.fromMap(e)).toList();
  }

  Future<void> saveTasks(List<Task> tasks) async {
    final prefs = await SharedPreferences.getInstance();
    final data = jsonEncode(tasks.map((t) => t.toMap()).toList());
    await prefs.setString(_key, data);
  }
}
5

Bangun UI Utama: home_screen.dart

Ini adalah layar utama aplikasi. Di sini semua state dikelola dan UI ditampilkan. Buat di lib/screens/home_screen.dart.

lib/screens/home_screen.dart 
import 'package:flutter/material.dart';
import 'package:uuid/uuid.dart';
import '../models/task.dart';
import '../services/task_service.dart';

class HomeScreen extends StatefulWidget {
  const HomeScreen({super.key});

  @override
  State<HomeScreen> createState() => _HomeScreenState();
}

class _HomeScreenState extends State<HomeScreen> {
  final TaskService _service = TaskService();
  final TextEditingController _ctrl = TextEditingController();
  final Uuid _uuid = const Uuid();
  List<Task> _tasks = [];

  @override
  void initState() {
    super.initState();
    _loadTasks();
  }

  Future<void> _loadTasks() async {
    final data = await _service.loadTasks();
    setState(() => _tasks = data);
  }

  Future<void> _addTask() async {
    if (_ctrl.text.trim().isEmpty) return;
    final newTask = Task(
      id: _uuid.v4(),
      title: _ctrl.text.trim(),
    );
    setState(() => _tasks.add(newTask));
    _ctrl.clear();
    await _service.saveTasks(_tasks);
  }

  Future<void> _toggleTask(int index) async {
    setState(() => _tasks[index].isDone = !_tasks[index].isDone);
    await _service.saveTasks(_tasks);
  }

  Future<void> _deleteTask(int index) async {
    setState(() => _tasks.removeAt(index));
    await _service.saveTasks(_tasks);
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('📋 My To-Do List'),
        backgroundColor: const Color(0xFF6366F1),
        foregroundColor: Colors.white,
      ),
      body: Column(children: [
        // Input Area
        Padding(
          padding: const EdgeInsets.all(16),
          child: Row(children: [
            Expanded(
              child: TextField(
                controller: _ctrl,
                decoration: const InputDecoration(
                  hintText: 'Tambah tugas baru...',
                  border: OutlineInputBorder(),
                ),
                onSubmitted: (_) => _addTask(),
              ),
            ),
            const SizedBox(width: 8),
            ElevatedButton(
              onPressed: _addTask,
              style: ElevatedButton.styleFrom(
                backgroundColor: const Color(0xFF6366F1),
                foregroundColor: Colors.white,
              ),
              child: const Text('Tambah'),
            ),
          ]),
        ),
        // Task List
        Expanded(
          child: ListView.builder(
            itemCount: _tasks.length,
            itemBuilder: (ctx, i) => ListTile(
              leading: Checkbox(
                value: _tasks[i].isDone,
                onChanged: (_) => _toggleTask(i),
                activeColor: const Color(0xFF6366F1),
              ),
              title: Text(
                _tasks[i].title,
                style: TextStyle(
                  decoration: _tasks[i].isDone
                    ? TextDecoration.lineThrough
                    : null,
                  color: _tasks[i].isDone
                    ? Colors.grey
                    : Colors.black87,
                ),
              ),
              trailing: IconButton(
                icon: const Icon(Icons.delete_outline,
                  color: Colors.redAccent),
                onPressed: () => _deleteTask(i),
              ),
            ),
          ),
        ),
      ]),
    );
  }
}
⚡
Insight Penting

Perhatikan pola setState() → simpan ke storage → rebuild UI. Inilah siklus state management paling fundamental di Flutter. Memahami pola ini di sini akan membuat kamu jauh lebih mudah memahami Provider, Riverpod, atau BLoC di masa depan.

🏛️ Analisis Arsitektur Project Flutter To-Do List Android Ini

Kenapa kita tidak menaruh semua kode di satu file saja? Jawabannya: skalabilitas dan keterbacaan. Struktur folder yang rapi adalah tanda seorang developer profesional.

🗂️ Struktur Folder Project 
lib/
├── models/
│   └── task.dart         # Blueprint data Task
├── services/
│   └── task_service.dart  # Logic simpan & baca data
├── screens/
│   └── home_screen.dart   # UI + State management
└── main.dart            # Entry point aplikasi
📁 models/

Definisi struktur data. Tidak ada logic bisnis di sini — murni blueprint.

⚙️ services/

Semua interaksi dengan storage/API. Terpisah dari UI agar mudah diganti.

📱 screens/

Widget dan UI. Hanya memanggil service, tidak langsung sentuh storage.

🚀 main.dart

Entry point minimal. Hanya menjalankan app dan routing halaman pertama.

⚠️
Perhatian

Jangan lupa update lib/main.dart untuk mengarahkan ke HomeScreen yang baru dibuat. Tanpa ini, aplikasi akan tetap menampilkan template default Flutter yang membingungkan.

6

Update Entry Point: main.dart

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

void main() => runApp(const MyApp());

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'To-Do App',
      debugShowCheckedModeBanner: false,
      theme: ThemeData(
        colorSchemeSeed: const Color(0xFF6366F1),
        useMaterial3: true,
      ),
      home: const HomeScreen(),
    );
  }
}
⚡
Insight: useMaterial3

useMaterial3: true mengaktifkan sistem desain Material 3 terbaru dari Google. Secara otomatis, komponen seperti tombol, chip, dan card akan tampil lebih modern tanpa kode tambahan. Gratis upgrade visual hanya dengan satu baris! ✨

🎉

Kesimpulan: Fondasi Project Sudah Siap!

Di artikel ke-15 ini, kamu telah berhasil membangun fondasi dari sebuah project Flutter to-do list Android yang sesungguhnya. Ini bukan sekadar latihan — ini adalah bukti nyata bahwa kamu sudah menguasai:

✅ Model Class Dart
✅ Local Storage (SharedPreferences)
✅ StatefulWidget & setState()
✅ Arsitektur Folder yang Rapi

Di Artikel 16 — Bagian 2, kita akan menyelesaikan proyek ini sepenuhnya: menambahkan fitur filter tugas, polish UI, lalu build dan deploy ke APK Android yang siap kamu install di HP sendiri. Nantikan! 🚀

💬 Sudah coba build project-nya? Share pengalamanmu di komentar!

Ketemu error? Bingung di bagian mana? Atau berhasil dan mau flexing? Semua boleh! Komentar kamu membantu teman-teman belajar yang lain. 🙌

Tags

#BelajarDart #DartFromZeroToZorro #FlutterProject #ToDoApp #AndroidDev #SharedPreferences #StatefulWidget #ProjectAkhir
📚 Bagian dari Seri

Dart From Zero to Zorro

Artikel ini adalah bagian dari seri lengkap 16 artikel belajar Dart & Flutter dari nol hingga bisa build APK Android. Lihat semua artikel dan ikuti perjalanannya dari awal!

🗺️ Lihat Daftar Isi Lengkap Seri →
By at No comments:
Gmail  Blogger   Twitter   Facebook  
Subscribe to: Posts (Atom)

saifiahmada.com adalah blog belajar programming Indonesia, membahas lengkap materi bahasa pemrograman: code HTML, CSS, Bootstrap, Desain, PHP, MySQL, coding Java, Query, SQL, dan dunia linux