Banyak sekali aplikasi-aplikasi di smartphone seperti whatsapp, facebook, instagram, twitter dan masih banyak lagi. Aplikasi tersebut bisa di gunakan secara gratis di smartphone baik itu smartphone Android ataupun iPhone. Dan aplikasi itu bisa didapatkan dengan mudah lewat Google Play Store atau App Store.

Bagaimanakah aplikasi itu dibuat dan sampai bisa rilis?

Kali ini kita akan membahas bagaimana cara membuat aplikasi android dari 0 sampai rilis di google play store.

Langsung saja langkah-langkah yang harus diikuti sebagai berikut :

1. Konfigurasi Flutter
2. Membuat Aplikasi Android
3. Membuat Keystore
4. Membuat Akun Google Play
5. Konfigurasi dan Upload APK Bundle
6. Menunggu Hasil Review dari Google

1. Konfigurasi Flutter

• Apa itu Flutter ?
  Flutter adalah alat UI/User Interface Google untuk membuat aplikasi yang bagus, yang dikompilasi secara native untuk seluler, web, dan desktop dari basis kode tunggal. Sumber : https://flutter.dev/. Dengan menggunakan flutter akan mudah dan cepat dalam membuat aplikasi mobile iOS dan Android.
• Installasi flutter di mac, windows, linux
  disini pakai penjelasan menggunakan windows device, untuk device mac dan linux silahkan kunjungi di flutter.dev
  Download flutter SDK terbaru di https://flutter.dev/docs/get-started/install/windows

Setelah download selesai berupa file .zip, ekstrak terlebih dahulu.

Pindahkan folder ke C:\src\

Atur environment supaya perintah flutter dapat di akses di semua path

pilih “Edit environtment variables for your account“

dibagian User variable for … , jika belum ada variable path, maka tamabahkan baru, pilih New … name “Path” value “C:\src\flutter\bin”, jika sudah ada pilih Edit … ketik “;“, ;C:\src\flutter\bin

buka “Command Prompt” atau ketikkan pada pencarian “cmd”
ketik “flutter –version” jika berhasil maka selesai intallasi flutter, seperti berikut

• Installasi editor Visual Studio Code
  Download Android Studio atau Visual Studio Code di https://code.visualstudio.com/download

Tambahkan extention flutter, untuk editing, refactoring, format document.

2. Membuat Aplikasi Android (Aplikasi Catatan Harian)

• Membuat projek flutter baru
  Di dalam terminal ketik perintah berikut :
  flutter create catatan_harian
• Membuka projek catatan_harian
  Buka projek dengan editor visual studio code
  Buat 2 folder di dalam folder lib/ yaitu daftar dan catatan, digunakan untuk memisahkan
  daftar catatan dan olah catatan.
• Membuat halaman daftar kosong seperti berikut :
  Buat file baru dengan nama “daftar_kosong.dart” di dalam folder lib/daftar/

Ketikkan code seperti berikut :

Column(
  mainAxisAlignment: MainAxisAlignment.center,
  children: <Widget>[
    Text(
      'Belum ada catatan',
      style: TextStyle(fontSize: 14, color: Colors.grey[700]),
    ),
  ],
),

Source code lengkap : https://github.com/handoyoapp/catatan_harian/blob/master/lib/daftar/daftar_kosong.dart

• Membuat halaman daftar catatan seperti berikut :
  Buat file baru dengan nama “daftar_catatan.dart” di dalam folder lib/daftar/

Ketikkan code seperti berikut :

SizedBox(height: 10),
Text(
  '${tanggalList[index]}',
  style: TextStyle(color: Colors.grey, fontSize: 10),
),
SizedBox(height: 3),
Text(
  '${judulList[index]}',
  style: TextStyle(
    color: Colors.grey[800],
    fontWeight: FontWeight.bold,
    fontSize: 16,
  ),
),
SizedBox(height: 5),
Text(
  '${catatanList[index]}',
  style: TextStyle(color: Colors.grey[700], fontSize: 14),
  overflow: TextOverflow.ellipsis,
  maxLines: 1,
),
SizedBox(height: 10),

Source code lengkap : https://github.com/handoyoapp/catatan_harian/blob/master/lib/daftar/daftar_catatan.dart

• Membuat halaman catatan (tambah dan ubah catatan) seperti berikut :
  Buat file baru dengan nama “catatan.dart” di dalam folder lib/catatan/

Ketikkan code seperti berikut :

