Cargar un vídeo desde assets (local) usando Expo React Native

Cargar un vídeo desde assets (local) usando Expo React Native

Tiempo de lectura: 2 minutos Para cargar un video desde un archivo local almacenado en assets/videos/video_1.mp4, puedes usar el componente Video de la librería expo-av. 1. Instala las dependencias necesarias Si no tienes la librería expo-av instalada, puedes añadirla a tu proyecto con: 2. Organiza los archivos en tu proyecto Guarda tu archivo de video en assets/videos/video_1.mp4. Asegúrate de que … Leer más

Utilizar Xcode con Expo en React Native usando la consola de comandos de MAC

Utilizar Xcode con Expo en React Native usando la consola de comandos de MAC

Tiempo de lectura: < 1 minuto Hoy vamos a aprender cómo podemos utilizar Xcode de nuestro MAC de forma remota por línea de comandos. Primero debemos asegurarnos qué tenemos Xcode instalado en nuestro MAC. Ahora vamos a preparar todo el entorno. Seleccionar la versión de Xcode Verificamos que está seleccionada: Instalamos las herramientas de línea de comandos de xcode. Instalamos cocoapods … Leer más

Pruebas Unitarias con Jest en React Native y Expo

Pruebas Unitarias con Jest en React Native y Expo

Tiempo de lectura: 2 minutos Las pruebas Unitarias son muy importantes en el proceso de desarrollo de software, nos aseguran un funcionamiento correcto y evitan regresiones en nuestro código. Hoy vamos a aprender a crear pruebas unitarias con Jest e integrarlas en React Native con Expo. NUEVAS INSTRUCIONES: Necesitamos tener la última versión de React en nuestro proyecto, en mi … Leer más

Cómo Configurar un Stack Navigator Dentro de un Tab Navigator en React Navigation

Cómo Configurar un Stack Navigator Dentro de un Tab Navigator en React Navigation

Tiempo de lectura: 2 minutos En este tutorial aprenderás cómo configurar un Stack.Navigator dentro de un Tab.Navigator. Esto es útil cuando necesitas que ciertas pantallas estén agrupadas bajo una pestaña específica (por ejemplo, una pantalla de perfil con opciones adicionales). Aprenderás cómo configurar una navegación mixta utilizando un Stack.Navigator dentro de un Tab.Navigator y viceversa, simulando una estructura como la … Leer más

Script para reconstruir pods en iOS en local para Expo React Native

Script para reconstruir pods en iOS en local para Expo React Native

Tiempo de lectura: < 1 minuto Os traigo un script que nos permitirá reconstruir los PODs en la carpeta iOS del proyecto Expo con React Native. Tendremos que añadir este script en package.json Y para ejecutarlo haremos: isMa Ingeniero en Informática, Investigador, me encanta crear cosas o arreglarlas y darles una nueva vida. Escritor y poeta. Más de 20 APPs publicadas … Leer más

Ejecutar un script con Expo cuando generas un build con EAS.

Ejecutar un script con Expo cuando generas un build con EAS.

Tiempo de lectura: 2 minutos Cuando ejecutamos un build en EAS podemos lanzar distintos hooks antes de la compilación completa, por ejemplo pruebas o modificación de archivos. Hoy vamos a aprender cómo podemos realizar este proceso. Expo permite ejecutar distintos hooks en el ciclo de vida del build: https://docs.expo.dev/build-reference/npm-hooks/ Para este caso vamos a utilizar justamente en el hook eas-build-post-install. … Leer más

Crear anuncio recompensado (Reward) con react-native-google-mobile-ads para React Native y Expo

Crear anuncio recompensado (Reward) con react-native-google-mobile-ads para React Native y Expo

Tiempo de lectura: 3 minutos Hoy vamos a aprender cómo podemos implementar un anuncio recompensando de Google Admob (Reward) en React Native con Expo. Lo primero que haremos es instalar la libreria de anuncios: Debemos tener una cuenta registrada en Admob. Si usamos Expo tenemos que añadir dentro de app.config.js o app.json lo siguiente: Y tenemos que instalar: Y si … Leer más

Añadir un plugin que permita editar AndroidManifest.xml cuando generas un proyecto con Expo en React Native ejemplo para añadir com.google.android.gms.ads.APPLICATION_ID

Añadir un plugin que permita editar AndroidManifest.xml cuando generas un proyecto con Expo en React Native ejemplo para añadir com.google.android.gms.ads.APPLICATION_ID

Tiempo de lectura: 2 minutos Hoy vamos a crear un plugin que nos permitirá editar el manifest de Android a la hora de generar el build con Expo en React Native. En este ejemplo añadiremos el ID de aplicación necesario para Google Admob. Primero vamos a crear un archivo que llamaremos AdmobExtraConfigManifest.js (no importa si usas TypeScript, vamos a usar … Leer más

Crear un script para editar AndroidManifest.xml después de generar el build con React Native Expo para eliminar permisos.

Crear un script para editar AndroidManifest.xml después de generar el build con React Native Expo para eliminar permisos.

Tiempo de lectura: 3 minutos Hoy vamos a hacer un script que nos ayudará a editar el AndroidManifest.xml después de generar el build con React Native Expo para evitar permisos extras que añaden ciertas librerías. En mi caso quiero eliminar el permiso: Que añade automáticamente la librería de Expo Sensors. Para eliminarlo lo que haremos es generar un paso posterior … Leer más

Implementar Login de Google (Google sign) en React Native (también compatible con Expo)

Implementar Login de Google (Google sign) en React Native (también compatible con Expo)

Tiempo de lectura: 6 minutos Hoy vamos a aprender cómo podemos implementar Login de Google con Google Sign para React Native y que además es compatible con Expo. Vamos a utilizar la librería react-native-google-signin/google-signin Primero vamos a instalar la librería necesaria: Importante, para que la librería funcione debes tener una APP nativa. (Aquí te enseño cómo generar un build de … Leer más