Crea una cuenta o inicia sesi贸n

隆Contin煤a aprendiendo sin ning煤n costo! 脷nete y comienza a potenciar tu carrera

Tu primera aplicaci贸n con React Native

4/16
Recursos

Aportes 14

Preguntas 8

Ordenar por:

驴Quieres ver m谩s aportes, preguntas y respuestas de la comunidad? Crea una cuenta o inicia sesi贸n.

Hola, hola! Es una pena no haber tenido la oportunidad de manejar React Native CLI, pero de todas maneras creo que es una buena manera de poder iniciar en este tipo de Desarrollo (tomando en cuenta que Expo SDK ha recibido buenas actualizaciones 煤ltimamente).

Para quienes ya hayan manejado React Native CLI y Expo, pues las diferencias ser铆an las siguientes:

REACT NATIVE CLI:

Genera un proyecto con lo m铆nimo necesario para poder correr una App con la configuraci贸n de Android y iOS abierta.

Contiene el proyecto de Android y iOS de manera independiente con la opci贸n de poder escribir c贸digo nativo para cada plataforma.

Se necesita una Mac para el caso del control de iOS y dependencias (POD INSTALL) con Xcode.

EXPO CLI

  1. En expo no existen las carpetas de Android y iOS ya que el SDK se encarga de hacer los builds necesarios para cada plataforma.

  2. Puedes utilizar un template ya hecho sin necesidad de crear todo desde cero como pasa en RN CLI.

  3. Puedes correr tu proyecto sin necesidad de un $npx react-native run-android/ios. => Expo tiene un ambiente s煤per interesante para correr apps en un sitio web con Expo Snack o en su aplicativo m贸vil con Expo Go.

***RESUMEN: Si su proyecto necesita manejar un performance m谩s dedicado, lo mejor es utilizar RN CLI, pero si solo quieren probar la herramienta y no manipular alg煤na librer铆a, comportamiento, engine, etc; pues lo mejor es utilizar RN Expo.

Tuve problemas para instalar expo cli. Se hab铆a instalado bien pero no reconoc铆a el comando para consultar la versi贸n.
Entonces, abr铆 la l铆nea de comando e ingres茅:
'yarn global bin鈥
Y apareci贸 una ruta, copi茅 la ruta del archivo bin.

Luego ir a Propiedades> Configuraci贸n avanzada del sistema> Avanzado> Variables de entorno

Seleccionar el entorno Path, darle a editar y crear una nueva variable y pegarle la ruta.
Aceptar, aceptar y reiniciar la consola de comando. Ahora s铆 te reconocer谩 el comando para consultarla versi贸n

Qu茅 pena que no hayan usado React Native CLI !

Una verdadera Joya que 茅ste curso sea con Expo!
De cualquier manera el otro curso de Introducci贸n a React Native 2019, ocupan React Native CLI y iOS.

Me gustar铆a saber por que no usan React Native CLI ?

隆El curso ser谩 con expo! 馃槺 yo pensaba que ser铆a con el CLI

Si est谩s en mac y no te funciona el comando expo --version al instalar:

  • Revisa si en el PATH est谩 鈥.npm-global/bin鈥

Para saberlo, ejecuta el siguente comando en la consola:

echo $PATH
  • Si no est谩, debes agregarlo desde el archivo .bash_profile, de la siguiente manera (Yo uso nano, tu puedes usar VIM si deseas)
nano ~/.bash_profile
  • Una vez abierto el archivo, agrega la siguiente l铆nea al final.
export PATH=$PATH:~/.npm-global/bin
  • Finalmente, para cargarlo, ejecuta esta 煤ltima l铆nea en tu consola:
source ~/.bash_profile

Ya podr谩s ejecutar los comandos de expo.
Si algo de esto te suena muy intimidante, podr铆as pasarte por el curso de Terminal

Me hubiera gustado que hayan usado React Native CLI 馃槮

Pienso que en este cursos no usan React Native CLI, para simplificar la instalacion, ya que mucha gente se pierde cuando tiene que configurar JAVA y las variables de entorno globales como lo es el SDK de android studio.
Igualmente no esta de mas que se haga un curso avanzado donde se haga esta configuracion en todas las plataformas (Linux, Windows y Mac) para que no se pierdan.

Pasos para iniciar tu primer proyecto

Instalar gestor de dependencias yarn https://yarnpkg.com/getting-started/install

npm i -g yarn

Instalar herramienta de linea de comandos expo https://reactnative.dev/docs/environment-setup

yarn global add expo-cli

verificamos la instalaci贸n:

expo --version
expo-cli --version

crear proyecto react native

expo init myFirstProject

Para aquellos que tengan el siguiente error:

"No se puede cargar el archivo C:\Users\root\AppData\Roaming\npm\expo.ps1 porque la ejecuci贸n de scripts est谩 deshabilitada en este sistema."

Podremos solucionarlo con solo cambiar la directiva de ejecuci贸n 鈥淩estricted鈥 que viene por defecto en PowerShell.

Para ello debemos iniciar la terminal de comando como ADMINISTRADOR. Y luego ejecutar el siguiente comando:

""Set-ExecutionPolicy RemoteSigned""

De esta forma cualquier paquete que ejecute un script (como expo). Podr谩 hacerlo siempre y cuando sea un archivo de fuente confiable.

Ahora probamos el comando:

"expo --version"

Podremos ver numero de la versi贸n de Expo. (En mi caso 5.0.1)

Ya tenemos el problema solucionado. 鉁

隆Hola! Espero que mi aporte sea de mucho valor para aquellos que despu茅s de instalar en Mac:

yarn global add expo-cli

Y al verificar si expo se instal贸 correctamente ejecutando: expo --version; resulta que yo ejecutaba estos comandos desde iTerm2, pero volv铆 a hacer la instalaci贸n global ahora desde la terminal por defecto del sistema y al final me funcion贸 de maravilla.

Si tu directiva esta bloqueda en win, usa el sig commmand en powershell como admin: Set-ExecutionPolicy RemoteSigned

Si no quereis tener instalado Node y/o Expo para usar React Native, os comparto mi Dockerfile.

FROM node:16.13.2-alpine

WORKDIR /usr/src/app

COPY . .

RUN npm install --global expo-cli

EXPOSE 19006

Y luego para usarlo hay que crear la imagen con:

docker build -t expo:16.13.2-alpine .

Y usar crear el contenedor con:

docker run --rm
-p 19006:19006
-v $(PWD):/app
-w /app
-it expo:16.13.2-alpine bash

Pod茅is sustituir bash por comando npm y funcionar谩.