Complete How To: create-react-native-app con Genymotion (Android Emulator) en Windows 10 en 10 pasos

Siempre he sido fanático de las guías de inicio rápido. Aquí está mi intento de ayudar a aquellos que buscan configurar un emulador de Android para construir sus aplicaciones nativas React usando create-native-react-app y Genymotion en Windows 10.

En esta guía, supongo que las personas comienzan desde cero. (instalación nueva de Windows sin dependencias)

Paso 1: Instalar Node.js

Como comenzamos desde cero, descarguemos Node.js primero. Simplemente descargue la versión LTS para estar más seguro. Puede obtener eso desde aquí:

Siga las instrucciones de instalación (siga haciendo clic en Siguiente) hasta que aparezca el cuadro de diálogo Finalizar.

Una vez hecho esto, abra el símbolo del sistema (haga clic en Inicio -> escriba cmd y presione Entrar) y escriba uno por uno:

nodo -v
npm -v

si ambos comandos no devolvieron errores, está configurado para el Paso 2; de lo contrario, algo salió mal con la instalación de Node.js. Puede solucionar el problema aquí:

** Paso 2 (por ahora): degradar npm a v4.x.x

Al momento de escribir esta guía. El soporte para npm @ 5 tiene errores. Estoy seguro de que se solucionará en un futuro próximo. Pero por ahora esto es lo que haces:

npm install -g npm @ 4

Paso 3: Instala la aplicación create-react-native

Ahora que tiene Node.js funcionando en el símbolo del sistema, escriba el siguiente:

npm install -g create-react-native-app

y presiona Enter.

Paso 4: Regístrese en Genymotion

Dirígete a https://www.genymotion.com/account/create/ y crea una cuenta.

Personalmente,
Para el tipo de empresa elegí: Freelancers y,
para el tipo de uso que elegí: Desarrollo

Paso 4: descarga Genymotion

Una vez hecho esto, debería ser llevado a la página de descargas, si no, diríjase allí usted mismo:

Elija la opción con VirtualBox (si no tiene VirtualBox ya instalado en su PC con Windows).

Paso 5: Agregar un nuevo dispositivo virtual en Genymotion

Una vez descargado, abra Genymotion e inicie sesión con las credenciales creadas en el Paso 3.
Ahora, podrá agregar un nuevo dispositivo virtual (Ctrl + N).

Elija cualquiera de la lista y haga clic en Siguiente.

Una vez hecho esto, verá sus dispositivos en la lista de Dispositivos virtuales:

Paso 6: Configurar variables de entorno y agregar ruta

¡Casi estámos allí! No presione Iniciar todavía, minimice la ventana Genymotion y haga clic con el botón derecho en Esta PC (Mi PC) -> Seleccionar propiedades.

Busque la configuración avanzada del sistema en el panel izquierdo y haga clic en él.

La ventana Propiedades del sistema debería aparecer. Luego haga clic en Variables de entorno en la parte inferior derecha.

En la ventana Variable de entorno que aparece.
En el soporte de variables del sistema, seleccione Ruta y haga clic en Editar.

A continuación, en la ventana variable de entorno de edición, haga clic en Nuevo -> agregar ruta C: \ Archivos de programa \ Genymobile \ Genymotion \ tools -> haga clic en Aceptar hasta que se cierren todas las ventanas.

Paso 7: Inicio del dispositivo virtual en Genymotion

A continuación, restaure la ventana de Genymotion previamente minimizada y haga clic en Iniciar.

Debería ver aparecer un emulador de Android como este:

Paso 8: Creación de la "aplicación nativa create-react"

Luego, abra el símbolo del sistema nuevamente, vaya al directorio de proyectos y escriba:

crear-reaccionar-aplicación-nativa su-proyecto-impresionante

Paso 9: Ejecuta la aplicación "create-react-native-app"

Ahora, en el símbolo del sistema, escriba:

cd your-awesome-project
npm ejecutar android

Paso 10: ¡Dale permiso y listo!

Por último, otorgue permiso para expo cuando vea esta pantalla (o similar) en su dispositivo virtual.

¡Y tu estas listo!

Espero que esta guía te haya ayudado. ¡Feliz pirateo!