Capgo-Startseite
Migrieren

Vom App Center zu Capgo

In diesem Leitfaden gehen wir auf die vollständige Migration von Capgo Live Updates ein, einem Microsoft CodePush-Ersatz.

Martin Donadieu

Martin Donadieu

Inhaltsmarketer

Vom App Center zu Capgo

Migrationsübersicht

  • Capgo ein Dienst, der Entwicklerteams hilft, live-Apps an deployte Apps zu senden.
  • Capacitor Ein bestehendes Ionic-App ist nicht erforderlich..
  • Colt bietet äquivalente Dienste für App Center Build (Erstellung von Android- und iOS-Anwendungen). Für Test-, Diagnose- und Analyse-Dienste.
Hinweis

Wenn Ihr App noch Cordova verwendet, ist es notwendig, zuerst auf __CAPGO_KEEP_0__ zu migrieren, bevor Sie auf __CAPGO_KEEP_1__ migrieren. Capacitor wurde vom Ionic-Team als spiritueller Nachfolger von Cordova entwickelt, um die Entwicklung nahe an die nativen Werkzeuge und -funktionen zu bringen, mit dem Ziel, einen noch besseren Benutzererlebnis und -leistung zu bieten. Glücklicherweise ist der Migrationsprozess einfach und die meisten Cordova-Plugins sind mit Capgo backwards kompatibel.

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.

Über Capacitor __CAPGO_KEEP_0__ übernimmt die Aktualisierung von Apps im Laufe der Zeit. Entwicklungsteams können sich voll und ganz auf die einzigartigen Funktionen ihrer App konzentrieren und den komplexen App-Delivery-Prozess an __CAPGO_KEEP_1__ auslagern..

Capgo ist ein Nachfolger von Cordova.

Capgo, handles updating apps over time. Development teams can focus completely on the unique features of their app and outsource the complicated app delivery process to Capgo.

Capgo füllt die Lücken zwischen Web-Delivery und Mobilanwendungen.

Capgo Voraussetzungen

Wie App Center Capgo GitHub unterstützt Apps, die in Git-Repositorys auf Azure DevOps, Bitbucket, GitHub, und GitLab gehostet werden.

Installieren Sie Capgo CLI

Hinweis

Stellen Sie sicher, dass Sie Node und NPM auf Ihrem Computer installiert haben, bevor Sie fortfahren. Verwenden Sie immer die aktuelle LTS-Version. __CAPGO_KEEP_0__ verwenden Sie keine älteren Versionen. Capgo do not older versions.

und __CAPGO_KEEP_0__ Konfigurationsdateien package.json and Capacitor config files

Hinweis

Bevor Sie beginnen, empfehle ich Ihnen, Änderungen auf einer frischen Git-Branche vorzunehmen.

Da Capgo Da capacitor zur Automatisierung von capacitor-Anwendungen erstellt wurde, benötigt es eine Datei, die Ihre App möglicherweise nicht hat. Erstellt zunächst eine capacitor.config.json Datei. Der einfachste Weg, sie zu erstellen, besteht darin, in der Wurzel Ihres Projekts zu führen:

npm install @capacitor/core

Initialisiert Capacitor dann mit der CLI-Fragebogen:

npx cap init

Der CLI wird Ihnen einige Fragen stellen, beginnend mit dem Namen Ihrer App und der Paket-ID, die Sie für Ihre App verwenden möchten.

Schließlich müssen Sie die neuen Dateien in Ihrem Projekt committen:

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

Migriere Code

Jetzt, da Sie die neuen erforderlichen Capgo Dateien sind im Ort, Sie können unsere Aufmerksamkeit auf das eigentliche App selbst richten. Capgo erwartet, dass die gesamte gebaute App in einem Verzeichnis mit dem Namen dist.

Wenn Ihre gebaute code nicht in einem dist Verzeichnis liegt, ändern Sie diesen Wert im Capacitor-Konfigurationsdatei.

Hier ist, wie die App-Verzeichnisstruktur aussehen sollte:

App-Struktur

Capgo-Konfiguration

Mit Ihrer App bereit für Capgo Integration, ist es Zeit, sich anzumelden und Ihre API-Schlüssel, um Ihre erste Version hochzuladen! Beginnen Sie damit, sich für ein API-Konto anzumelden. Capgo.

Einmal angemeldet bei Capgo, navigieren Sie zur Konto-Seite und klicken Sie auf die API Taste, dann klicken Sie auf die 'Schreibe'-Taste, um es in Ihre Zwischenablage zu kopieren.

Installieren Sie das Capgo SDK

Von einer Befehlszeile aus, direkt in den Root Ihres Capacitor-App-Ordners, führen Sie den folgenden Befehl aus:

npm i @capgo/capacitor-updater && npx cap sync Um das Plugin in Ihr Capacitor-App zu installieren.

Und fügen Sie dann Ihrem App diesen code als Ersatz für CodePush ein:

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

CapacitorUpdater.notifyAppReady()

Dies wird dem native Plugin mitteilen, dass die Installation erfolgreich war.

Live-Updates (Alternative zu CodePush)

Die Live-Update-Funktion funktioniert, indem sie das installierte __CAPGO_KEEP_0__ __CAPGO_KEEP_1__ Capgo SDK Anmelden bei __CAPGO_KEEP_0__ CLOUD

Login to Capgo CLOUD

__CAPGO_KEEP_0__ ist ein __CAPGO_KEEP_1__ all apikey vorhanden in Ihrem Konto, um mit dem CLI einzuloggen:

npx @capgo/cli@latest login YOURKEY

Hinzufügen Ihres ersten Apps

