Migrando desde App Center a Capgo

Resumen de Migración

• Capgo es un servicio que ayuda a los equipos de desarrollo a enviar aplicaciones en vivo a aplicaciones desplegadas.
• Capacitor Las aplicaciones de JS escritas en jQuery Mobile, Framework 7, Sencha, KendoUI, Ionic o incluso su propia solución personalizada pueden ser migradas. No se requiere una aplicación Ionic existente..
• Colt ofrece servicios equivalentes para App Center Build (construye aplicaciones Android/iOS). Para servicios de Prueba, Diagnósticos y Análisis.

Nota

Si su aplicación sigue utilizando Cordova, es necesario migrar a Capacitor antes de migrar a Capgo.

Desarrollado por el equipo de Ionic como un sucesor espiritual a Cordova, Capacitor permite que el desarrollo se acerque a las herramientas y capacidades nativas con el objetivo de proporcionar una experiencia de usuario aún mejor y rendimiento.

Por suerte, el proceso de migración es fácil y la mayoría de los plugins de Cordova son compatibles hacia atrás con Capacitor. Comienza a migrar aquí.

Sobre Capgo

Capgo, se encarga de actualizar las aplicaciones con el tiempo. Los equipos de desarrollo pueden enfocarse completamente en las características únicas de su aplicación y externalizar el complicado proceso de entrega de la aplicación a Capgo.

Capgo completa las brechas entre la entrega web y móvil.

Capgo Requisitos previos

Como App Center, Capgo admite aplicaciones alojadas en repositorios de Git en Azure DevOps, Bitbucket, GitHub, y GitLab.

Instala Capgo CLI

nota

Tienes que tener instalado Node y NPM en tu computadora antes de proceder. Siempre utiliza la versión LTS actual Capgo no versiones antiguas.

Crear package.json y Capacitor archivos de configuración

Nota

Antes de comenzar, recomiendo hacer cambios en una rama Git fresca.

Dado que Capgo fue creado para automatizar capacitor aplicaciones, requiere un archivo que tu aplicación puede no tener. Primero, crea un capacitor.config.json archivo. La forma más fácil de crearlo es ejecutar en la raíz de tu aplicación:

npm install @capacitor/core

Luego, inicia Capacitor utilizando el cuestionario de CLI:

npx cap init

El cuestionario de CLI te hará algunas preguntas, comenzando con el nombre de tu aplicación, y el ID de paquete que deseas utilizar para tu aplicación.

Finalmente, comienza a seguir los cambios en tu proyecto:

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

Migrar el Code

Ahora que tienes los nuevos archivos requeridos Capgo en su lugar, puedes dirigir tu atención a la aplicación real. Capgo espera que toda la aplicación construida esté dentro de un directorio llamado dist.

Si tu aplicación construida code no está en un dist directorios, cambia este valor en el archivo de configuración Capacitor.

Esto es lo que debería verse la estructura de directorios de la aplicación:

Capgo de Configuración

With tu aplicación lista para la integración, es hora de registrarte y obtener tu clave de __CAPGO_KEEP_0__ para subir tu primera versión. Comienza por registrarte para una cuenta de Capgo Una vez que estás conectado a API, navega a la página de Cuenta, luego haz clic en la clave de __CAPGO_KEEP_1__, luego haz clic en el ‘write’ para copiarla a tu portapapeles. Instala el Capgo __CAPGO_KEEP_1__.

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

Y luego agrega a tu aplicación esta Capacitor en lugar de CodePush:

npm i @capgo/capacitor-updater && npx cap sync To install the plugin into your Capacitor app.

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

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

CapacitorUpdater.notifyAppReady()

La característica de Actualizaciones en Vivo funciona utilizando la clave instalada

La clave de __CAPGO_KEEP_0__ se utiliza para __CAPGO_KEEP_1__

La clave de __CAPGO_KEEP_0__ se utiliza para __CAPGO_KEEP_1__ Capgo SDK en su aplicación nativa para escuchar un destino de canal de despliegue específico. Cuando se asigna una compilación web a un destino de canal de despliegue, esa actualización se desplegará en dispositivos de los usuarios que ejecutan binarios configurados para escuchar el destino de canal de despliegue especificado.

