메인 콘텐츠로 바로가기
Migration

Migrating from App Center to Capgo

In this guide, we’ll walk through the complete migration for Capgo Live Updates a Microsoft CodePush alternative.

기사 기여자

마틴 도나디우

작성자

발레리아

리뷰어

조던

편집자

Migrating from App Center to Capgo

이동 요약

  • Capgo __CAPGO_KEEP_0__은 개발 팀이 배포된 앱으로 라이브 앱을 전송하는 데 도움을 주는 서비스입니다.
  • Capacitor __CAPGO_KEEP_0__.
  • 콜트 __CAPGO_KEEP_0__
__CAPGO_KEEP_0__

__CAPGO_KEEP_0__ Capacitor Capgo

Built by the Ionic team as a spiritual successor to Cordova, Capacitor allows development to move close to the native tooling and capabilities with the goal of providing an even better user experience and performance.

운이 좋게도, 마이그레이션 프로세스는 쉽고 Cordova 플러그인 대부분은 Capacitor과 호환됩니다. 이동 시작.

Capgo

Capgo, 시간이 지남에 따라 앱을 업데이트하는 것을 처리합니다. 개발 팀은 앱의 고유 기능에만 집중하고 Capgo에 앱 배포 프로세스를 외주할 수 있습니다.

Capgo은 웹 배포와 모바일 배포 사이의 빈틈을 채웁니다.

Capgo Prerequisites

App Center와 마찬가지로 Capgo GitHub은 Azure DevOps, Bitbucket, GitHub, 및 GitLab에 호스팅된 앱을 지원합니다.

Capgo CLI 설치

주의

Node와 NPM이 컴퓨터에 설치되어야 합니다. 다음 단계를 진행하기 전에 항상 현재 LTS 버전 Capgo 이전 버전은 사용하지 마십시오.

만들기 package.json 및 Capacitor 설정 파일

주의

이전 섹션에서 설명한 것과 같이, Capgo로 PR을 제출하기 전에, 새로운 Git branch에서 변경 사항을 적용하는 것을 추천합니다.

그런데 Capgo Capgo는 개발자들이 capacitor 앱을 자동화하기 위해 만들어졌습니다. 그러나 Capgo를 사용하려면, 앱이 가지고 있지 않은 하나의 파일이 필요합니다. 첫 번째 단계는 capacitor 파일을 생성하는 것입니다. capacitor.config.json 파일을 생성하는 가장 쉬운 방법은 앱의 루트 디렉토리에서 다음 명령어를 실행하는 것입니다:

npm install @capacitor/core

그 다음, Capacitor를 CLI 설문조사로 초기화하세요:

npx cap init

The CLI will ask you a few questions, starting with your app name, and the package ID you would like to use for your app.

마지막으로, 프로젝트에 새로운 파일을 커밋하세요:

git add .git commit -m "added package json and capacitor config" && git push

Code을 마이그레이션하세요.

이제 새로운 필수 __CAPGO_KEEP_0__이 준비되었습니다. Capgo 파일을 모두 준비했으면 실제 앱에 집중할 수 있습니다. Capgo __CAPGO_KEEP_0__ dist.

code이 디렉토리 안에 있는지 확인하세요. dist Capacitor이 디렉토리 안에 없다면 Capacitor config 파일에서 이 값을 변경하세요.

앱의 디렉토리 구조는 다음과 같이 되어야 합니다.

앱 구조

Capgo 설정

앱이 준비가 완료되면 Capgo Capgo로 PR을 제출하는 것을 준비하셨다면, 통합이 완료되었습니다. 이제 API에 가입하여 첫 번째 버전을 업로드할 수 있는 API 키를 받으세요. 시작하기 위해 API에 가입하세요. signing up for a Capgo account.

Once you’re logged into Capgo, navigate to the Account page then click on API key, then click on the ‘write’ key to copy it to your clipboard.

Install the Capgo SDK

From a command line, directly into the root of your Capacitor app folder, run the following command:

npm i @capgo/capacitor-updater && npx cap sync Capgo 앱에 다음 코드를 추가하세요. CodePush 대체로 Capacitor를 사용하세요.

And then add to your app this code as replacement of CodePush one:

import { CapacitorUpdater } from '@capgo/capacitor-updater'

CapacitorUpdater.notifyAppReady()

실시간 업데이트 (CodePush 대체)

실시간 업데이트 기능은 설치된 __CAPGO_KEEP_0__를 사용하여 작동합니다.

Deploying Live Updates (CodePush Alternative) Capgo SDK __CAPGO_KEEP_0__ __CAPGO_KEEP_1__

Capgo __CAPGO_KEEP_1__

Cloudflare all Capacitor present in your account to log in with the CLI:

npx @capgo/cli@latest login YOURKEY

Capgo

Let’s get started by first creating the app in Capgo Cloud with the CLI.

npx @capgo/cli@latest app add

This command will use all variables defined in the Capacitor config file to create the app.

SDK

Run the command to build your code and send it to Capgo with:

npx @capgo/cli@latest bundle upload --channel production

npm package.json 파일.

확인하기 Capgo Capgo로 PR을 제출하는 경우

빌드가 존재하는 경우. 내 모바일 샌드박스 앱과 함께 테스트할 수 있습니다..

기본 채널 설정

