Lompat ke konten utama

Mengatur CI/CD untuk Aplikasi Capacitor

Belajar bagaimana mengalirkan rilis aplikasi Anda untuk iOS dan Android menggunakan alur CI/CD, meningkatkan efisiensi dan mengurangi kesalahan.

Mengatur CI/CD untuk Aplikasi Capacitor

Apakah Anda ingin merilis aplikasi iOS dan Android dengan lebih cepat dan tanpa kesalahan? Alur CI/CD untuk Capacitor Aplikasi otomatis membangun, menguji, dan menginstal, mengurangi waktu rilis hingga 70% dan kesalahan 60%. Panduan ini mencakup segala yang perlu Anda ketahui, dari pengaturan lingkungan hingga mengotomatisasi pembaruan hidup dengan Capgo.

Kunci Pemahaman:

  • Mengapa CI/CD penting untuk Capacitoraplikasi:
  • Mempercepat pembangunan dengan 78% dan mengurangi penolakan toko oleh 60%.: Alat-alat penting, Xcode Studio Android, CocoaPods, dan lain-lain.
  • Pengaturan Pipa: Otomatisasi tugas seperti npx cap sync, caching dependensi, dan pembangunan platform khusus.
  • Update Hidup dengan Capgo: Aktifkan update pasca-rilis dengan peluncuran fase dan perlindungan rollback.

Langkah-Langkah Pengaturan Cepat:

  1. Persiapkan Lingkungan Anda: Pasang alat-alat yang diperlukan untuk iOS dan Android.
  2. Konfigurasi Projek Anda: Update capacitor.config.ts dan mengelola variabel lingkungan dengan aman.
  3. Alur Pembangunan: Otomatisasi instalasi ketergantungan, pembangunan, dan pengujian untuk kedua platform.
  4. Optimalkan Kinerja: Gunakan caching, pembangunan paralel, dan alur kerja kondisional.
  5. Tambahkan Update Langsung: Integrasi Capgo untuk update OTA yang aman dengan peluncuran fase.

Dengan CI/CD, aplikasi Capacitor mencapai rilis yang lebih cepat, lebih halus, sambil mengurangi kesalahan dan intervensi manual. Siap untuk mengoptimalisasikan alur kerja Anda? Mari kita mulai!

Integrasikan Pipa CI/CD Anda yang Sedia Ada dengan Kemampuan Mobile

Persiapan Lingkungan CI/CD

Setelah Anda memiliki dasar-dasar CI/CD, langkah berikutnya adalah mengatur lingkungan. Ini adalah tulang punggung otomatisasi yang dapat diandalkan.

Peralatan dan Pengaturan Perangkat Lunak

Pastikan Anda telah menginstal alat-alat kunci ini:

Untuk Pengembangan iOS:

  • Xcode 14 atau yang lebih baru
  • Xcode Command Line Tools
  • CocoaPods untuk mengelola dependensi

Untuk Pengembangan Android:

  • Android Studio
  • Android SDK 33 atau di atas
  • Java Development Kit (JDK)

Untuk memastikan Xcode Command Line Tools telah terinstal, gunakan:

xcode-select -p

Menyiapkan Capacitor Pengembangan Proyek

Pengembangan Proyek Capacitor Dokumentasi Situs Web

Proyek Anda Capacitor harus dikonfigurasi dengan benar untuk alur kerja CI/CD. capacitor.config.ts File ini berada di pusat pengaturan ini:

const config: CapacitorConfig = {
  appId: 'com.example.app',
  webDir: 'build',
  ios: { 
    scheme: 'MyApp'
  }
}

File ini memastikan proyek Anda sesuai dengan persyaratan CI/CD.

Mengatur Variabel Lingkungan

Mengelola kunci dengan aman adalah bagian penting dari menghubungkan pengaturan lingkungan Anda dengan alur kerja CI/CD.

Variabel Utama untuk Didefinisikan:

  • BUILD_ENV: Menentukan tahap pengiriman (misalnya, production)
  • IOS_SIGNING_IDENTITY: Sertifikat tanda tangan code Anda
  • ANDROID_KEYSTORE_PATH: Jalur ke Android keystore Anda

Untuk pembangunan Android, secara dinamis buatlah file selama proses CI: local.properties Ketika bekerja dengan pembangunan iOS, pastikan platform CI Anda mendukung agent macOS.