ListView(
  physics: const ClampingScrollPhysics(),
  children: <Widget>[
    Column(
      crossAxisAlignment: CrossAxisAlignment.center,
      children: <Widget>[
        SizedBox(height: 10),
        TanggalCatatan(
          idList: idList,
          tanggalList: tanggalList,
        ),
        JudulCatatan(judulController: judulController),
        Divider(height: 1),
        IsiCatatan(catatanController: catatanController),
      ],
    ),
    SizedBox(height: 45),
  ],
),
SimpanCatatan(onPressedSimpan: onPressedSimpan),

Source code lengkap : https://github.com/handoyoapp/catatan_harian/blob/master/lib/catatan/catatan.dart

• Menambahkan dialog / popup hapus catatan di daftar catatan seperti berikut :
  Untuk membuat aksi hapus catatan, di dalam file daftar_konten.dart, tambah code seperti berikut :

showDialog(
  context: context,
  builder: (_) => AlertDialog(
    title: Text(
      'Yakin "${judulList[index]}" akan dihapus?',
      style: TextStyle(fontSize: 12),
    ),
    content: InkWell(
      onTap: () => hapusCatatan(index),
      child: Container(
        padding: const EdgeInsets.all(8),
        decoration: BoxDecoration(
          color: Color(0xFF1761a0),
          borderRadius: BorderRadius.circular(6),
        ),
        child: Text(
          'Hapus',
          style: TextStyle(
            fontSize: 14,
            color: Colors.white,
          ),
          textAlign: TextAlign.center,
        ),
      ),
    ),
  ),
);

Source code lengkap : https://github.com/handoyoapp/catatan_harian/blob/master/lib/daftar/daftar_konten.dart

• Menambahkan share / bagikan catatan di daftar catatan seperti berikut :
  Untuk membuat aksi share / bagikan, di dalam file “daftar_catatan.dart”
  tambahkan code seperti berikut :

void bagikanCatatan(int index) {
  Share.share( '${tanggalList[index]}\n${judulList[index]}\n${catatanList[index]}');
}

Source code lengkap : https://github.com/handoyoapp/catatan_harian/blob/master/lib/daftar/daftar_catatan.dart

3. Membuat dan Konfigurasi Keystore

Di Mac/Linux, gunakan perintah berikut :

keytool -genkey -v -keystore ~/key.jks -keyalg RSA -keysize 2048 -validity 10000 -alias key

Di Windows, gunakan perintah berikut :

keytool -genkey -v -keystore c:\Users\USER_NAME\key.jks -storetype JKS -keyalg RSA -keysize 2048 -validity 10000 -alias key

Buat file di folder android/key.properties untuk keystore :

storePassword=<password>
keyPassword=<password>
keyAlias=key
storeFile=<android/key.jks>

Konfigurasi signing app di android/app/build.gradle berikut :

Tambahkan code :
Informasi keystore key.properties

def keystoreProperties = new Properties()
def keystorePropertiesFile = rootProject.file('key.properties')
if (keystorePropertiesFile.exists()) {
   keystoreProperties.load(new FileInputStream(keystorePropertiesFile))
}

android {
  ...
}

Konfigurasi build release

buildTypes {
 release {
  signingConfig signingConfigs.debug
 }
}

signingConfigs {
 release {
   keyAlias keystoreProperties['keyAlias']
   keyPassword keystoreProperties['keyPassword']
   storeFile keystoreProperties['storeFile'] ? file(keystoreProperties['storeFile']) : null
   storePassword keystoreProperties['storePassword']
 }
}

buildTypes {
  release {
   signingConfig signingConfigs.release
  }
}

4. Membuat Akun Google Play

Silahkan buka link berikut : https://play.google.com/apps/publish/signup/#

Lakukan pembayaran akun ke google play store sebesar $25 dengan kartu kredit.
Alternatif lain kalian bisa gunakan “Jenius“. Apa itu jenius? kalian bisa cari tahu di https://www.jenius.com/, jika kalian sudah punya jenius pastikan saldo mencukupi untuk melakukan pembayaran akun google play store :).

5. Konfigurasi dan Upload APK Bundle

Build app bundle (.aab)
flutter build appbundle

build/app/outputs/bundle/release/app-release.aab

Buka google play console : https://play.google.com/apps/publish/?account=

Create Application

Melengkapi app release
Create Release Production

Melengkapi store listing

Upload app-release.aab

Melengkapi content rating

Melengkapi app content

Melengkapi pricing & distribution

Start Rollout to Production
Jika semua sudah tervalidasi langkah selanjutnya yaitu Review dan Start Rollout to Production.

Upload play store selesai tinggal nunggu review dari google supaya aplikasi rilis.
Setelah menunggu kurang lebih 3 hari, aplikasi sudah rilis di play store.

Aplikasi Catatan Harian
https://play.google.com/store/apps/details?id=com.belajaraplikasi.catatan_harian

Sekian dan terima kasih.
Happy coding 🙂