Capgo로 앱을 전송한 후 채널을 default Capgo에서 앱이 업데이트를 받을 수 있도록 하세요.

npx @capgo/cli@latest channel set production -s default

업데이트를 확인하기 위해 앱을 구성하세요.

main JavaScript 파일에 이 설정을 추가하세요.

import { CapacitorUpdater } from '@capgo/capacitor-updater'

CapacitorUpdater.notifyAppReady()

그런 다음 npm run build && npx cap copy 앱을 업데이트하세요.

장치에서 실시간 업데이트 수신

Deploy에서 실시간 업데이트 수신하려면 앱을 장치 또는 에뮬레이터에서 실행해야 합니다. 이 작업을 수행하는 가장 쉬운 방법은 로컬 앱을 에뮬레이터 또는 컴퓨터에 연결된 장치에서 실행하는 데 사용하는 명령어를 사용하는 것입니다.

npx cap run [ios | android]

앱을 열고 배경으로 보내고 다시 열면 로그에 앱이 업데이트가 된 것을 확인할 수 있습니다.

축하합니다! 🎉 첫 번째 실시간 업데이트 배포를 성공적으로 완료했습니다. 실시간 업데이트와 같은 기능을 사용할 수 있는 것은 이것이 시작입니다. 더 많은 것을 배우려면 완전한 실시간 업데이트 문서.

앱 센터 종속성 제거

Now that we’ve integrated Capgo’s services, you should remove any references to App Center. Besides being a best practice to remove unused code/services, removing the SDK should reduce the size of your apps.

첫 번째로 터미널을 열고 App Center 플러그인을 제거하세요:

    cordova plugin remove cordova-plugin-appcenter-analytics cordova-plugin-appcenter-crashes cordova-plugin-code-push

다음으로 config.xml 를 열고 다음 preference 값을 제거하세요. 이들은 다음과 같은 형태를 띕니다:

    <preference name="APP_SECRET" value="0000-0000-0000-0000-000000000000" /><preference name="CodePushDeploymentKey" value="YOUR-ANDROID-DEPLOYMENT-KEY" /><preference name="CodePushPublicKey" value="YOUR-PUBLIC-KEY" />

App Center 분석을 사용하는 앱이면 다음 항목을 제거하세요. preferences 요소: APPCENTER_ANALYTICS_ENABLE_IN_JS 그리고 APPCENTER_CRASHES_ALWAYS_SEND.

제거하세요. <access /> 요소:

    <access origin="https://codepush.appcenter.ms" /><access origin="https://codepush.blob.core.windows.net" /><access origin="https://codepushupdates.azureedge.net" />

CodePush 참조를 CSP 태그에서 제거하세요. meta 파일 ( index.html 마지막으로, 앱 내에서 App Center 서비스에 대한 __CAPGO_KEEP_0__ 참조를 제거하세요.https://codepush.appcenter.ms):

    <meta http-equiv="Content-Security-Policy" content="default-src https://codepush.appcenter.ms 'self' data: gap: https://ssl.gstatic.com 'unsafe-eval'; style-src 'self' 'unsafe-inline'; media-src *" />

Finally, within your app, remove any code references to App Center services, such as codePush.sync();.

자동 앱 업데이트 전송

You’ve migrated from App Center to Capgo, utilizing the Live Updates. This is just the beginning of what you can use Capgo for. Explore the rest of the service includes Channel (multiple environments) and override. Cloud CLI integration, use Capgo inside your CI/CD platform of choice (such as GitHub Action, GitLab, Jenkins, and more).

자동 앱 업데이트

If your code is hosted on GitHub, you can set up automatic build and release in a few more steps, thanks to GitHub actions.

제가 두 번째 글을 작성하여 여러분이 이 과정을 따라할 수 있도록 하였습니다.

크레딧

__CAPGO_KEEP_3__에게 많은 감사드립니다. Ionic, 이 글은 이 글 Chat-GPT-3와 함께 재작성하고 적응했습니다.

Capgo으로부터 App Center를 마이그레이션하는 방법

만약 여러분이 Capgo으로부터 App Center를 마이그레이션하는 방법 을 사용하여 마이그레이션과 기업 운영을 계획하고 연결하고 싶다면 Capgo 기업 Capgo 기업 Ionic 기업 플러그인 대안 __CAPGO_KEEP_0__ 대안 Capgo 컨설팅 Capgo 컨설팅 Capgo 프리미엄 지원 Capgo 프리미엄 지원 Capgo Premium Support for the product workflow in Capgo Premium Support.

Live updates for Capacitor apps

When a web-layer bug is live, ship the fix through Capgo instead of waiting days for app store approval. Users get the update in the background while native changes stay in the normal review path.

웹-layer 버그가 활성화된 경우, 앱 스토어 승인 대기 없이 __CAPGO_KEEP_0__를 통해 픽스를 배포하세요. 사용자는 배경에서 업데이트를 받으며 네이티브 변경 사항은 일반적인 검토 경로에 남습니다.

context: Capgo marketing website. Role: Supporting description paragraph or meta description. Seen in: component GetStarted.astro. Preserve Capgo product/brand and developer terms exactly. Message key `instant_updates_for_capacitor_apps_description` (Instant Updates For Capacitor Apps Description).

Martin 에서 인간 지원을 받으세요

Capgo gives you the best insights you need to create a truly professional mobile app.