Información del contacto

Cra 42B #107C-80, Medellín, Colombia

Estamos disponibles 24 horas al día, 7 días a la semana. Llame ahora. (323) 813-1216 (323) 813-1216 [email protected]
Síganos

Hace unos días me fijé que para muchos programadores que comienzan a programar aplicaciones móviles usando React Native desconocen la forma correcta de generar un APK o AAB binario de su proyecto en este espectacular framework llamado React Native, bien sea para publicar en las respectivas tiendas o para probar en ambientes de debug.

Este pequeño artículo también funciona si tu aplicación es nativa en Kotlin o Java y deseas optimizar el proceso de compilación. De hecho yo lo uso en todos mis proyectos y es la más segura porque permite poca o nula posibilidad de extraviar las llaves, contraseñas o implementos de compilación para Android.

¿Qué se necesita para generar una APK de un proyecto en React Native?

La verdad se requiere solo tener un poco de conocimiento sobre programación y lógica de sistemas, y a diferencia de cómo pasaría si estuvieras generando una APK o AAB desde Android Studio. No requieres instalar abrir Android Studio durante su proceso de compilación en binario APK o AAB.

En este punto solo te recuerdo que harás uso de la terminal o CMD de tu computador, no de manera avanzada pero sí de forma muy importante para poder ejecutar el comando que compila la aplicación.

Generar las llaves o keystore de compilación

Para ello debes posicionarte desde tu terminal en la ruta android/app de tu proyecto en React Native. Luego de eso debes ejecutar el siguiente código que te permitirá generar las llaves correspondientes:

keytool -genkey -v -keystore mykeystore.keystore -alias mykeyalias -keyalg RSA -keysize 2048 -validity 10000
Debes tener en cuenta que debes reemplazar el nombre mykeystore con el nombre que desees para tus llaves.

Una vez ejecutes esa línea en tu terminal debes proporcionar la información que te solicitará, desde la contraseña hasta tu nombre y demás, para poder finalizar el proceso y entregarte las llaves. Estas no las debes borrar y de preferencia las debes conservar junto con el proyecto.

Asignar las variables en el gradle

En este paso se asignan las variables que te permitirán ejecutar el comando de compilación y generar la APK o AAB de tu proyecto. No olvides que esto no es más que decirle a tu sistema la información de acceso a las llaves que generaste en el paso anterior.

Para ello recuerda que el nombre de las variables puede variar y no debe ser necesariamente el que yo te coloco, pero te recomiendo que sea en mayúsculas y muy descriptivo, para lo cual debes modificar el archivo en la ruta, android/gradle.properties  el cual al igual que todos los archivos de tu proyecto seguro tendrá algún contenido, pero puedes agregar la siguiente información al final desde cualquier editor de código o IDE:

Por lo que el nombre MYAPP_RELEASE... puede variar a por ejemplo: RELEASE... o como quieras, pero siempre siendo en mayúsculas y nunca olvidando su nombre para el paso siguiente.

Configurar el build del proyecto

Debes ubicarte en el archivo de la ruta android/app/build.gradle de tu proyecto y abrirlo con cualquier editor de código o IDE.

Una vez lo abras debes ubicar la línea 148 y reemplazar hasta la línea 167 en tu IDE o editor de código favorito con el siguiente código:

Si detallamos bien, solo ejecuta el llamado a las variables anteriormente guardadas en el gradle sobre el acceso a las llaves, y reemplazamos el modo de firma de las APK y AAB a modo release dentro del archivo de configuración del build.

Esto permite que al generar la APK o AAB ya se encuentre disponible para publicar en cualquier tienda, bien sea Google Play Store o AppGallery que serían es este paso las dos más importantes. Pero siendo posible hacerlo en cualquiera que tú consideres.

Generar la APK o AAB

Este paso resulta ser quizás el más simple de todos después de crear al proyecto. Y lo es porque con solo un comando dentro de la raíz del proyecto puedes generar una APK o AAB release lista para probar, compartir o publicar.

Si deseas un generar un APK debes usar el mando: cd android && ./gradlew assembleRelease y luego puedes ir a buscar tu APK en el directorio android/app/build/outputs/apk/release/app-release.apk de con tu navegador de archivos y allí estará esperándote.

Si deseas un generar un AAB debes utilizar el mando: cd android && ./gradlew bundleRelease y luego puedes ir a buscar tu Android App Bundle (o AAB) en el directorio android/app/build/outputs/bundle/release/app.apk de con tu navegador de archivos y allí estará esperándote.

Otra opción es generarlo desde un npx de react-native, para NPM usas: npm run android — –mode=«release» y para yarn usas: yarn android –mode release.

Para lo que incluso puedes generar ambos binarios y utilizar uno para probar en tu propio dispositivo Android y compartir con amigos y clientes APK, mientras que utilizas el AAB para publicar de forma óptima en las respectivas tiendas que desees se realice.

Bonus: ¿cómo cargar las llaves o keystore para no perderlas?

Este quizás sea uno de los puntos más habituales del que inicia a programar aplicaciones móviles, el perder las llaves de compilación implica que si la aplicación ya está publicada y necesitas cargar una actualización por cualquier motivo, no podrás o será muy complejo hacerlo.

Por eso para evitar esto yo uso el mismo repositorio de GitHub para subir mi proyecto con llaves y todo, esto se puede hacer comentando dos líneas (41 y 42) del archivo .gitignore en la raíz de tu proyecto, las cuales tienen los siguientes datos

Línea 41: #*.keystore

Línea 42: #!debug.keystore

Lo cual te permitirá guardar las llaves de firmado de tu binario APK o AAB, y no perderlas.

Conclusión

Realmente es fácil compilar un proyecto de React Native en una APK o AAB, no se necesita mucho conocimiento, pero, sin embargo, es importante ejecutar este pequeño tutorial paso por paso, con la intención de que puedas generar el binario correcto de tu proyecto en React Native.

No olvides comentar y compartir este artículo si te gusto es basado en la documentación oficial de React Native con varios ajustes y explicaciones detalladas propias.

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

Artículos recientes

Vanna.AI
Vanna.AI: La IA pasa lenguaje natural a
  • 23 de agosto de 2023
La guia esencial de SEO y SEM ¿Como maximizar su presencia en Internet
La guía esencial de SEO y SEM:
  • 22 de agosto de 2023
Los 11 patrones de arquitectura de software
  • 14 de diciembre de 2022
¿Necesita un proyecto exitoso?

Trabajemos juntos

Solicitar asesoría
  • right image
  • Left Image