echo "sdk.dir=$ANDROID_SDK_ROOT" > android/local.properties

Untuk memeriksa apakah lingkungan Anda sudah siap:

Pengelolaan kunci dan kredit yang tepat dapat menurunkan kemungkinan penolakan aplikasi di toko aplikasi, seperti yang disebutkan dalam statistik sebelumnya

node --version | grep "v16" && xcodebuild -version | grep "Xcode 14" || exit 1

Membuat Pipa CI/CD [1].

Setelah lingkungan Anda siap, langkah berikutnya adalah mengatur pipa CI/CD untuk aplikasi Anda __CAPGO_KEEP_0__

Karena pipa ini harus mengelola baik aset web maupun pembangunan platform native secara efisien. Capacitor appDalam lingkungan CI/CD, pengelolaan dependensi memerlukan kontrol versi yang ketat. Mulai dengan proses instalasi yang bersih:

Untuk pembangunan Android, secara dinamis buatlah file selama proses CI:

Ketika bekerja dengan pembangunan iOS, pastikan platform CI Anda mendukung agent macOS.

npm install --ignore-scripts
npm install @capacitor/cli

To mempercepat proses build, gunakan caching dependensi. Misalnya, Azure DevOps pengguna telah melihat waktu build mereka meningkat 40-60% dengan setup ini:

- task: Cache@2
  inputs:
    key: 'npm | "$(Agent.OS)" | package-lock.json'
    path: |
      node_modules
      android/.gradle
      ios/Pods

Pengaturan Build iOS dan Android

Berikut cara mengonfigurasi build untuk kedua platform:

Pengaturan Konfigurasi Build iOS:

steps:
  - task: InstallAppleCertificate@2
    inputs:
      certSecureFile: 'certificate.p12'
      certPwd: $(P12_PASSWORD)
  - script: |
      xcodebuild -workspace ios/App/App.xcworkspace -scheme App -configuration Release -archivePath ios/App/App.xcarchive archive

Pengaturan Konfigurasi Build Android:

cd android
./gradlew bundleRelease

Langkah-Langkah Pengujian dan Pengiriman

Jalankan pengujian platform secara paralel menggunakan strategi matrix:

test:
  steps:
    - run: npm run test:unit
    - run: npm run test:e2e
    - name: Run Platform Tests
      matrix:
        platform: [ios, android]
      run: npm run test:${{ matrix.platform }}

Untuk pengiriman, atur penanganan artifact spesifik platform:

Platform Jenis Artifact Distribusi Channel
IOS .ipa App Store Connect
Andoid .aab Google Play Console

Menggunakan pembangunan parallel dapat mengurangi waktu eksekusi pipeline secara signifikan ketika dikonfigurasi dengan benar.

Setelah pembangunan Anda diverifikasi dan dikemas, Anda siap untuk melanjutkan ke pembaruan hidup dengan Capgo (dibahas dalam bagian berikutnya).

sbb-itb-f9944d2

Menambahkan Capgo untuk Update Hidup

Capgo Dashboard Interface Update Hidup

Mengintegrasikan Capgo ke dalam alur kerja Anda meningkatkan proses CI/CD dengan memungkinkan update setelah rilis. Berikut cara mengaturnya:

Konfigurasi Capgo Pipeline

Pertama, instal Capgo CLI dalam lingkungan pipeline Anda:

steps:
  - name: Install Capgo CLI
    run: npm install -g @capgo/cli
  - name: Configure Authentication
    env:
      CAPGO_KEY: ${{ secrets.CAPGO_API_KEY }}

Penambahan ini memperluas siklus CI/CD Anda dengan mengintegrasikan manajemen update ke dalam proses pembangunan dan pengiriman otomatis. Selanjutnya, termasuk perintah unggah setelah langkah-langkah pembangunan: Untuk

__CAPGO_KEEP_0__ dapat berarti __CAPGO_KEEP_0__ atau __CAPGO_KEEP_0__

- name: Upload Update
  run: |
    capgo upload --api-key $CAPGO_KEY --bundle ./build/app-release.apk
    capgo deploy v${VERSION} --channel production

__CAPGO_KEEP_1__ dapat berarti __CAPGO_KEEP_1__ atau __CAPGO_KEEP_1__ Perbarui yang aman, atur pengaturan validasi seperti ini:

