Automatización de Despliegues en React Native

Hola, bienvenidos a la Automatización de Despliegues de React Native. Soy Cecilia Martínez. Soy una defensora de desarrolladores para AppFlow, la plataforma CI CD construida por Ionic. Pueden sentirse libres de conectarse conmigo en Twitter o GitHub, en Cecilia Creates, o en LinkedIn usando mi nombre, Cecilia Martínez.

Estoy aquí hoy para hablarles sobre el envío de aplicaciones React Native, específicamente el proceso de despliegue. Para muchos desarrolladores, el proceso de despliegue es muy manual y muy complejo. Tienen que preparar el código de su aplicación para la distribución, tienen que compilar el binario nativo firmado. También tienen que entregar ese binario nativo a las tiendas de aplicaciones, tanto para iOS como para Android, y desplegarlo a los probadores manuales para asegurarse de que su aplicación funcione como se espera. Una vez que han pasado por todo eso, todavía tienen que publicar su aplicación para todos los usuarios y asegurarse de que tienen soporte continuo.

Ahora, hay algunos beneficios al implementar automation en este proceso. Así que en esta charla vamos a revisar algunas formas en las que pueden implementar de manera incremental automation en ciertas áreas de alto impacto del proceso de despliegue. Primero comenzaremos hablando sobre la configuración. Entonces, una de las áreas donde pueden implementar automation en el aspecto de configuración es para actualizar automáticamente valores de configuración como el ID de la compilación. Así que típicamente para cada nueva versión de su aplicación, van a querer un nuevo número de compilación para iOS y un código de versión para Android. Esto puede ser muy tedioso de hacer manualmente, especialmente para las aplicaciones React Native porque necesitan entrar en el código fuente de cada una de esas plataformas y actualizarlo. Ser capaz de hacer esto automáticamente en un entorno CI lo hace mucho más fácil y asegura que todos sus desarrolladores están en la misma página.

Para hacer esto, pueden usar una herramienta como Trapeze. Trapeze es una herramienta gratuita y de código abierto construida por Ionic. Pueden aprender más en trapeze.dev. Pero Trapeze les permite usar YAML para crear un archivo que contiene instrucciones de cómo les gustaría configurar aplicaciones nativas. En este caso, estamos usando una variable de entorno de número de compilación CI. Esto es típicamente proporcionado por su entorno CI CD. Ya sea que estén usando GitHub Actions, CircleCI, o en este caso, estamos hablando de AppFlow, pueden actualizar esto para que sea lo que sea la variable de entorno de número de compilación CI. Luego estamos emparejando ese número de compilación CI con el número de compilación de iOS o su código de versión de Android, dependiendo de para qué plataforma estén construyendo. Luego en su package.json para su aplicación React native, tendrán un script. En este caso, tenemos un script de configuración CI que ejecutará Trapeze y hará referencia a ese archivo CI.yaml que acabamos de ver. Basado en para qué plataforma estén construyendo, de nuevo, esta es una variable de entorno proporcionada por su proveedor CI CD, actualizarán ya sea ese número de compilación de iOS o el código de versión de Android. Esto no sólo es útil para asegurarse de que siempre tienen un número de compilación fresco, sino que es también bueno para cosas como la depuración, para testing, y para obtener registros de compilación de su entorno CI porque siempre coincidirá con el código de versión de su aplicación.

A continuación, hablemos de la compilación. Si deciden automatizar su proceso de compilación, puede ser de alto impacto porque hay mucho que entra en la compilación para iOS y Android nativos.

Necesitas activar la construcción nativa. Necesitas instalar las dependencias que se requieren para tu construcción. Si estás construyendo para lanzamiento o para la App Store necesitas decodificar y aplicar las credenciales de firma así como finalmente subir ese artefacto de construcción.

Echemos un vistazo a un ejemplo de GitHub Actions para una simple construcción de debug de Android. Este es probablemente la construcción automatizada más simple que puedes hacer. El disparador es el despacho de flujo de trabajo. Este es un despacho manual pero podrías hacer cosas como empujar a una rama o un nuevo commit. Estamos ejecutando en Linux y estamos revisando nuestro código.

