EtiquetaReactNative

Configurando mi entorno con React Native

En estos días he decidido desarrollar aplicaciones nativas para mejorar la experiencia del usuario utilizando toda la potencia de una aplicación nativa y sacando provecho de mis conocimientos de Javascript con React Native.
He configurado mi ordenador Mac para desarrollar con React Native para iOS y Android, primero le explico que instalaremos y luego al final esta un gist con todos los pasos.
La instalación de los paquetes se realizan mediante homebrew un gestor de paquetes para OSX, los paquetes son Nodejs, React-native-cli, Watchman, Flow.

Android

Para el soporte de plataforma de android necesitamos el jdk (Java Development Kit) lo descargamos de la pagina oficial:

http://www.oracle.com/technetwork/java/javase/downloads/jdk8-downloads-2133151.html

Con el JDK instalado podemos descargar el Android SDK e instalar los siguientes paquetes:

Android SDK Tools 24.4.1
Android SDK Platform-Tools 23.1
Android SDK Build Tools 23.0.2
Android SDK Build Tools 23.0.1
Android 6.0 API (full)
Extras / Android Support Repository
Extras / Android Support Library
En caso que de el siguiente error en la instalacion de watchman:

Error: You must `brew link pcre` before watchman can be installed

ejecutar el siguiente comando

sudo chown $(whoami) /usr/local/lib/

y luego ejecutar

 `brew link pcre`

IOS

Para poder correr compilar en IOS requerimos XCode ademas que nos facilita el emulador de IPhone, desde el AppStore instalaremos XCode.

Instalación IOS / Android
Abrimos la terminal y podemos ir ejecutando paso a paso

brew install node
npm install -g react-native-cli
brew install watchman
brew install flow
brew install android-sdk
nano ~/.bash_profile 
export ANDROID_HOME=/usr/local/opt/android-sdk
adb reverse tcp:8081 tcp:8081 
//crear el proyecto.
react-native init techdencias

Ya solo tenemos que entrar a nuestra app de ejemplo y para visualizarlo en android ejecutamos:
react-native run-android

react

Para IOS:
Recordar antes de iniciar en ios, abrir xcode para aceptar los terms of use.

react-native run-ios

react_ios

Happy React!.

React Native ?

i algo tenemos que reconocer que lo más importante es laexperiencia del usuario , de nada sirve la mejor usabilidad, la tecnología que nos permite desarrollar con facilidad o dificultad, o en más o menos tiempo, si eso no se traduce en una mejor experiencia de usuario de nada sirve.

En esta parte hay que reconocer que la experiencia de usuario es una tarea pendiente de los frameworks de aplicaciones que se apoyan en webviews para el resultado final.

React Native es un framework javascript para escribir aplicaciones nativas para ios y android. React Native es basado en la librería Reactjsde Facebook para desarrollar interfaces de usuarios, pero en vez de que enfocarse en el browser este se enfoca en plataformas móviles.

En pocas palabras un web developer que conozca Reactjs puede escribir aplicaciones móviles nativas desde Javascript tanto para iOS como Android.

Al igual que Reactjs, React Native usa JSX para definir las interfaces, internamente React Native sirve de puente entre las APIS de objective C o Java, para renderizar componentes utilizando el mismo motor nativo sin tener que utilizar webviews, además React Native, puede acceder a APIS del sistema como la cámara o gps etc.

Cual es la ventaja de React Native ?

Cordova , Ionic o Jquery Mobile que se apoyan en webviews para lograr su cometido, aunque esta solución funciona para muchos escenarios en otros casos queda corta con relación a el performance y experiencia de usuario debido al ser webviews tanto la interfaz de usuario, animaciones y comportamientos se realizan apoyándose HTML, Javascript y CSS.

React Native traduce nuestro JSX en elementos nativos de la plataforma, por tanto tendremos una aplicación nativa con comportamiento , interfaz animaciones nativas del sistema, como React Native es Javascript no es necesario recompilar la aplicacion para ver los cambios solo con “CMD+R” nos permite visualizar los cambios, como si fuera una aplicación web, además de no es necesario trabajar con XCode o Android Studio, puedes utilizar “Sublime Text, Visual Studio Code o Brackets”.

Ahora si como web developer conozco Reactjs entonces podemos compartir funcionalidades entre Web, IOS y Android.

Puedo usar React Native en Producción ?

Empresas como CBS Sports, Discovery Communications, Leanpub o la misma Facebook tienen soluciones en producción utilizando React Native.

Un punto a tomar en cuenta es que React Native es un proyecto joven apenas en Marzo 2015 surgió para iOS y en Septiembre para Android, la documentacion esta en continuo desarrollo debido a que algunas funcionalidades de iOS y Android aun no están soportadas, además de que no existe un documento de de buenas prácticas, que nos guíe durante el desarrollo.

Aun así, creo que a dia de hoy es la mejor respuesta a desarrollo de aplicaciones Nativas con Javascript.

🙂 Happy React!

© 2017 Danywalls

Tema por Anders NorénSubir ↑