Migrer du Centre d'applications vers Capgo

Résumé de la migration

Capgo est un service qui aide les équipes de développement à envoyer des applications live vers des applications déployées.
Les applications Capacitor JS écrites en jQuery Mobile, Framework 7, Sencha, KendoUI, Ionic ou même votre propre solution personnalisée peuvent être migrées. Une application Ionic existante n'est pas requise..
Colt propose des services équivalents pour App Center Build (construction d'applications Android/iOS). Pour les services Test, Diagnostics et Analytics.

Remarque

If votre application utilise toujours Cordova, il est nécessaire de la migrer vers Capacitor avant de la migrer vers Capgo.

Construit par l'équipe Ionic en tant que successeur spirituel de Cordova, Capacitor permet le développement de se rapprocher des outils et des capacités natives avec l'objectif de fournir une expérience utilisateur encore meilleure et une performance.

Heureusement, le processus de migration est facile et la plupart des plugins Cordova sont compatibles avec Capacitor. Commencez à migrer ici.

À propos de Capgo

Capgo gère l'actualisation des applications au fil du temps. Les équipes de développement peuvent se concentrer complètement sur les fonctionnalités uniques de leur application et externaliser le processus compliqué de livraison d'application à Capgo.

Capgo remplit les lacunes entre la livraison web et mobile.

Prérequis de Capgo

Comme App Center, Capgo supporte les applications hébergées dans les dépôts Git sur Azure DevOps, Bitbucket, GitHub, et GitLab.

Installez Capgo CLI

note

Vous devez avoir Node et NPM installés sur votre ordinateur avant de poursuivre. Utilisez toujours la version LTS actuelle. __CAPGO_KEEP_0__ n'utilisez pas les versions plus anciennes. Capgo do not older versions.

et les fichiers de configuration __CAPGO_KEEP_0__ `package.json` and Capacitor config files

Avant de commencer, je vous recommande de faire des modifications sur une branche Git fraîche.

Puisque

__CAPGO_KEEP_0__ Capgo est créé pour automatiser les applications capacitor, il nécessite un fichier que votre application peut ne pas avoir. Tout d'abord, créez un capacitor.config.json Le moyen le plus facile de le créer est de l'exécuter dans le répertoire racine de votre application :

npm install @capacitor/core

Ensuite, initialisez Capacitor à l'aide du questionnaire CLI :

npx cap init

Le CLI vous posera quelques questions, en commençant par le nom de votre application, et l'ID de package que vous souhaitez utiliser pour votre application.

Enfin, commitez les nouveaux fichiers à votre projet :

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

Migrer le Code

Maintenant que vous avez les nouveaux fichiers requis Capgo en place, vous pouvez vous concentrer sur l'application elle-même. Capgo attend que l'application entièrement construite soit à l'intérieur d'un répertoire nommé dist.

Si votre code construit n'est pas dans un dist Répertoire, modifiez cette valeur dans le fichier de configuration Capacitor.

Voici ce que la structure du répertoire de l'application devrait ressembler à :

Structure de l'Application

Configuration de Capgo

Une fois votre application prête pour Capgo l'intégration, il est temps de vous inscrire et d'obtenir votre clé API pour télécharger votre première version ! Commencez par s'inscrire à un compte Capgo.

Une fois que vous êtes connecté à Capgo, naviguez vers la page Compte puis cliquez sur API clé, puis cliquez sur la touche ‘écrire’ pour copier la clé dans votre presse-papier.

Installer le Capgo SDK

À partir d'une ligne de commande, directement dans le répertoire root de votre application Capacitor, exécutez la commande suivante :

npm i @capgo/capacitor-updater && npx cap sync Pour installer le plugin dans votre application Capacitor.

And puis ajoutez à votre application ce code en remplacement de CodePush :

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

CapacitorUpdater.notifyAppReady()

Cela indiquera au plugin natif que l'installation a réussi.

Déploiement des Mises à Jour en Ligne (Alternative à CodePush)

La fonctionnalité de mise à jour en temps réel fonctionne en utilisant l'installation de Capgo SDK à votre application native pour écouter un canal de déploiement particulier. Lorsqu'une build Web est affectée à un canal de déploiement, cette mise à jour sera déployée sur les appareils utilisateurs exécutant des binaires configurés pour écouter le canal de déploiement spécifié.

Tout d'abord, utilisez l' all clé d'API présente dans votre compte pour vous connecter avec le CLI :

npx @capgo/cli@latest login YOURKEY

Ajoutez votre première application

Commençons par créer l'application dans Capgo Cloud avec l'CLI.

npx @capgo/cli@latest app add

Cette commande utilisera toutes les variables définies dans le fichier de configuration Capacitor pour créer l'application.

Téléchargez votre premier bundle

Exécutez la commande pour construire votre code et l'envoyer à Capgo avec :

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

Par défaut, le nom de version sera celui de votre package.json fichier.

Vérifiez dans Capgo si la construction est présente.

Vous pouvez même le tester avec mon application sandbox mobile.

Définir le canal par défaut

Après avoir envoyé votre application à Capgo, vous devez faire votre canal default To permettre aux applications de recevoir des mises à jour de Capgo.

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

Configurer l'application pour valider les mises à jour

Ajoutez cette configuration à votre fichier JavaScript principal.

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

CapacitorUpdater.notifyAppReady()

Puis faites un npm run build && npx cap copy Pour mettre à jour votre application.

Recevoir une mise à jour en direct sur un appareil

Pour que votre application reçoive une mise à jour en direct depuis Deploy, vous devrez exécuter l'application sur un appareil ou un émulateur. La façon la plus simple de procéder est simplement d'utiliser la commande suivante pour lancer votre application locale sur un émulateur ou un appareil connecté à votre ordinateur.

npx cap run [ios | android]

Ouvrez l'application, mettez-la en arrière-plan et ouvrez-la à nouveau, vous devriez voir dans les journaux que l'application a effectué la mise à jour.

Félicitations ! 🎉 Vous avez réussi à déployer votre première mise à jour en direct. C'est juste le début de ce que vous pouvez faire avec les mises à jour en direct. Pour en savoir plus, consultez le document complet sur les Mises à jour en direct.

Supprimer les dépendances d'App Center

Maintenant que nous avons intégré les services de Capgo, vous devriez supprimer toute référence à App Center. En plus d'être une bonne pratique de supprimer les services inutilisés code, supprimer les SDK devrait réduire la taille de vos applications.

Ouvrez d'abord une invite de commandes puis désinstallez les plugins du Centre d'application :

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

Ensuite, ouvrez config.xml et supprimez les valeurs suivantes. Elles ressembleront à : preference Si vous utilisiez les services d'Analytics du Centre d'application dans votre application, supprimez les éléments suivants :

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

et preferences Supprimez les éléments suivants : APPCENTER_ANALYTICS_ENABLE_IN_JS et APPCENTER_CRASHES_ALWAYS_SEND.

Supprimez les éléments suivants : <access /> Supprimez la référence à CodePush dans la balise CSP

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

tag dans le meta fichier ( index.html file (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 *" />

Enfin, dans votre application, supprimez toute référence à code aux services de App Center, comme codePush.sync();.

Étapes suivantes

Vous avez migré de App Center vers Capgo, en utilisant les mises à jour en direct. C'est juste le début de ce que vous pouvez utiliser Capgo pour. Explorez le reste des fonctionnalités de la plateforme, notamment le canal (environnements multiples) et la prise en charge. L'intégration Cloud CLI est disponible, utilisez Capgo dans votre plateforme CI/CD de choix (comme GitHub Action, GitLab, Jenkins, etc.).

Envoyer automatiquement une mise à jour d'application

Si votre code est hébergé sur GitHub, vous pouvez configurer la mise à jour automatique et la livraison en quelques étapes supplémentaires, grâce aux actions de GitHub.

J'ai écrit un deuxième article pour vous permettre de le faire.

Crédits

Je vous remercie beaucoup à Ionic, cet article repose sur cet article a été réécrit avec chat-gpt-3 et adapté.

Continuez de Migrer depuis App Center vers Capgo

Si vous utilisez Migrer depuis App Center vers Capgo pour planifier la migration et les opérations d'entreprise, connectez-le avec Capgo Entreprise pour le flux de travail du produit dans Capgo Entreprise, Alternatives de Plugin d'Entreprise Ionic pour le flux de travail du produit dans Alternatives de Plugin d'Entreprise Ionic, Capgo Alternatives pour le flux de travail du produit dans Capgo Alternatives, Capgo Consulting pour le flux de travail du produit dans Capgo Consulting, et Capgo Support Premium pour le flux de travail du produit dans Capgo Support Premium.

Migrer depuis App Center vers Capgo