{
  "verification": {
    "checksum": "strict",
    "certificatePinning": true,
    "updateTimeout": 500
  }
}

Capgo Features Overview

Fitur Deskripsi
Enkripsi Akhir ke Akhir Signifikan mengurangi kesalahan penginstalan.
Penyebaran Berdasarkan Saluran Mengatur perbarui untuk lingkungan tertentu.
Penyebaran Berperingkat Menjamin perbarui didistribusikan secara bertahap.

Panduan Perbarui OTA

Perbaiki proses pengujian Anda dengan mengikuti metrik-metrik kunci ini setelah pengembangan:

Strategi Pengembangan Berfase

Gunakan peluncuran berfase untuk mengontrol bagaimana pembaruan-pembaruan tersebut didistribusikan:

- name: Staged Rollout
  run: |
    capgo deploy v1.2.3 --group "beta-users" --rollout 10%
    capgo deploy v1.2.3 --rollout 50%

Pengawasan Pembaruan

Tetapkan mata Anda pada metrik-metrik ini:

  • Angka penyerapan: Tujuan untuk mencapai 40-60% dalam waktu 24 jam pertama.
  • Sesi tanpa kegagalan: Jaga di atas 99,5%.
  • Waktu verifikasi: Pastikan tidak lebih dari 500ms.

Jika kegagalan melebihi tingkat yang dapat diterima, otomatis alihkan ke versi sebelumnya:

- name: Rollback Check
  run: |
    if [ $(capgo stats --version v1.2.3 --metric crashes) -gt 2 ]; then
      capgo rollback --channel production
    fi

Optimasi Kinerja Pipa Data

Mengoptimalkan kinerja pipa data dapat dilakukan dengan fokus pada tiga area utama:

Optimasi Kecepatan Pembangunan

Untuk perubahan web saja, menggunakan npx cap sync dapat menghemat waktu dengan melompatkan pembangunan native penuh, mengurangi waktu pembangunan sekitar 40%. Berikut cara Anda dapat menerapkan pembangunan kondisional:

- name: Build Strategy
  run: |
    [ "$WEB_ONLY" = true ] && npx cap sync || (./gradlew assembleRelease && xcodebuild ...)

Metode ini memastikan bahwa hanya komponen yang diperlukan saja yang dibangun kembali, sehingga mempercepat proses.

Automasi Kontrol Versi

Automasi kontrol versi dapat memudahkan alur kerja Anda. Gunakan skrip berikut untuk menetapkan versi dan nomor pembangunan secara dinamis:

- name: Set Version
  run: |
    VERSION=$(node -p "require('./package.json').version")
    BUILD_NUMBER=$GITHUB_RUN_NUMBER
    echo "APP_VERSION=${VERSION}" >> $GITHUB_ENV
    echo "BUILD_ID=${BUILD_NUMBER}" >> $GITHUB_ENV

Selain itu, versi semantik otomatis dapat diatur dengan konfigurasi ini:

{
  "scripts": {
    "version": "standard-version",
    "build:prod": "npm version patch && ionic build --prod"
  }
}

Praktik-praktik ini memberikan kerangka yang kuat untuk mengikuti dan meningkatkan kinerja pipa data melalui metrik seperti:

  • Waktu pembangunan per tahap
  • Effisiensi cache (rasio hit/miss)
  • Kebijakan Sumber Daya Puncak

Pengaturan Multi Lingkungan

Pengaturan Lingkungan Banyak dapat Dipercepat dengan Menggunakan Konfigurasi Lingkungan yang Spesifik. Berikut Contoh Pengaturan:

Lingkungan File Konfigurasi
Pengembangan .env.dev
Pengujian .env.staging
Produksi Gudang yang Aman

Anda dapat Mengonfigurasi Lingkungan Secara Dinamis dengan Skrip ini:

- name: Configure Environment
  env:
    API_KEY: ${{ secrets.ENV_SPECIFIC_API_KEY }}
    BUNDLE_ID: ${{ parameters.bundleId }}
  run: |
    echo "ENVIRONMENT=${{ parameters.environment }}" >> $GITHUB_ENV
    echo "API_ENDPOINT=${{ parameters.apiUrl }}" >> $GITHUB_ENV

