#CursoDe React Native – Primeros pasos

React Native nace de ReactReact.js o ReactJS) que es una biblioteca Javascript de código abierto para crear interfaces de usuario con el objetivo de animar al desarrollo de aplicaciones en una sola página como por ejemplo Angular.

React Native toma también ideas de Apache Cordoba o Ionic que son apps hibridas, y mejora la formula, haciendo que este código en javascript, se compile y sea código nativo, esto hace que las app sean mas rápidas.

*Todo lo que vamos a ver es con entorno Windows y Android

Que necesitamos para iniciar a programar en react native

  • Dependencias y CLI
  • Android Studio
  • Variables de sistemas

Dependencias y CLI

Necesitamos instalar un gestor de paquetes para windows, este se llama Chocolatey vamos a buscar cmd o símbolo de sistemas.

cmd en windows

con click derecho vamos a seleccionar Ejecutar como administrador.

Vamos a pegar la siguiente linea en el cmd:

iex ((New-Object System.Net.WebClient).DownloadString(‘https://chocolatey.org/install.ps1’))

 

 

una vez instalado choco, React Native nos pide que instalemos NodeJS y Python2, asi que pegaremos las siguientes lineas, si ya tienes instalado alguna no es necesario instalarlo nuevamente:

NodeJS:

choco install nodejs.install

Python2:

choco install python2

¡Listo!, como en angular 2, ember u otro framework React native también usa un CLI, para instalarlo tenemos que colocar esta lineas en nuestra ventana del cmd:

npm install g reactnativecli

Android Studio

android studio

Vamos a bajar android studio de este link, aquí debemos tener paciencia, hay que instalar lo siguiente:

  • Android SDK
  • Android SDK Platform
  • Performance (Intel ® HAXM)
  • Android Virtual Device

Ya instalado vamos a abrir android studio, creamos un proyecto y vamos a buscar los siguientes botones

1.-  descargaremos los siguientes SDK de android

y en la pestaña de SDK Tool instalaremos Android SDK Build Tools

2.- creamos un emulador nuevo con cualquier versión de android, el procesador debe ser Intel Atom (x86_64) o iniciamos con el que trae yaAndroid device

Variables de sistemas

Antes de nada deben instalar java, por default android studio instala java 7.x pero para react necesitamos la mas reciente , pueden bajarlo en el siguiente link

Vamos a agregar nuevas variables de entornos

window 10/8/7:

Inicio -> click derecho -> sistema -> Configuración avanzadas del sistema -> variables de entorno

 

Variables Android

env variable

es importante llamarlo ANDROID_HOME.

Variables Java

JAVA HOME

Para que haga efecto los cambios debemos reiniciar la maquina, una vez reiniciada la maquina abriremos nuevamente cmd y nos posicionamos en donde queremos crear el proyecto.

Creamos un nuevo proyecto, bajara la semilla mas reciente de react native

reactnative init tutouno

Nos posicionamos en el proyecto creado

cd tutouno

Iniciamos el servicio

reactnative start

Iniciaremos la maquina virtual de android studio, luego vamos a abrir otro cmd en tutouno, podemos posicionarnos en el proyecto y tocar click derecho -> abrir ventana de comando aquí

Ya iniciado la maquina virtual vamos a colocar la siguiente linea en el cmd

react-native run-android

y si todo va bien vamos a ver algo como esto

Ahora ya tenemos nuestra app de hola mundo compilada y lista para comenzar a trabajar

 

Les agradecemos por el tiempo, en el próximo post, explicaremos sobre las etiquetas básicas y el diseño

 

 

One comment

Deja un comentario

Este sitio usa Akismet para reducir el spam. Aprende cómo se procesan los datos de tus comentarios.