Beginnen wir mit der Erstellung der App in Capgo Cloud mit der CLI.

npx @capgo/cli@latest app add

Diese Anweisung wird alle in der Capacitor Konfigurationsdatei definierten Variablen verwenden, um die App zu erstellen.

Hochladen Ihres ersten Bundles

Laufen Sie die Anweisung aus, um Ihre code zu bauen und es an Capgo zu senden mit:

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

Standardmäßig wird der Versionsname der in Ihrem package.json Datei sein.

Überprüfen Sie in Capgo sofern das Build vorhanden ist.

Sie können es sogar mit meinem mobilen Sandbox-App.

Machen Sie den Kanal standardmäßig

Nachdem Sie Ihre App an Capgo gesendet haben, müssen Sie Ihren Kanal so einrichten, dass Apps Updates von Capgo erhalten können. default to let apps receive updates from Capgo.

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

Fügen Sie diese Konfiguration in Ihr Haupt-JavaScript-File hinzu.

Führen Sie dann ein

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

CapacitorUpdater.notifyAppReady()

durch, um Ihre App zu aktualisieren. npm run build && npx cap copy Empfangen Sie ein Live-Update auf einem Gerät

Damit Ihre Anwendung ein Live-Update von Deploy empfängt, müssen Sie die App auf einem Gerät oder einem Emulator ausführen. Der einfachste Weg, dies zu tun, besteht darin, einfach die folgende Kommandozeilenanweisung auszuführen, um Ihre lokale App in einem Emulator oder einem mit Ihrem Computer verbundenen Gerät zu starten.

Öffnen Sie die App, stellen Sie sie in den Hintergrund und öffnen Sie sie erneut, Sie sollten im Protokoll sehen, dass die App den Update durchgeführt hat.

npx cap run [ios | android]

Open the app, put it in the background and open it again, you should see in the logs the app did the update.

Herzlichen Glückwunsch! 🎉 Sie haben Ihr erstes Live-Update erfolgreich implementiert. Dies ist nur der Anfang dessen, was Sie mit Live-Updates erreichen können. Um mehr zu erfahren, besuchen Sie die vollständige Live-Updates-Dokumentation.

App Center-Abhängigkeiten entfernen

Nachdem wir nun Capgo's Dienste integriert haben, sollten Sie alle Verweise auf App Center entfernen. Neben der Tatsache, dass es sich um eine gute Praxis handelt, unnötige code/Dienste zu entfernen, sollte die Entfernung von SDK auch die Größe Ihrer Apps reduzieren.

Zuerst öffnen Sie ein Terminal und deinstallieren Sie die App Center-Plugins:

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

Öffnen Sie dann config.xml und entfernen Sie die folgenden preference Werte. Sie werden ähnlich aussehen wie:

    <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" />

Wenn Sie in Ihrer App App Center Analytics verwendet haben, entfernen Sie die folgenden preferences Elemente: APPCENTER_ANALYTICS_ENABLE_IN_JS und APPCENTER_CRASHES_ALWAYS_SEND.

Entfernen Sie die folgenden <access /> Elemente:

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

Entfernen Sie die Referenz auf CodePush in der CSP-Tag in dem meta Datei ( index.html Schließlich entfernen Sie innerhalb Ihrer App alle __CAPGO_KEEP_0__-Verweise auf App Center-Dienste, wie z.B. 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();.

Sie haben sich von App Center auf __CAPGO_KEEP_0__ migriert und nutzen die Live-Updates. Dies ist nur der Anfang dessen, was Sie mit __CAPGO_KEEP_1__ tun können. Entdecken Sie die restlichen Dienste, einschließlich Kanal (Mehrere Umgebungen) und Überschreiben. Cloud __CAPGO_KEEP_2__-Integration, verwenden Sie __CAPGO_KEEP_3__ innerhalb Ihres CI/CD-Plattformen Ihrer Wahl (z.B. __CAPGO_KEEP_4__-Action, GitLab, Jenkins und mehr).

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).

Wenn Ihre __CAPGO_KEEP_0__ auf __CAPGO_KEEP_1__ gehostet ist, können Sie die automatische Build- und Release-Konfiguration in wenigen Schritten durchführen, dank __CAPGO_KEEP_2__-Aktionen.

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

Kredits

Vielen Dank an

Cloudflare, Capacitor, GitHub, Capgo, code, API, SDK, CLI, npm, bun Ionisch, dieses Artikel basiert auf dieser Artikel erstellt mit chat-gpt-3 und angepasst.

Fortsetzen Sie mit Migrating from App Center zu Capgo

Wenn Sie App Center verwenden Migrating from App Center zu Capgo um die Migration und die Unternehmensoperationen zu planen und zu verbinden, verbinden Sie es mit Capgo Enterprise zur Produktworkflow in Capgo Enterprise Ionisch Enterprise Plugin Alternativen zur Produktworkflow in Ionisch Enterprise Plugin Alternativen Capgo Alternatives for the product workflow in Capgo Alternatives, Capgo Consulting for the product workflow in Capgo Consulting, and Capgo Premium Support for the product workflow in Capgo Premium Support.

Live-Updates für Capacitor-Apps

Wenn ein Web-Schicht-Bug live ist, versenden Sie die Reparatur über Capgo anstatt Tage auf App-Store-Bewilligung zu warten. Die Benutzer erhalten das Update im Hintergrund, während native Änderungen im normalen Review-Verfahren bleiben.

Unterstützung durch Martin

Loslegen

Neueste aus unserem Blog

Capgo bietet Ihnen die besten Einblicke, die Sie benötigen, um eine wirklich professionelle mobile App zu erstellen.