Me habría gustado saber esto antes de crear mis primeras apps móviles. Yo elegí React Native porque sabiendo React tenía mucho del camino listo para sentirme preparado y tener una aplicación con millones de descargas en tiempo record. Esta es una lista de features que quizás usará una aplicación y contarles sobre mi experiencia cambiando el chip del mundo web responsive al modo aplicación “nativa”.
Solo una pantalla que aunque puede tener diferentes tamaños siempre respeta la misma experiencia, aunque ya que escribes al mismo tiempo apps para iOS y Android lo más parecido a un Media Query es hacer un if entre plataformas.
No hay un componente que regularice los datos y tenga un formato estándar para su envío como FormData, mientras que si existe TextInput que tiene variedad de propiedades como por ejemplo que un campo se haga autofoco o que sea exclusivo para un password o email lo que me lleva al siguiente punto.
Especialmente para iOS hay muchos tipos de teclado que podemos asignar al Componente TextInput que mejoran muchísimo la experiencia como twitter, url o web-search y claro están los clásicos numéricos o de email.
Suena obvio pero aunque me tomó un par de minutos averiguar que existía es muy poderoso en la experiencia de tu aplicación y aun más si tu app tiene un header oscuro y si o si te preguntas cómo hacer que pase de color negro a blanco o más aun mostrar que se está haciendo una petición al API y muestre un icono de carga, este es el componente que necesitas StatusBar.
Aclaración: cambiarle el color es posible en Android pero poder ocupar todo el alto de la pantalla es nuevo para mi ❤️
Cuentas con herramientas como: depurar el código js con el acceso a una consola en el navegador donde puedes ver todos tus logs. Por ejemplo, si no estás seguro si enlazaste bien un evento. Pero lo mejor es tener Hot y Live Reload que es la característica para redibujar la app automáticamente cuando haces algún cambio.
Esto me funcionó genial en el emulador. Si vas a depurar en el teléfono, usa este tutorial de cómo activarlo que me resolvió la vida. Era cambiar un poco la referencia a mi IP dentro de la configuración de la app. Habría querido saberlo desde un inicio.
Para mi gran final les tengo el feature de React Native donde sinceramente me sentí un poco tonto al inicio, ListView.
React Native ya hizo el trabajo por ti de crear un componente de lista que recibe “cabeceras fixed” No tienes que odiarte para rehacerlo, Esto de las cabeceras fixed son algo que se ve mucho en las aplicaciones para ahorrar espacio y dar contexto de donde estar ubicado, solo tienes que utilizar las propiedad stickySectionHeadersEnabled
Cuando haces una lista normalmente pones un borde en la parte inferior de ellas para separarlas visualmente, esto en CSS lo resolvía usando pseudo elementos y pseudo clases al estilo :after o :last-child pero adivinen: No existe tal cosa en React Native, esto dolió mucho. pero el componente ListView pensó en todo y te trae renderSeparator que hace la magia por ti sin tener que pensar en no hacer el render de la último separador ya que esto lo hace automáticamente.
Expo viene includo en create-react-native-app es una forma fácil de arrancar con una aplicación y hacerle debug sin que el teléfono este conectado al computador y puedes compartir con un QR la aplicación en la que estas trabajando o subirla a su store donde cualquiera la podrá buscar por el nombre que elijas, Sin duda una gran opción pero eventualmente tendrás que hacer eject de la app para publicarla o si tienes que utilizar una dependencia que requiera código nativo en tu aplicación. Así que mi consejo aquí es que uses esta opción si vas a hacer una demo o quieres probar algo rápido. Si haces una app enserio ve por el camino tradicional desde un inicio.
Si te gustaría hacer aplicaciones con React Native Platzi te tiene el curso perfecto en https://platzi.com/cursos/react-native/. Tómalo y únete a los que crean experiencias móviles de valor.
¿Están cambiando de Swift/Java a React Native?
Si y no, estamos cambiando la forma en la que hacemos la UI, pero igual seguimos usando algunas cosas en Java/Objective C.
Para que te digo que no si si
Wooow siempre tomo sus consejos y seguro estare en ese curso. Gracias Leonidas
Lo que dices es bastante interesante, y acabo de reencontrar lo de “Cabeceras Sticky” nunca recuerdo ese nombre xD y lo llevo buscando un resto de tiempo. Gracias 😃
Ya está en mi lista 😄
Se necesita Xcode para app iOS con react Native?
Gracias
Como saber que tecnológica usar si se debe escoger entre react native o ionic 😕
En el caso del renderSeparator, ¿alguien sabe si existe la posibilidad de cambiar el estilo de los separadores o de las columnas? Un ejemplo sería que la linea no fuera gris, sino roja.