Menggabungkan Konfigurasi ini dengan Capgo’s Channel Berbasis Pengiriman memungkinkan Update yang Tepat, Spesifik Lingkungan. Ini Menyebabkan Rollout yang Lebih Lancar dan Kontrol yang Lebih Baik atas perilaku Aplikasi di Lingkungan yang Berbeda.

Ringkasan

Peran CI/CD dalam Pengembangan

Menggunakan alur CI/CD untuk aplikasi Capacitor secara signifikan meningkatkan efisiensi alur kerja. Menurut data industri, tim dapat mencapai 50-70% siklus rilis yang lebih cepat terima kasih pada bangun iOS dan Android yang bersamaan [3]. Tugas otomatis seperti instalasi dependensi dan sinkronisasi platform mengurangi kesalahan penginstalan dengan 40-60% [1][2].

Misalnya, tim yang menggunakan Azure DevOps pipelines telah mengotomatisasi proses seperti langkah-langkah build berurutan dan pengemasan Xcode. Mereka juga menggunakan lingkungan parameterisasi untuk pengembangan dan produksi. Pendekatan ini menghilangkan kebutuhan untuk operasi manual Gradle dan Xcode CLI , sehingga menciptakan artefak yang dapat diandalkan setiap kali.

Perubahan-perubahan ini menjadi dasar untuk pengelolaan update yang terstruktur ketika digabungkan dengan Capgo.

Capgo untuk Pengelolaan Update

Capgo bekerja secara bersamaan dengan alur CI/CD untuk menyampaikan update instan sambil tetap memenuhi kebijakan toko aplikasi. Update hanya diinstal setelah melewati tes otomatis yang dibangun ke dalam alur.

Dengan menggabungkan bangun otomatis dengan peluncuran fase, tim mencapai hasil yang impresif: 80% penutupan pengguna dalam 7 hari dan kemampuan rollback dalam kurang dari satu jam.

A strategi yang umum melibatkan menjalankan jalur deploymen parallel. Pembangunan otomatis digunakan untuk tes internal, sementara peluncuran fase menargetkan segmen pengguna. Hal ini memastikan pembaruan yang cepat dan aman, didukung oleh pengujian otomatis yang ketat [1].

FAQs

Bagaimana cara membuat aplikasi Capacitor?

Membangun aplikasi Capacitor melibatkan beberapa langkah yang sederhana:

  1. Set up lingkungan: Pasang Node.js dan npm pada sistem Anda. Kemudian, gunakan Ionic CLI untuk memulai proyek baru dengan dukungan Capacitor:

    ionic start myApp tabs --capacitor
  2. Tambahkan dukungan platform: Tambahkan platform yang ingin Anda target, seperti iOS atau Android:

    npx cap add ios
    npx cap add android
  3. Sinkronkan web code: Pastikan web code Anda sejalan dengan platform native dengan menjalankan:

    npx cap sync

Langkah sinkronisasi ini sangat penting untuk menjaga aplikasi konsisten di semua platform dan memastikan operasi yang lancar di pipa CI/CD. Untuk informasi lebih lanjut tentang mengatur lingkungan, cek bagian Tools.

Teruskan dari Setting Up CI/CD untuk Aplikasi Capacitor

Jika Anda menggunakan Mengatur Up CI/CD untuk Aplikasi Capacitor untuk merencanakan otomatisasi CI/CD, hubungkannya dengan Capgo CI/CD untuk alur kerja produk di Capgo CI/CD, Capgo Pembangunan Natively untuk alur kerja produk di Capgo Pembangunan Natively, Capgo Integrasi untuk alur kerja produk di Capgo Integrasi, Pengintegrasian CI/CD untuk detail implementasi di Pengintegrasian CI/CD, dan GitHub Pengintegrasian Aksi Untuk detail implementasi di GitHub Integrasi Aksi.

Update Langsung untuk Aplikasi Capacitor

Jika ada bug layer web yang hidup, kirimkan perbaikan melalui Capgo bukan menunggu hari-hari untuk persetujuan toko aplikasi. Pengguna mendapatkan update di latar belakang sementara perubahan native tetap dalam jalur review normal.

Dukungan Manusia dari Martin

Mulai Sekarang

Terbaru dari Blog Kami

Capgo memberikan Anda wawasan terbaik yang Anda butuhkan untuk membuat aplikasi mobile yang profesional.