Résumé de la migration
- Capgo est un service qui aide les équipes de développement à envoyer des Live Update aux applications déployées.
- Vous pouvez migrer les applications JS Capacitor écrites en jQuery Mobile, Framework 7, Sencha, KendoUI, Ionic ou même votre propre solution personnalisée. Aucune application Ionic existante n'est requise..
- Colt offre des services équivalents à App Center Build (pour compiler des apps Android/iOS). Pour les services de Test, Diagnostics et Analytics.
Remarque
Si votre application utilise encore Cordova, il est nécessaire de migrer vers Capacitor au préalable, avant de migrer vers Capgo.
Développé par l'équipe Ionic comme successeur spirituel de Cordova, Capacitor permet de rapprocher le développement des outils et capacités natifs, avec l'objectif d'offrir une expérience utilisateur et des performances encore meilleures.
Heureusement, le processus de migration est simple et la majorité des plugins Cordova sont rétrocompatibles avec Capacitor. Commencer la migration ici.
À propos de Capgo
Capgo gère les mises à jour de vos apps au fil du temps. Les équipes de dev peuvent se concentrer pleinement sur les fonctionnalités uniques de leur app et déléguer le processus complexe de livraison à Capgo.
Capgo comble le fossé entre le web et le mobile.
Prérequis Capgo
Comme App Center, Capgo prend en charge les apps hébergées sur des dépôts Git via Azure DevOps, Bitbucket, GitHub et GitLab.
Installer Capgo CLI
note
Node et NPM doivent être installés sur votre ordinateur avant de commencer. Utilisez toujours la version LTS actuelle Capgo ne supporte pas les versions plus anciennes.
Créer package.json et les fichiers de config Capacitor
note
Avant de commencer, je vous recommande d'effectuer les modifications sur une nouvelle branche Git.
Depuis Capgo a été créé pour automatiser les apps capacitor, il nécessite un fichier que votre app n'a peut-être pas. Commencez par créer un capacitor.config.json fichier. Le moyen le plus simple de le créer est de l'exécuter à la racine de votre app :
npm install @capacitor/coreEnsuite, initialisez Capacitor en utilisant le questionnaire CLI :
npx cap initCLI vous posera quelques questions, en commençant par le nom de votre app et l'ID de package que vous souhaitez utiliser.
Enfin, commitez les nouveaux fichiers dans votre projet :
git add .git commit -m "added package json and capacitor config" && git pushMigrate the Code
Maintenant que vous avez le nouveau Capgo les fichiers en place, vous pouvez maintenant vous concentrer sur l'application elle-même. Capgo attend que l'intégralité de l'application compilée se trouve dans un répertoire nommé dist.
Si votre build code n'est pas dans un dist répertoire, modifiez cette valeur dans le fichier de config Capacitor.
Voici à quoi devrait ressembler la structure du répertoire de l'application :
Configuration Capgo
Votre application étant prête pour l' Capgo intégration, il est temps de vous inscrire et de récupérer votre clé API pour envoyer votre première version ! Commencez par créer un compte Capgo.
Une fois connecté à Capgo, allez sur la page Account, cliquez sur la clé API, puis cliquez sur la clé « write » pour la copier dans votre presse-papiers.
Installer le Capgo SDK
Depuis un terminal, directement à la racine du dossier 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.
Ajoutez ensuite ce code à votre application pour remplacer CodePush :
import { CapacitorUpdater } from '@capgo/capacitor-updater'
CapacitorUpdater.notifyAppReady()Cela indiquera au plugin natif que l'installation a réussi.
Déployer des Live Updates (alternative à CodePush)
La fonctionnalité Live Update fonctionne en utilisant le Capgo SDK installé dans votre application native pour écouter une destination de canal de déploiement spécifique. Lorsqu'un build Web est assigné à une destination de canal, cette mise à jour sera déployée sur les appareils des utilisateurs exécutant des binaires configurés pour écouter cette destination de canal.
Connectez-vous à Capgo Cloud
Tout d'abord, utilisez la all clé API présente dans votre compte pour vous connecter avec le CLI :
npx @capgo/cli@latest login YOURKEYAjouter votre première app
Commençons par créer l'application dans le cloud Capgo avec CLI.
npx @capgo/cli@latest app add
Cette commande utilisera toutes les variables définies dans le fichier de config Capacitor pour créer l'app.
Envoyez votre premier bundle
Lancez la commande pour compiler votre code et l'envoyer sur Capgo avec :
npx @capgo/cli@latest bundle upload --channel productionPar défaut, le nom de la version sera celui de votre package.json fichier.
Vérifiez dans Capgo si le build est présent.
Vous pouvez même le tester avec mon app mobile sandbox.
Définir le canal par défaut
Une fois que vous avez envoyé votre application à Capgo, vous devez définir votre canal default to let apps receive updates from Capgo.
npx @capgo/cli@latest channel set production -s defaultConfigurer l'app pour valider les mises à jour
Ajoutez cette config à votre fichier JavaScript principal.
import { CapacitorUpdater } from '@capgo/capacitor-updater'
CapacitorUpdater.notifyAppReady()Then do a npm run build && npx cap copy pour mettre à jour votre application.
Recevoir un Live Update sur un appareil
Pour que votre application reçoive un live update depuis Deploy, vous devrez lancer l'app sur un appareil ou un émulateur. Le plus simple est d'utiliser la commande suivante pour lancer votre app en local sur un émulateur ou un appareil connecté à votre ordinateur.
npx cap run [ios | android]Ouvrez l'app, passez-l’en arrière-plan puis rouvrez-la ; vous devriez voir dans les logs que l'app a effectué la mise à jour.
Félicitations ! 🎉 Vous avez déployé avec succès votre premier Live Update. Ce n'est que le début de ce que vous pouvez accomplir avec les Live Updates. Pour en savoir plus, consultez la documentation complète sur les Live Updates.
Supprimer les dépendances 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 retirer les code/services inutilisés, la suppression de SDK devrait réduire la taille de vos apps.
Tout d'abord, ouvrez un terminal puis désinstallez les plugins App Center :
cordova plugin remove cordova-plugin-appcenter-analytics cordova-plugin-appcenter-crashes cordova-plugin-code-pushEnsuite, ouvrez config.xml et supprimez les éléments suivants preference valeurs suivantes. Elles ressembleront à ceci :
<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" />Si vous utilisiez App Center Analytics dans votre app, supprimez les preferences elements: APPCENTER_ANALYTICS_ENABLE_IN_JS et APPCENTER_CRASHES_ALWAYS_SEND.
Supprimer les éléments suivants <access /> éléments :
<access origin="https://codepush.appcenter.ms" /><access origin="https://codepush.blob.core.windows.net" /><access origin="https://codepushupdates.azureedge.net" />Supprimez la référence à CodePush dans la balise CSP meta dans le index.html fichier (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, au sein de votre application, supprimez toute référence code aux services App Center, tels que codePush.sync();.
Étapes suivantes
Vous avez migré d'App Center vers Capgo, en utilisant les Live Updates. Ce n'est que le début de ce que vous pouvez faire avec Capgo. Explorez le reste du service, qui inclut les canaux (plusieurs environnements) et l'override. Pour l'intégration CLI cloud, utilisez Capgo au sein de votre plateforme CI/CD (comme GitHub Action, GitLab, Jenkins, et plus encore).
Envoi automatique de la mise à jour de l'app
Si votre code est hébergé sur GitHub, vous pouvez configurer le build et la release automatiques en quelques étapes, grâce aux actions GitHub.
J'ai rédigé un second article pour vous permettre de le faire.
Crédits
Un grand merci à Ionic, cet article est basé sur cet article réécrit avec chat-gpt-3 et adapté.
Continuer avec Migrer d'App Center vers Capgo
Si vous utilisez Migrer d'App Center vers Capgo pour planifier la migration et les opérations d'entreprise, connectez-l’à Capgo Enterprise pour le workflow produit dans Capgo Enterprise, Alternatives aux plugins Ionic Enterprise pour le workflow produit dans les alternatives aux plugins Ionic Enterprise, Alternatives Capgo pour le workflow produit dans les alternatives Capgo, Conseil Capgo pour le workflow produit dans Capgo Consulting, et Support Premium Capgo pour le workflow produit dans Capgo Premium Support.