Iniciar sesión en Capgo CLOUD

Primero, utilice el all apikey presente en su cuenta para iniciar sesión con el CLI:

npx @capgo/cli@latest login YOURKEY

Agregar su primera aplicación

Empecemos creando la aplicación en Capgo Cloud con el CLI.

npx @capgo/cli@latest app add

Esta orden utilizará todas las variables definidas en el archivo de configuración de Capacitor para crear la aplicación.

Subir su primer paquete

Ejecutar la orden para compilar su code y enviarlo a Capgo con:

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

Por defecto, el nombre de la versión será el de su package.json file.

Verificar en Capgo si el build está presente.

Puedes incluso probarlo con mi aplicación de prueba móvil.

Hacer canal predeterminado

Después de que hayas enviado tu aplicación a Capgo, debes hacer que tu canal default permita que las aplicaciones reciban actualizaciones de Capgo.

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

Configurar aplicación para validar actualizaciones

Agregar esta configuración a tu archivo JavaScript principal.

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

CapacitorUpdater.notifyAppReady()

Luego haz un npm run build && npx cap copy To actualizar tu aplicación.

Recibir una Actualización en Vivo en un Dispositivo

Para que tu aplicación reciba una actualización en vivo desde Deploy, necesitarás ejecutar la aplicación en un dispositivo o un emulador. La forma más fácil de hacer esto es simplemente utilizar el siguiente comando para lanzar tu aplicación local en un emulador o un dispositivo conectado a tu computadora.

npx cap run [ios | android]

Abre la aplicación, ponla en segundo plano y abríla de nuevo, deberías ver en los registros que la aplicación realizó la actualización.

Felicidades! 🎉 Has desplegado con éxito tu primera Actualización en Vivo. Esto es solo el comienzo de lo que puedes hacer con Actualizaciones en Vivo. Para aprender más, consulta la documentación completa sobre Documentación de Actualizaciones en Vivo.

Eliminar Dependencias de App Center

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.

Primero, abre una terminal y desinstala los plugins de App Center:

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

Abre config.xml y elimina los siguientes preference valores. Se parecerán a:

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

If estabas utilizando Analytics de App Center en tu aplicación, elimina los siguientes preferences elementos: APPCENTER_ANALYTICS_ENABLE_IN_JS y APPCENTER_CRASHES_ALWAYS_SEND.

Elimina los siguientes <access /> elementos:

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

Elimina la referencia a CodePush en el CSP meta etiqueta en el index.html archivo (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();.

Pasos siguientes

Has migrado de App Center a Capgo, utilizando las actualizaciones en vivo. Esto es solo el comienzo de lo que puedes utilizar Capgo para. Explora el resto de los servicios que incluyen Canal (múltiples entornos) y sobrescritura. Integración de Cloud CLI , utiliza Capgo dentro de tu plataforma de CI/CD de elección (como GitHub Action, GitLab, Jenkins, y más).

Envío automático de actualización de la aplicación

Si su code está alojado en GitHub, puede configurar la compilación y la liberación automáticas en unos pasos más, gracias a las acciones de GitHub.

He escrito un segundo artículo para que puedas hacerlo.

Créditos

Muchas gracias a Ionic, este artículo se basa en este artículo reescrito con chat-gpt-3 y adaptado.

Sigue adelante desde Migrar desde App Center a Capgo

Si está utilizando Migrar desde App Center a Capgo para planificar la migración y las operaciones empresariales, conectéalo con Capgo Empresa de Alto Rango para el flujo de trabajo del producto en Capgo Empresa de Alto Rango, Alternativas del Plugin de Alto Rango de Ionic para el flujo de trabajo del producto en Alternativas del Plugin de Alto Rango de Ionic, Capgo Alternativas para el flujo de trabajo del producto en Capgo Alternativas, Capgo Consultoría para el flujo de trabajo del producto en Capgo Consultoría, y Capgo Soporte Premium para el flujo de trabajo del producto en Capgo Soporte Premium.