Aquí es donde estamos instalando nuestras dependencias. Aunque Java y Android Studio están instalados en GitHub Actions por defecto, necesitamos configurarlo para que sea la versión correcta que corresponda a nuestra aplicación React Native. También queremos almacenar en caché Gradle para mejorar el performance. También estamos instalando las dependencias que necesitamos para React Native. En este siguiente paso aquí estamos agrupando la aplicación. Esto es requerido antes de que realmente construyas cuando estás haciendo Android debug. Luego vamos a usar Gradle para crear ese binario de ensamblaje debug nativo. Finalmente queremos asegurarnos de que ese archivo APK salga de nuestro entorno de construcción. Estamos utilizando la acción de subida de artefacto de construcción de GitHub. También estamos pasando a través de esa ruta para poder acceder a ese archivo APK.

Ahora, como mencioné, este es el más simple que puedes hacer. Es una construcción de debug de Android. No necesitamos ninguna credencial de firma. Si estás haciendo una construcción de lanzamiento de Android o cualquier tipo de construcción de iOS, no para simuladores, entonces se vuelve mucho más complicado. Para Android, necesitarás especificar tu archivo de almacén de claves, contraseña, alias de clave y contraseña de clave en tu archivo build.gradle. Sin embargo, la parte más complicada es asegurar que estos archivos y contraseñas estén disponibles en tu entorno CI. Como es un archivo y no solo una contraseña basada en texto, vas a necesitar realmente codificar eso en base64 y luego decodificar eso en parte de tu proceso de construcción. Para iOS, por ejemplo, esto es lo que parece con GitHub Actions. Tienes en tus secretos, tienes tu certificado base64 de la tienda y el perfil de provisión así como las contraseñas, pero entonces también necesitas codificar y decodificar eso. Como esto puede volverse súper complicado y fácil de estropear, te recomiendo encarecidamente que uses herramientas de credenciales de firma. Esto puede ser pasos o acciones preconstruidas, así que si estás usando GitHub Actions o podría incorporarse en algo como CircleCI para tu entorno CI-CD, o puedes usar una herramienta para la gestión de credenciales en la nube como Fastlane Match o AppFlow. Como ejemplo, en AppFlow, puedes subir tus credenciales de Android e iOS que están almacenadas en los servidores de AppFlow.

Entonces, cada vez que creas una nueva construcción, automáticamente aplicas el certificado de firma que corresponde a la plataforma objetivo y al tipo de construcción. Así que nos encargamos de toda esa decodificación y codificación por ti, para que no tengas que preocuparte por ello como parte de tu construcción.

Finalmente, echemos un vistazo a la carga y testing y cómo puedes incorporar automation aquí. Ahora, cada vez que quieres distribuir los binarios que acabas de crear a tus probadores manuales, normalmente usarás Google Play Console o App Store Connect para distribuir a pistas de testing o a TestFlight. Si quieres hacer este paso de carga automáticamente, puedes aprovechar las APIs de Desarrollador de App Store. También puedes usar una herramienta de integración CICD como Fastlane. O también puedes usar una plataforma móvil CICD como Bitrise o AppFlow para automatizar este paso de carga.

Echemos un vistazo primero a Fastlane. Fastlane es una herramienta de código abierto actualmente mantenida por Google. Puedes aprender más en docs.fastlane.tools. Con Fastlane, creas un archivo tipo yaml llamado archivo FAST, pero tiene su propio sintaxis. Entonces, en la primera línea, como puedes ver aquí, tenemos una serie de pasos que estamos realizando. Vamos a incrementar el número de la construcción, vamos a construir la aplicación y luego vamos a subirla a TestFlight. Estos son pasos que proporciona Fastlane. Sin embargo, necesitas asegurarte de que tus credenciales y todo está configurado en tu entorno para que puedas conectarte realmente a tu cuenta de App Store Connect.

Si estás utilizando una plataforma móvil CICD como AppFlow, puedes crear una automation que también se conecta a tu cuenta de App Store Connect. Así que aquí, tenemos una automation de TestFlight que cada vez que hacemos push a nuestra rama principal de Git, crea una nueva construcción de App Store iOS utilizando nuestro certificado de firma, y luego la sube a la App Store a nuestro destino de TestFlight. Esto significa que cada vez que hago un cambio, se sube una nueva versión a App Store Connect y está inmediatamente disponible para todos mis probadores de TestFlight.

Bueno, hemos cubierto mucho en muy poco tiempo, así que si estás buscando más formas de automatizar tus despliegues de React Native, echa un vistazo a este ebook gratuito, Solving Mobile CICD with AppFlow, utilizando el enlace del código QR en la pantalla. Y no dudes en contactarme si tienes alguna pregunta. De nuevo, estoy en Cecilia Creates. Gracias.