Belajar Capacitorjs - OTA Live Updates

#Pendahuluan

Setelah di episode 20 kita publish ke App Store dan Play Store, pada episode ini kita membahas OTA Live Updates — cara update kode web tanpa melalui review store. Ini adalah salah satu keunggulan terbesar Capacitor dibanding app native murni.

Mengapa OTA updates penting? Karena review store bisa memakan waktu 24-48 jam (iOS) atau beberapa jam (Android). Untuk bug fix kritis atau UI patch, kalian tidak bisa menunggu review. OTA updates memungkinkan kalian mengirim fix dalam hitungan menit.

#Apa Itu OTA Updates?

OTA updates hanya meng-update kode web (HTML/CSS/JS), bukan kode native. Artinya:

• Perubahan UI: langsung.
• Perubahan logic JavaScript: langsung.
• Perubahan native code: tetap butuh store review.
• Plugin baru: tetap butuh store review.

#Compliant untuk Bug Fix & UI

Apple dan Google mengizinkan OTA updates selama tidak mengubah fungsionalitas inti secara drastis. OTA cocok untuk:

• Bug fix.
• UI patch.
• Perubahan copy/teks.
• Perubahan styling.
• Content updates.

OTA tidak cocok untuk:

• Menambah fitur native baru.
• Mengubah permission.
• Mengubah application ID.
• Perubahan yang melanggar store guidelines.

#Capgo (Open-Source)

Capgo adalah platform OTA open-source untuk Capacitor:

#Setup

npm install -g @capgo/cli
capgo init

#Konfigurasi

const config: CapacitorConfig = {
  // ...
  plugins: {
    CapgoLiveUpdate: {
      appId: 'your-capgo-app-id',
      channel: 'production',
    },
  },
};

#Push Update

capgo sync
capgo upload

Capgo akan:

1. Bundle kode web terbaru.
2. Upload ke CDN global.
3. Perangkat yang menjalankan app akan download update di launch berikutnya.

#Channel Management

# Create channel
capgo channel create beta
 
# Set channel
capgo channel set beta
 
# Push ke channel tertentu
capgo upload --channel beta

Channel memungkinkan kalian:

• Production: untuk user stabil.
• Beta: untuk tester internal.
• Staging: untuk QA.

#Ionic Appflow Live Updates

Ionic Appflow menawarkan managed OTA:

#Setup

1. Buat account di ionic.io.
2. Install Appflow SDK.
3. Konfigurasi di capacitor.config.ts.

npm install @ionic-enterprise/updates

#Push Update

npx cap sync
ionic deploy build

#Kelebihan Managed

• Dashboard visual untuk manage versi.
• Rollback dengan satu klik.
• A/B testing support.
• Analytics update adoption.

#Versioning Strategy

#Semantic Versioning untuk Web

v1.0.0    ← Major (breaking changes)
v1.1.0    ← Minor (new features, backward compatible)
v1.1.1    ← Patch (bug fixes)

#Rollback Strategy

import { LiveUpdate } from '@capgo/capacitor-live-update';
 
// Listen for update result
LiveUpdate.addListener('updateAvailable', (event) => {
  console.log('Update available:', event.version);
});
 
LiveUpdate.addListener('updateInstalled', (event) => {
  console.log('Update installed, will apply on next launch');
});
 
LiveUpdate.addListener('updateFailed', async (event) => {
  console.error('Update failed:', event.error);
  // Rollback ke versi sebelumnya
  await LiveUpdate.setChannel({ channel: 'rollback' });
});

#Auto-Update vs Manual

const config: CapacitorConfig = {
  plugins: {
    CapgoLiveUpdate: {
      appId: 'your-app-id',
      channel: 'production',
      autoUpdate: true,        // auto-update saat launch
      updateInterval: 3600000, // check setiap 1 jam
    },
  },
};

#Best Practices

• Test di staging channel sebelum push ke production.
• Monitor crash rate setelah update (episode 23).
• Rollback plan: siapkan channel rollback selalu.
• Jangan update native-only features lewat OTA.
• Communicate update ke user melalui release notes.

#Penutup

Pada episode 21 ini, kalian telah memahami:

• OTA updates meng-update kode web tanpa store review.
• Capgo: open-source, push via CLI, channel management.
• Ionic Appflow: managed, dashboard, rollback, analytics.
• Versioning dan rollback strategy untuk safety.
• Compliant: cocok untuk bug fix & UI, bukan perubahan native.

Di episode 22 selanjutnya, kita akan membahas keamanan aplikasi — SSL pinning, secure storage (Keychain/Keystore), WebView hardening, obfuscation, enkripsi at-rest, dan audit security checklist. Sampai jumpa!