Expo & Managed Workflow — Mobile

Expo Ecosystem Expo adalah platform yang mempermudah development, build, dan deploy React Native app. Dengan Expo, kamu bisa membuat app tanpa menyentuh Xcode…

Managed workflow di Expo artinya kamu menulis kode JavaScript/TypeScript plus satu file konfigurasi, app.json, dan Expo yang membuatkan project native iOS dan Android dari situ setiap kali dibutuhkan. Bayangin Bu Rini memesan seragam karyawan lewat konveksi. Dia cuma mengisi formulir: ukuran, warna, logo. Konveksi yang memotong kain dan menjahit. Kalau mau ganti warna, Bu Rini gak membongkar jahitan, cukup ubah formulirnya lalu pesan ulang. app.json adalah formulirnya, npx expo prebuild adalah konveksinya, dan folder ios/ serta android/ adalah seragam jadinya.

🧪 Tebakan cepat: Kamu membuka ios/LaundryBuRini/Info.plist hasil prebuild dan menambahkan teks izin kamera dengan tangan. Besok temanmu menjalankan npx expo prebuild lagi. Teks itu masih ada? Jawabannya ada di bagian "Config plugin: mengubah native lewat app.json".

Managed sekarang artinya CNG

Dulu ada dua kubu: managed (gak ada folder native sama sekali) dan bare (folder ios/ dan android/ disimpan di git dan diubah dengan tangan). Pindah dari managed ke bare disebut eject. Sekarang Expo memakai Continuous Native Generation (CNG): folder native dibuat ulang dari app.json kapan pun dibutuhkan, dan gak disimpan di git. Template-nya sudah menaruh /ios dan /android di .gitignore. Perintah lamanya juga sudah gak ada:

$ npx expo eject
  $ expo eject is not supported in the local CLI, please use npx expo prebuild instead

Bare masih boleh: kamu menyimpan dan mengubah sendiri folder native. Konsekuensinya, prebuild gak bisa lagi membuatnya ulang tanpa menimpa perubahanmu.

npx expo prebuild

Dijalankan di project Laundry Bu Rini (Expo SDK 57), 11 Oktober 2026:

$ npx expo prebuild --no-install
› Android package name: com.anonymous.laundryburini
› Apple bundle identifier: com.anonymous.laundryburini
✔ Created native directories
✔ Updated package.json
✔ Finished prebuild

Kalau dijalankan lagi saat folder native sudah ada, prebuild di Expo SDK 57 menghapusnya dulu lalu membuat dari nol:

$ npx expo prebuild --no-install
✔ Cleared android, ios code
✔ Created native directories
✔ Updated package.json | no changes
✔ Finished prebuild

Jadi --clean dari tutorial lama sekarang sudah jadi bawaan. --no-clean menerapkan perubahan ke folder yang sudah ada tanpa menghapusnya.

Config plugin: mengubah native lewat app.json

Config plugin adalah fungsi yang menulis ke file native saat prebuild. Banyak library Expo membawanya. Untuk izin kamera:

{
  "expo": {
    "name": "Laundry Bu Rini",
    "scheme": "laundryburini",
    "ios": { "bundleIdentifier": "id.laundryburini.app" },
    "android": { "package": "id.laundryburini.app" },
    "plugins": [
      "expo-router",
      ["expo-camera", {
        "cameraPermission": "Izinkan Laundry Bu Rini memotret nota cucianmu.",
        "microphonePermission": false,
        "recordAudioAndroid": false
      }]
    ]
  }
}

Setelah npx expo prebuild:

ios/LaundryBuRini/Info.plist
    <key>NSCameraUsageDescription</key>
    <string>Izinkan Laundry Bu Rini memotret nota cucianmu.</string>

android/app/src/main/AndroidManifest.xml
  <uses-permission android:name="android.permission.CAMERA"/>

Teks yang kamu ketik langsung di Info.plist hilang di prebuild berikutnya, karena foldernya dihapus dan dibuat ulang dari app.json. Itu jawaban tebakannya. Semua perubahan native ditaruh di app.json atau di config plugin. Kalau butuh kode native sendiri yang gak didukung library mana pun, tulis config plugin atau Expo Module milikmu sendiri. Pindah ke bare adalah pilihan terakhir.

app.config.ts: konfigurasi yang dihitung

app.json isinya tetap. Kalau nilainya harus dihitung, tambahkan app.config.ts, yang menerima isi app.json sebagai config:

// app.config.ts
import type { ConfigContext, ExpoConfig } from 'expo/config';

const DEV = process.env.APP_VARIANT === 'development';

export default ({ config }: ConfigContext): ExpoConfig => ({
  ...config,
  name: DEV ? 'Bu Rini (Dev)' : 'Laundry Bu Rini',
  slug: 'laundry-bu-rini',
  ios: { ...config.ios, bundleIdentifier: DEV ? 'id.laundryburini.app.dev' : 'id.laundryburini.app' },
  android: { ...config.android, package: DEV ? 'id.laundryburini.app.dev' : 'id.laundryburini.app' },
});

APP_VARIANT=development npx expo config --type public mencetak name: 'Bu Rini (Dev)' dan bundleIdentifier: 'id.laundryburini.app.dev'. Tanpa variabel itu: 'Laundry Bu Rini' dan 'id.laundryburini.app'. ID yang beda membuat development build dan aplikasi asli bisa terpasang berdampingan di satu HP.

Expo Go atau development build

Expo Go cukup untuk belajar (pelajaran setup). Development build wajib saat:

Caranya: npx expo install expo-dev-client, lalu npx expo run:android (butuh Android Studio di laptop) atau eas build --profile development --platform android (di server Expo). Setelah terpasang, tetap npx expo start seperti biasa. Build ulang cuma saat bagian native berubah: library native baru, atau isi plugins berubah.

EAS: Build, Submit, Update

EAS (Expo Application Services) adalah layanan Expo di cloud, dipakai lewat eas-cli (versi 24.12.1 di npm, Oktober 2026). Profilnya di eas.json:

{
  "build": {
    "development": { "developmentClient": true, "distribution": "internal" },
    "preview": { "distribution": "internal" },
    "production": {}
  }
}

⚠️ Jebakan yang sering ketemu

TL;DR: Managed sekarang berarti CNG: folder ios/ dan android/ dibuat dari app.json oleh npx expo prebuild (78 file di project ini) dan gak disimpan di git; expo eject sudah diganti prebuild. Perubahan native lewat config plugin di plugins (misalnya expo-camera dengan cameraPermission menulis NSCameraUsageDescription dan izin CAMERA), bukan diedit tangan, karena prebuild di SDK 57 menghapus dan membuat ulang foldernya (kecuali dengan --no-clean). app.config.ts untuk nilai yang dihitung, misalnya ID .dev. Development build wajib untuk library native di luar Expo Go, perubahan konfigurasi native, dan push di Android. EAS Build membuat aplikasi di cloud (iOS tanpa Mac), EAS Submit mengunggah ke store, EAS Update mengirim JavaScript tanpa build baru. Keuntungan Expo: setup mudah, OTA update, banyak API native tanpa konfigurasi manual. Keluar dari managed cuma kalau butuh native module custom yang gak bisa ditangani config plugin atau Expo Module.

Yang akan kamu pelajari