Saltar al contenido principal

53 publicaciones etiquetadas con "announcement"

Ver todas las etiquetas

Lanzamiento de React Native 0.59

· 7 min de lectura
Ryan Turner
Mantenedor Principal y Desarrollador de React Native
Traducción Beta No Oficial

Esta página fue traducida por PageTurner AI (beta). No está respaldada oficialmente por el proyecto. ¿Encontraste un error? Reportar problema →

¡Bienvenidos al lanzamiento de React Native 0.59! Esta es otra gran versión con 644 commits de 88 colaboradores. Las contribuciones también vienen en otras formas, así que gracias por mantener issues, fomentar comunidades y enseñar sobre React Native. Este mes trae varios cambios muy esperados, y esperamos que los disfruten.

🎣 Los Hooks han llegado

Los React Hooks forman parte de este lanzamiento, permitiéndote reutilizar lógica con estado entre componentes. Hay mucho entusiasmo sobre los hooks, pero si aún no los conoces, revisa estos excelentes recursos:

Asegúrate de probarlos en tus apps. Esperamos que encuentres la reutilización tan emocionante como nosotros.

📱 La JSC actualizada trae mejor rendimiento y soporte 64-bit en Android

React Native usa JSC (JavaScriptCore) para ejecutar tu aplicación. La JSC en Android estaba desactualizada, lo que significaba que muchas características modernas de JavaScript no eran compatibles. Peor aún, su rendimiento era inferior comparado con la JSC moderna de iOS. Con este lanzamiento, eso cambia.

Gracias al increíble trabajo de @DanielZlotin, @dulmandakh, @gengjiawen, @kmagiera y @kudo, JSC se ha actualizado. Esto incluye soporte 64-bit, compatibilidad con JavaScript moderno y grandes mejoras de rendimiento. Reconocimiento también por hacer esto un proceso mantenible para aprovechar futuras mejoras de WebKit sin tanto esfuerzo, y gracias a Software Mansion y Expo por hacer posible este trabajo.

💨 Lanzamientos más rápidos con inline requires

Queremos ayudar a tener apps React Native performantes por defecto y estamos trabajando para llevar las optimizaciones de Facebook a la comunidad. Las aplicaciones cargan recursos bajo demanda sin ralentizar el inicio. Esta función se llama "inline requires", permitiendo a Metro identificar componentes para carga diferida. Las apps con arquitecturas de componentes profundas y variadas verán mayor mejora.

código del archivo metro.config.js en la plantilla 0.59, mostrando dónde habilitar inlineRequires

Necesitamos que la comunidad pruebe esto antes de activarlo por defecto. Al actualizar a 0.59, verás un nuevo archivo metro.config.js; cambia la opción a true y danos tu feedback! Lee más sobre inline requires en la documentación de rendimiento para evaluar tu app.

🚅 Lean core está en marcha

React Native es un proyecto grande y complejo con un repositorio intrincado. Esto hace que la base de código sea menos accesible para colaboradores, difícil de probar y engorrosa como dependencia de desarrollo. Lean Core es nuestro esfuerzo para abordar estos problemas migrando código a bibliotecas separadas para una mejor gestión. Las últimas versiones han mostrado los primeros pasos de este proceso, pero es hora de ponernos serios.

Notarás que componentes adicionales ahora están oficialmente obsoletos. Esta es una gran noticia, ya que ahora existen responsables que mantienen activamente estas funcionalidades. Presta atención a los mensajes de advertencia y migra a las nuevas bibliotecas para estas características, porque se eliminarán en una versión futura. A continuación hay una tabla que indica el componente, su estado y dónde puedes migrar su uso.

Durante los próximos meses, muchos más componentes seguirán este camino hacia un núcleo más ligero. Buscamos ayuda con esto — visita el paraguas de Lean Core para colaborar.

👩🏽‍💻 Mejoras en la CLI

Las herramientas de línea de comandos de React Native son el punto de entrada de los desarrolladores al ecosistema, pero tenían problemas de larga data y carecían de soporte oficial. Las herramientas CLI se han trasladado a un nuevo repositorio, y un grupo dedicado de mantenedores ya ha realizado mejoras significativas.

Los logs ahora tienen un formato mucho mejor. Los comandos se ejecutan casi instantáneamente — notarás la diferencia inmediatamente:

La CLI de 0.58 es lenta al iniciarLa CLI de 0.59 es casi instantánea

🚀 Actualización a 0.59

Escuchamos vuestros comentarios sobre el proceso de actualización de React Native y estamos tomando medidas para mejorar la experiencia en futuras versiones. Para actualizar a 0.59, recomendamos usar rn-diff-purge para identificar los cambios entre vuestra versión actual de React Native y 0.59, luego aplicar esos cambios manualmente. Una vez actualizado vuestro proyecto a 0.59, podréis usar el comando mejorado react-native upgrade (¡basado en rn-diff-purge!) para actualizar a 0.60 y versiones posteriores a medida que estén disponibles.

🔨 Cambios disruptivos

El soporte para Android en 0.59 se ha actualizado siguiendo las últimas recomendaciones de Google, lo que podría causar problemas en aplicaciones existentes. Este problema podría manifestarse como un fallo en tiempo de ejecución con el mensaje: "You need to use a Theme.AppCompat theme (or descendant) with this activity". Recomendamos actualizar el archivo AndroidManifest.xml de vuestro proyecto, asegurando que el valor android:theme sea un tema AppCompat (como @style/Theme.AppCompat.Light.NoActionBar).

El comando react-native-git-upgrade se ha eliminado en 0.59 en favor del comando mejorado react-native upgrade.

🤗 Agradecimientos

Muchos nuevos colaboradores ayudaron con habilitar la generación de código nativo a partir de tipos Flow y resolver advertencias de Xcode - estas son excelentes formas de aprender cómo funciona React Native y contribuir al bien común. ¡Gracias! Estad atentos a problemas similares en el futuro.

Aunque estos son los aspectos más destacados que hemos señalado, hay muchos otros que te entusiasmarán. Para ver todas las actualizaciones, consulta el registro de cambios. 0.59 es un lanzamiento enorme: estamos deseando que lo pruebes.

Tenemos aún más mejoras planeadas para lo que resta del año. ¡Mantente atento!

Ryan y todo el equipo central de React Native

Actualización de código abierto de React Native marzo 2019

· 6 min de lectura
Christoph Nakazawa
Christoph Nakazawa
Former Engineer @ Facebook
Traducción Beta No Oficial

Esta página fue traducida por PageTurner AI (beta). No está respaldada oficialmente por el proyecto. ¿Encontraste un error? Reportar problema →

Anunciamos nuestra hoja de ruta de código abierto de React Native en el cuarto trimestre de 2018, tras decidir invertir más en la comunidad de código abierto de React Native.

Para nuestro primer hito, nos centramos en identificar y mejorar los aspectos más visibles de nuestra comunidad. Nuestros objetivos eran reducir las pull requests pendientes, disminuir la superficie del proyecto, identificar los problemas principales de los usuarios y establecer pautas para la gestión comunitaria.

En los últimos dos meses, logramos más progreso del esperado. Sigue leyendo para conocer los detalles:

Pull Requests

Para construir una comunidad saludable, debemos responder rápidamente a las contribuciones de código. En años anteriores, despriorizamos la revisión de contribuciones comunitarias y acumulamos 280 pull requests (diciembre 2018). En el primer hito, redujimos el número de pull requests abiertas a ~65. Simultáneamente, el promedio diario de pull requests abiertas aumentó de 3.5 a 7, lo que significa que hemos gestionado cerca de 600 pull requests en los últimos tres meses.

Fusionamos casi dos tercios y cerramos un tercio de las pull requests. Se cerraron sin fusionar cuando estaban obsoletas, eran de baja calidad o aumentaban innecesariamente la superficie del proyecto. La mayoría de las pull requests fusionadas corregían errores, mejoraban la paridad multiplataforma o introducían nuevas funcionalidades. Contribuciones destacadas incluyen mejoras en seguridad de tipos y el trabajo continuo para soportar AndroidX.

En Facebook, ejecutamos React Native desde la rama principal (master), por lo que probamos todos los cambios antes de que lleguen a una versión estable de React Native. De todas las pull requests fusionadas, solo seis causaron problemas: cuatro afectaron únicamente al desarrollo interno y dos fueron detectadas en estado de candidata a versión estable.

Una de las contribuciones comunitarias más visibles fue la pantalla "RedBox" actualizada. Es un buen ejemplo de cómo la comunidad está haciendo más amigable la experiencia del desarrollador.

Lean Core

React Native actualmente tiene una superficie muy amplia con muchas abstracciones sin mantenimiento que no usamos mucho en Facebook. Estamos trabajando en reducir la superficie para hacer React Native más pequeño y permitir que la comunidad cuide mejor de las abstracciones poco utilizadas en Facebook.

En el primer hito, pedimos ayuda a la comunidad para el proyecto Lean Core. La respuesta fue abrumadora y apenas pudimos seguir el ritmo del progreso. ¡Mira todo el trabajo completado en menos de un mes!

Lo que más nos entusiasma es que los mantenedores se han involucrado corrigiendo problemas de larga data, añadiendo pruebas y dando soporte a funcionalidades solicitadas desde hace tiempo. Estos módulos están recibiendo más apoyo que nunca dentro de React Native, demostrando que es un gran paso para la comunidad. Ejemplos de estos proyectos son WebView que ha recibido muchas pull requests desde su extracción, y la CLI que ahora es mantenida por miembros de la comunidad y ha recibido mejoras y correcciones muy necesarias.

Problemas principales de los usuarios

En diciembre, preguntamos a la comunidad qué les desagradaba de React Native. Consolidamos las respuestas y respondimos a cada uno de los problemas. Afortunadamente, muchos de los problemas que enfrenta nuestra comunidad también son relevantes en Facebook. En nuestro próximo hito, planeamos abordar algunos de los principales desafíos.

Uno de los problemas más votados fue la experiencia al actualizar a versiones más recientes de React Native. Lamentablemente, esto no es algo que experimentemos internamente porque ejecutamos React Native desde la rama principal. Afortunadamente, miembros de la comunidad ya han tomado la iniciativa para resolver este problema:

Lanzamiento de la versión 0.59

Sin la ayuda de la comunidad de React Native, especialmente Mike Grabowski y Lorenzo Sciandra, no podríamos gestionar los lanzamientos. Queremos mejorar el proceso de gestión de versiones y planeamos involucrarnos más a partir de ahora:

  • Colaboraremos con miembros de la comunidad para crear una publicación de blog para cada lanzamiento importante.

  • Mostraremos los cambios disruptivos directamente en la CLI cuando los usuarios actualicen a nuevas versiones.

  • Reduciremos el tiempo necesario para realizar un lanzamiento. Estamos explorando formas de aumentar las pruebas automatizadas y crear un plan de pruebas manuales mejorado.

Muchos de estos planes se incorporarán en el próximo lanzamiento de React Native 0.59. La versión 0.59 incluirá React Hooks, una nueva versión 64-bit de JavaScriptCore para Android, y numerosas mejoras de rendimiento y funcionalidad. Actualmente está disponible como candidata a lanzamiento y se espera que sea estable en las próximas dos semanas.

Próximos pasos

Durante los próximos dos meses, continuaremos gestionando pull requests para mantener el ritmo mientras comenzamos a reducir la cantidad de issues pendientes en GitHub. Seguiremos reduciendo la superficie de React Native mediante el proyecto Lean Core. Planeamos abordar 5 de los principales problemas de la comunidad. A medida que finalicemos las pautas comunitarias, centraremos nuestra atención en el sitio web y la documentación.

Estamos muy entusiasmados por recibir a más de diez colaboradores de nuestra comunidad en Facebook Londres en marzo para impulsar varios de estos esfuerzos. Nos alegra que utilicen React Native y esperamos que noten las mejoras en las que estamos trabajando durante 2019. Volveremos con otra actualización en unos meses y ¡mientras tanto estaremos fusionando sus pull requests! ⚛️✌️

El estado de la comunidad de React Native en 2018

· 5 min de lectura
Lorenzo Sciandra
Mantenedor Principal y Desarrollador de React Native
Traducción Beta No Oficial

Esta página fue traducida por PageTurner AI (beta). No está respaldada oficialmente por el proyecto. ¿Encontraste un error? Reportar problema →

En 2018, la comunidad de React Native realizó varios cambios en la forma en que desarrollamos y nos comunicamos sobre React Native. Creemos que dentro de unos años miraremos atrás y veremos que este cambio fue un punto de inflexión para React Native.

Mucha gente está entusiasmada con la reescritura de la arquitectura de React Native, ampliamente conocida como Fabric. Entre otras cosas, esto solucionará limitaciones fundamentales en la arquitectura de React Native y preparará a React Native para el éxito en el futuro junto con JSI y TurboModules.

El cambio más grande en 2018 fue empoderar a la comunidad de React Native. Desde el principio, Facebook animó a desarrolladores de todo el mundo a participar en el proyecto de código abierto de React Native. Desde entonces, surgieron varios colaboradores principales para manejar, entre otras cosas, el proceso de lanzamiento.

Estos miembros dieron algunos pasos sustanciales para que toda la comunidad tuviera más capacidad para moldear el futuro de este proyecto con los siguientes recursos:

react-native-releases 📬

Este repositorio, creado en enero, tiene el doble propósito de permitir que todos puedan mantenerse al día con los nuevos lanzamientos de manera más colaborativa y abrió la conversación sobre qué formaría parte de un determinado lanzamiento a cualquier persona que quisiera sugerir un cherry-pick (como en 0.57.8 y todas sus versiones anteriores).

Esta ha sido la fuerza impulsora detrás del abandono de un ciclo de lanzamiento mensual y el enfoque de "soporte a largo plazo" que se usa actualmente para la versión 0.57.x.

La mitad del mérito por llegar a estas decisiones se debe al otro repositorio creado este año:

discussions-and-proposals 🗣

Este repositorio, creado en julio, amplió la idea de un entorno más abierto para conversaciones sobre React Native. Anteriormente, esta necesidad se manejaba con issues etiquetados como For Discussion en el repositorio principal, pero queríamos expandir esta estrategia a un enfoque de RFC que otras bibliotecas tienen (por ejemplo, React).

Este experimento encontró inmediatamente su papel en el ciclo de vida de React Native. El equipo de Facebook ahora está utilizando el proceso de RFC de la comunidad para discutir qué se podría mejorar en React Native y coordinar los esfuerzos en torno al proyecto Lean Core, entre otras discusiones interesantes.

@ReactNativeComm 🐣

Somos conscientes de que nuestro enfoque para comunicar estos esfuerzos no ha sido tan efectivo como nos hubiera gustado, y en un intento de facilitarles a todos el seguimiento de todo lo que sucede en la comunidad de React Native (desde lanzamientos hasta discusiones activas), creamos una nueva cuenta de Twitter en la que pueden confiar: @ReactNativeComm.

Si no estás en esa red social, recuerda que siempre puedes ver los repositorios a través de GitHub; esta función mejoró en los últimos meses con la posibilidad de ser notificado solo por lanzamientos, por lo que deberías considerar usarla de todos modos.

Lo que espera por delante 🎓

Durante los últimos 7-8 meses, los colaboradores principales mejoraron la organización React Native Community en GitHub para asumir más responsabilidad en el desarrollo de React Native y mejorar la colaboración con Facebook. Pero esto siempre careció de la estructura formal que proyectos similares pueden tener establecida.

Esta organización puede servir de ejemplo para toda la comunidad de desarrolladores al establecer estándares para todos los paquetes/repositorios que alberga, proporcionando un lugar centralizado donde los mantenedores puedan ayudarse mutuamente y contribuir con código de calidad que cumpla con los estándares acordados por la comunidad.

A principios de 2019, tendremos implementadas estas nuevas directrices. Comparte tu opinión en la discusión dedicada.

Confiamos que con estos cambios la comunidad será más colaborativa, de modo que cuando alcancemos la versión 1.0, todos podremos seguir creando aplicaciones (aún más) increíbles aprovechando este esfuerzo conjunto 🤗


Espero que estés tan entusiasmado como nosotros con el futuro de esta comunidad. Nos emociona ver tu participación, ya sea en las conversaciones de los repositorios mencionados o mediante el excelente código que producirás.

¡Feliz codificación!

Hoja de Ruta de Código Abierto

· 5 min de lectura
Héctor Ramos
Ingeniero en Facebook
Traducción Beta No Oficial

Esta página fue traducida por PageTurner AI (beta). No está respaldada oficialmente por el proyecto. ¿Encontraste un error? Reportar problema →

Este año, el equipo de React Native se ha enfocado en una re-arquitectura a gran escala de React Native. Como mencionó Sophie en su publicación sobre el estado de React Native, hemos esbozado un plan para apoyar mejor a la creciente comunidad de usuarios y colaboradores de React Native fuera de Facebook. Ahora es momento de compartir más detalles sobre nuestro trabajo. Antes de hacerlo, me gustaría exponer nuestra visión a largo plazo para React Native en código abierto.

Nuestra visión para React Native es...

  • Un repositorio de GitHub saludable. Los problemas y solicitudes de extracción se gestionan en un plazo razonable.

    • Mayor cobertura de pruebas.
    • Los commits sincronizados desde el repositorio interno de Facebook no deben romper las pruebas de código abierto.
    • Una mayor escala de contribuciones significativas de la comunidad.
  • APIs estables, que faciliten la integración con dependencias de código abierto.

    • Facebook utiliza la misma API pública que el código abierto.
    • Lanzamientos de React Native que sigan el versionado semántico.
  • Un ecosistema vibrante. ViewManagers de alta calidad, módulos nativos y soporte multiplataforma mantenidos por la comunidad.

  • Documentación excelente. Enfocada en ayudar a los usuarios a crear experiencias de alta calidad, con documentos de referencia de API actualizados.

Hemos identificado las siguientes áreas prioritarias para alcanzar esta visión.

✂️ Lean Core (Núcleo Ligero)

Nuestro objetivo es reducir la superficie de React Native eliminando componentes no esenciales y sin uso. Transferiremos componentes no esenciales a la comunidad para permitirle avanzar más rápido. La superficie reducida facilitará la gestión de contribuciones a React Native.

WebView es un ejemplo de componente que transferimos a la comunidad. Estamos trabajando en un flujo que permita a los equipos internos seguir usando estos componentes tras eliminarlos del repositorio. Hemos identificado docenas de componentes adicionales cuya propiedad transferiremos a la comunidad.

🎁 Código Abierto de los Internos y 🛠Actualización de Herramientas

La experiencia de desarrollo de React Native para equipos de producto en Facebook puede diferir bastante de la de código abierto. Herramientas populares en la comunidad de código abierto no se usan en Facebook. Puede existir una herramienta interna que cumple el mismo propósito. En algunos casos, los equipos de Facebook se han acostumbrado a herramientas que no existen fuera de la compañía. Estas diferencias plantean desafíos al liberar como código abierto nuestro próximo trabajo de arquitectura.

Trabajaremos en liberar algunas de estas herramientas internas. También mejoraremos el soporte para herramientas populares en la comunidad de código abierto. Esta es una lista no exhaustiva de proyectos que abordaremos:

  • Liberar JSI como código abierto y permitir que la comunidad utilice sus propias máquinas virtuales JavaScript, reemplazando el JavaScriptCore inicial de RN. Cubriremos qué es JSI en una futura publicación; mientras tanto puedes aprender más sobre JSI en la charla de Parashuram en React Conf.

  • Soporte para bibliotecas de 64 bits en Android.

  • Habilitar depuración bajo la nueva arquitectura.

  • Mejorar soporte para CocoaPods, Gradle, Maven y el nuevo sistema de compilación de Xcode.

✅ Infraestructura de Pruebas

Cuando los ingenieros de Facebook publican código, se considera seguro si pasa todas las pruebas. Estas pruebas identifican si un cambio podría romper alguna de nuestras propias implementaciones de React Native. Sin embargo, existen diferencias en cómo Facebook utiliza React Native. Esto nos ha permitido romper involuntariamente React Native en código abierto.

Reforzaremos nuestras pruebas internas para garantizar que se ejecuten en un entorno lo más cercano posible al código abierto. Esto ayudará a evitar que el código que rompa estas pruebas llegue a código abierto. También trabajaremos en infraestructura para mejorar las pruebas del repositorio principal en GitHub, permitiendo que futuras pull requests incluyan pruebas fácilmente.

Combinado con la reducción de la superficie de código, esto permitirá a los colaboradores fusionar pull requests más rápido y con confianza.

📜 API Pública

Facebook consumirá React Native a través de la API pública, igual que el código abierto, para reducir cambios disruptivos no intencionales. Hemos comenzado a convertir sitios de llamadas internas para abordar esto. Nuestro objetivo es converger en una API pública estable, llevando a la adopción de versionamiento semántico en la versión 1.0.

📣 Comunicación

React Native es uno de los principales proyectos de código abierto en GitHub por cantidad de colaboradores. Eso nos hace muy felices y queremos mantenerlo. Continuaremos trabajando en iniciativas que fomenten la participación de colaboradores, como mayor transparencia y discusión abierta. La documentación es lo primero que encuentra alguien nuevo en React Native, pero no ha sido prioridad. Queremos solucionarlo comenzando con:

Cronograma

Planeamos implementar estos proyectos durante el próximo año aproximadamente. Algunos esfuerzos ya están en curso, como JSI que ya está en código abierto. Otros tomarán más tiempo, como reducir la superficie de código. Haremos nuestro mejor esfuerzo para mantener a la comunidad actualizada sobre nuestro progreso. Únanse a nosotros en el repositorio Discusiones y Propuestas, una iniciativa de la comunidad React Native que ha llevado a crear varias de las iniciativas discutidas en esta hoja de ruta.

Lanzamiento de la versión 0.56

· 6 min de lectura
Lorenzo Sciandra
Mantenedor principal y desarrollador de React Native en Drivetribe
Traducción Beta No Oficial

Esta página fue traducida por PageTurner AI (beta). No está respaldada oficialmente por el proyecto. ¿Encontraste un error? Reportar problema →

La tan esperada versión 0.56 de React Native ya está disponible 🎉. Esta entrada de blog destaca algunos de los cambios introducidos en esta nueva versión. También queremos aprovechar para explicar en qué hemos estado ocupados desde marzo.

El dilema de los cambios que rompen compatibilidad, o, "¿cuándo lanzar?"

La Guía del colaborador explica el proceso de integración por el que pasan todos los cambios en React Native. El proyecto está compuesto por muchas herramientas diferentes, que requieren coordinación y soporte constante para que todo funcione correctamente. Si añadimos la vibrante comunidad de código abierto que contribuye al proyecto, obtendrán una idea de la escala alucinante que todo esto supone.

Con la impresionante adopción de React Native, los cambios que rompen compatibilidad deben hacerse con mucho cuidado, y el proceso no es tan fluido como nos gustaría. Se decidió omitir los lanzamientos de abril y mayo para permitir que el equipo central integrara y probara un nuevo conjunto de cambios que rompen compatibilidad. Se utilizaron canales de comunicación dedicados con la comunidad para garantizar que el lanzamiento de junio de 2018 (0.56.0) sea lo más sencillo posible de adoptar para quienes esperaron pacientemente la versión estable.

¿Es 0.56.0 perfecta? No, como cualquier otro software: pero hemos alcanzado un punto donde el equilibrio entre "esperar más estabilidad" versus "las pruebas dieron resultados exitosos y podemos avanzar" nos hace sentir preparados para lanzarla. Además, somos conscientes de algunos problemas que no se resolvieron en la versión final de 0.56.0. La mayoría de desarrolladores no deberían tener problemas al actualizar a 0.56.0. Para quienes estén bloqueados por los problemas mencionados, esperamos verles en nuestras discusiones y estamos deseando trabajar con ustedes en soluciones para estos problemas.

Pueden considerar 0.56.0 como un bloque fundamental hacia un marco más estable: probablemente tomará una o dos semanas de adopción generalizada antes de que se pulan todos los casos extremos, pero esto conducirá a un lanzamiento aún mejor en julio de 2018 (0.57.0).

Nos gustaría concluir esta sección agradeciendo a los 67 colaboradores que trabajaron en un total de 818 commits (!) que ayudarán a mejorar sus aplicaciones 👏.

Y ahora, sin más preámbulos...

Los grandes cambios

Babel 7

Como quizá sepan, la herramienta de transpilación que nos permite usar las últimas y mejores características de JavaScript, Babel, está migrando a v7 próximamente. Dado que esta nueva versión trae cambios importantes, consideramos que ahora es un buen momento para actualizar, permitiendo que Metro aproveche sus mejoras.

Si tienen problemas con la actualización, consulten la sección de documentación relacionada.

Modernización del soporte para Android

En Android, gran parte del ecosistema de herramientas ha cambiado. Hemos actualizado a Gradle 3.5, Android SDK 26, Fresco a 1.9.0 y OkHttp a 3.10.0, e incluso el NDK API target a API 16. Estos cambios deberían implementarse sin problemas y resultarán en builds más rápidos. Más importante aún, ayudará a los desarrolladores a cumplir con los nuevos requisitos de Play Store que entrarán en vigor el próximo mes.

Relacionado con esto, nos gustaría agradecer especialmente a Dulmandakh por los numerosos PRs enviados para hacerlo posible 👏.

Quedan más pasos por tomar en esta dirección, y puedes seguir la planificación futura y discusión sobre la actualización del soporte para Android en el issue dedicado (y otro adicional para JSC).

Nuevas versiones de Node, Xcode, React y Flow ¡oh my!

Node 8 es ahora el estándar para React Native. En realidad ya se estaba probando, pero nos hemos comprometido completamente ahora que Node 6 entró en modo mantenimiento. React también se actualizó a 16.4, que trae consigo una gran cantidad de correcciones.

Estamos eliminando el soporte para iOS 8, haciendo que iOS 9 sea la versión más antigua que se puede targetear. No prevemos que esto sea un problema, ya que cualquier dispositivo que ejecute iOS 8 puede actualizarse a iOS 9. Este cambio nos permitió eliminar código poco utilizado que implementaba soluciones alternativas para dispositivos antiguos con iOS 8.

La cadena de herramientas de integración continua se ha actualizado para usar Xcode 9.4, asegurando que todas las pruebas de iOS se ejecuten en las herramientas de desarrollo más recientes proporcionadas por Apple.

Hemos actualizado a Flow 0.75 para usar el nuevo formato de errores que muchos desarrolladores aprecian. También hemos creado tipos para muchos más componentes. Si aún no aplicas tipado estático en tu proyecto, considera usar Flow para identificar problemas durante el desarrollo en lugar de en tiempo de ejecución.

Y muchas otras cosas...

Por ejemplo, YellowBox fue reemplazado con una nueva implementación que mejora mucho la depuración.

Para las notas completas de la versión, consulta el changelog completo aquí. Y recuerda revisar la guía de actualización para evitar problemas al migrar a esta nueva versión.


Una nota final: a partir de esta semana, el equipo central de React Native reanudará las reuniones mensuales. Nos aseguraremos de mantener a todos actualizados sobre lo tratado, y consideraremos sus comentarios para futuras reuniones.

¡Feliz coding a todos!

Lorenzo, Ryan, y todo el equipo central de React Native

PD: como siempre, queremos recordar que React Native sigue en versión 0.x debido a los muchos cambios en curso. Al actualizar, recuerden que sí, probablemente algo podría fallar o romperse. Sean colaborativos en los issues y al enviar PRs, y recuerden seguir el CoC: siempre hay una persona al otro lado de la pantalla.

Un ritmo de lanzamientos mensual: Lanzamiento de diciembre y el candidato de enero

· 3 min de lectura
Eric Vicenti
Ingeniero en Facebook
Traducción Beta No Oficial

Esta página fue traducida por PageTurner AI (beta). No está respaldada oficialmente por el proyecto. ¿Encontraste un error? Reportar problema →

Poco después de que se introdujera React Native, comenzamos a realizar lanzamientos cada dos semanas para ayudar a la comunidad a adoptar nuevas características, manteniendo las versiones estables para uso en producción. En Facebook, teníamos que estabilizar la base de código cada dos semanas para el lanzamiento de nuestras aplicaciones iOS de producción, por lo que decidimos publicar las versiones de código abierto con el mismo ritmo. Ahora, muchas aplicaciones de Facebook se publican una vez por semana, especialmente en Android. Como publicamos desde la rama principal semanalmente, necesitamos mantenerla bastante estable. Por lo tanto, el ritmo de lanzamiento quincenal ya ni siquiera beneficia a los colaboradores internos.

Con frecuencia recibimos comentarios de la comunidad indicando que es difícil seguir el ritmo de los lanzamientos. Herramientas como Expo tuvieron que omitir versiones alternas para gestionar los cambios rápidos. Así que está claro que los lanzamientos quincenales no sirvieron bien a la comunidad.

Ahora lanzamos mensualmente

Nos complace anunciar el nuevo ritmo de lanzamientos mensuales, y la versión de diciembre de 2016, v0.40, que se ha estado estabilizando durante el último mes y está lista para adoptar. (Solo asegúrate de actualizar los encabezados en tus módulos nativos de iOS).

Aunque podría variar unos días para evitar fines de semana o manejar problemas imprevistos, ahora puedes esperar que cada lanzamiento esté disponible el primer día del mes y se publique oficialmente el último día.

Usa el mes actual para el mejor soporte

El candidato de lanzamiento de enero está listo para probar, y puedes ver las novedades aquí.

Para ver los próximos cambios y proporcionar mejor retroalimentación a los colaboradores de React Native, utiliza siempre el candidato de lanzamiento del mes actual cuando sea posible. Cuando cada versión se publique a finales de mes, los cambios que contiene ya habrán estado en producción en las aplicaciones de Facebook durante más de dos semanas.

Puedes actualizar fácilmente tu aplicación con el nuevo comando react-native-git-upgrade:

npm install -g react-native-git-upgrade
react-native-git-upgrade 0.41.0-rc.0

¡Esperamos que este enfoque más simple facilite a la comunidad seguir los cambios en React Native y adoptar nuevas versiones lo más rápido posible!

(Agradecemos a Martin Konicek por idear este plan y a Mike Grabowski por hacerlo realidad)

Actualizaciones más sencillas gracias a Git

· 5 min de lectura
Nicolas Cuillery
Consultor y formador de JavaScript en Zenika
Traducción Beta No Oficial

Esta página fue traducida por PageTurner AI (beta). No está respaldada oficialmente por el proyecto. ¿Encontraste un error? Reportar problema →

Actualizar a nuevas versiones de React Native siempre ha sido complicado. Probablemente te has encontrado con algo así antes:

Ninguna de estas opciones es ideal. Si sobrescribimos el archivo, perdemos nuestros cambios locales. Si no sobrescribimos, no obtenemos las últimas actualizaciones.

Hoy me complace presentar una nueva herramienta que ayuda a resolver este problema. Se llama react-native-git-upgrade y utiliza Git en segundo plano para resolver conflictos automáticamente siempre que sea posible.

Uso

Requisito: Git debe estar disponible en el PATH. Tu proyecto no necesita estar gestionado por Git.

Instala react-native-git-upgrade globalmente:

$ npm install -g react-native-git-upgrade

o usando Yarn:

$ yarn global add react-native-git-upgrade

Luego, ejecútalo dentro del directorio de tu proyecto:

$ cd MyProject
$ react-native-git-upgrade 0.38.0

Nota: No ejecutes 'npm install' para instalar una nueva versión de react-native. La herramienta necesita poder comparar la plantilla de proyecto antigua y la nueva para funcionar correctamente. Simplemente ejecútala dentro de la carpeta de tu aplicación como se muestra arriba, manteniéndote en la versión anterior.

Ejemplo de salida:

También puedes ejecutar react-native-git-upgrade sin argumentos para actualizar a la última versión de React Native.

Intentamos preservar tus cambios en los archivos de compilación de Android e iOS, por lo que no necesitas ejecutar react-native link después de una actualización.

Hemos diseñado la implementación para que sea lo menos intrusiva posible. Se basa completamente en un repositorio Git local creado sobre la marcha en un directorio temporal. No interferirá con tu repositorio de proyecto (sin importar qué VCS uses: Git, SVN, Mercurial... o ninguno). Tus fuentes se restauran en caso de errores inesperados.

¿Cómo funciona?

El paso clave es generar un parche de Git. Este parche contiene todos los cambios realizados en las plantillas de React Native entre la versión que usa tu aplicación y la nueva versión.

Para obtener este parche, necesitamos generar una aplicación a partir de las plantillas incluidas en el paquete react-native dentro de tu directorio node_modules (estas son las mismas plantillas que usa el comando react-native init). Luego, después de generar las aplicaciones nativas desde las plantillas tanto en la versión actual como en la nueva, Git puede producir un parche adaptado a tu proyecto (es decir, que incluye el nombre de tu aplicación):

[...]

diff --git a/ios/MyAwesomeApp/Info.plist b/ios/MyAwesomeApp/Info.plist
index e98ebb0..2fb6a11 100644
--- a/ios/MyAwesomeApp/Info.plist
+++ b/ios/MyAwesomeApp/Info.plist
@@ -45,7 +45,7 @@
<dict>
<key>localhost</key>
<dict>
- <key>NSTemporaryExceptionAllowsInsecureHTTPLoads</key>
+ <key>NSExceptionAllowsInsecureHTTPLoads</key>
<true/>
</dict>
</dict>
[...]

Ahora solo necesitamos aplicar este parche a tus archivos fuente. Mientras que el antiguo proceso react-native upgrade te pedía confirmación para cada pequeña diferencia, Git puede fusionar automáticamente la mayoría de los cambios usando su algoritmo de fusión de 3 vías, dejándonos eventualmente con delimitadores de conflicto familiares:

    13B07F951A680F5B00A75B9A /* Release */ = {
isa = XCBuildConfiguration;
buildSettings = {
ASSETCATALOG_COMPILER_APPICON_NAME = AppIcon;
<<<<<<< ours
CODE_SIGN_IDENTITY = "iPhone Developer";
FRAMEWORK_SEARCH_PATHS = (
"$(inherited)",
"$(PROJECT_DIR)/HockeySDK.embeddedframework",
"$(PROJECT_DIR)/HockeySDK-iOS/HockeySDK.embeddedframework",
);
=======
CURRENT_PROJECT_VERSION = 1;
>>>>>>> theirs
HEADER_SEARCH_PATHS = (
"$(inherited)",
/Applications/Xcode.app/Contents/Developer/Toolchains/XcodeDefault.xctoolchain/usr/include,
"$(SRCROOT)/../node_modules/react-native/React/**",
"$(SRCROOT)/../node_modules/react-native-code-push/ios/CodePush/**",
);

Estos conflictos suelen ser fáciles de entender. El delimitador ours representa a "tu equipo" mientras que theirs puede verse como "el equipo de React Native".

¿Por qué introducir un nuevo paquete global?

React Native incluye una CLI global (el paquete react-native-cli) que delega comandos en la CLI local integrada en el directorio node_modules/react-native/local-cli.

Como mencionamos anteriormente, el proceso debe iniciarse desde tu versión actual de React Native. Si hubiéramos integrado la implementación en la CLI local, no podrías disfrutar de esta característica al usar versiones antiguas de React Native. Por ejemplo, no podrías actualizar de la versión 0.29.2 a la 0.38.0 si este nuevo código de actualización solo se hubiera lanzado en la 0.38.0.

La actualización basada en Git es una gran mejora en la experiencia del desarrollador y es importante ponerla a disposición de todos. Al usar un paquete separado react-native-git-upgrade instalado globalmente, puedes utilizar este nuevo código hoy sin importar qué versión de React Native esté utilizando tu proyecto.

Otra razón es la reciente eliminación de Yeoman por Martin Konicek. No queríamos volver a incluir esas dependencias de Yeoman en el paquete de react-native para poder evaluar la plantilla antigua y así crear el parche.

Pruébalo y danos tu opinión

Para concluir, me gustaría decir: disfruta de esta característica y no dudes en sugerir mejoras, informar sobre problemas y especialmente enviar pull requests. Cada entorno es un poco diferente y cada proyecto de React Native es único, por lo que necesitamos tu opinión para que esto funcione bien para todos.

¡Gracias!

Me gustaría agradecer a las increíbles empresas Zenika y M6 Web (archivado) sin las cuales nada de esto habría sido posible!

Presentamos Button, instalaciones más rápidas con Yarn y una hoja de ruta pública

· 4 min de lectura
Héctor Ramos
Héctor Ramos
Former Developer Advocate @ Facebook
Traducción Beta No Oficial

Esta página fue traducida por PageTurner AI (beta). No está respaldada oficialmente por el proyecto. ¿Encontraste un error? Reportar problema →

Mucha gente nos ha comentado que hay tanto trabajo en React Native que puede ser difícil seguir todo lo que ocurre. Para ayudar a comunicar qué trabajo está en progreso, ahora publicamos una hoja de ruta para React Native. A grandes rasgos, este trabajo se puede dividir en tres prioridades:

  • Bibliotecas principales. Añadir más funcionalidad a los componentes y APIs más útiles.

  • Estabilidad. Mejorar la infraestructura subyacente para reducir errores y mejorar la calidad del código.

  • Experiencia del desarrollador. Ayudar a los desarrolladores de React Native a ser más productivos.

Si tienes sugerencias de características que crees que serían valiosas en la hoja de ruta, visita Canny, donde puedes proponer nuevas funcionalidades y debatir propuestas existentes.

Novedades en React Native

La versión 0.37 de React Native, publicada hoy, incluye un nuevo componente central que facilita enormemente añadir un botón táctil a cualquier aplicación. También presentamos soporte para el nuevo gestor de paquetes Yarn, que acelerará todo el proceso de actualizar las dependencias de tu aplicación.

Presentamos Button

Hoy presentamos un componente básico <Button /> que tiene un aspecto excelente en todas las plataformas. Esto responde a uno de los comentarios más recurrentes que recibimos: React Native es uno de los pocos kits de desarrollo móvil que no incluye un botón listo para usar desde el primer momento.

Botón simple en Android e iOS

<Button
onPress={onPressMe}
title="Press Me"
accessibilityLabel="Learn more about this Simple Button"
/>

Los desarrolladores experimentados de React Native saben cómo crear un botón: usan TouchableOpacity para la apariencia predeterminada en iOS, TouchableNativeFeedback para el efecto de onda en Android, y luego aplican algunos estilos. Los botones personalizados no son especialmente difíciles de construir o instalar, pero nuestro objetivo es que React Native sea radicalmente fácil de aprender. Al añadir un botón básico al núcleo, los recién llegados podrán desarrollar algo impresionante en su primer día, en lugar de perder ese tiempo formateando un botón y aprendiendo los matices de los componentes táctiles.

Button está diseñado para funcionar perfectamente y verse nativo en todas las plataformas, por lo que no incluirá todas las funcionalidades avanzadas que tienen los botones personalizados. Es un excelente punto de partida, pero no pretende reemplazar todos tus botones existentes. Para más detalles, consulta la nueva documentación de Button, ¡que incluye un ejemplo ejecutable!

Acelera react-native init con Yarn

Ahora puedes usar Yarn, el nuevo gestor de paquetes para JavaScript, para acelerar significativamente react-native init. Para notar la diferencia, instala yarn y actualiza tu react-native-cli a la versión 1.2.0:

$ npm install -g react-native-cli

Ahora deberías ver "Using yarn" al configurar nuevas aplicaciones:

Usando yarn

En pruebas locales simples, react-native init finalizó en aproximadamente 1 minuto con buena conexión (frente a unos 3 minutos usando npm 3.10.8). Instalar yarn es opcional pero muy recomendable.

¡Gracias!

Agradecemos a todos los que contribuyeron a esta versión. Las notas de la versión completas ya están disponibles en GitHub. Con más de dos docenas de correcciones de errores y nuevas funcionalidades, React Native sigue mejorando gracias a ustedes.

0.36: Headless JS, la API del teclado y más

· 3 min de lectura
Héctor Ramos
Héctor Ramos
Former Developer Advocate @ Facebook
Traducción Beta No Oficial

Esta página fue traducida por PageTurner AI (beta). No está respaldada oficialmente por el proyecto. ¿Encontraste un error? Reportar problema →

Hoy lanzamos React Native 0.36. Sigue leyendo para conocer las novedades.

Headless JS

Headless JS permite ejecutar tareas en JavaScript mientras tu aplicación está en segundo plano. Puede usarse, por ejemplo, para sincronizar datos nuevos, gestionar notificaciones push o reproducir música. Por ahora, solo está disponible en Android.

Para comenzar, define tu tarea asíncrona en un archivo dedicado (ej. SomeTaskName.js):

module.exports = async taskData => {
// Perform your task here.
};

Luego, registra tu tarea en AppRegistry:

AppRegistry.registerHeadlessTask('SomeTaskName', () =>
require('SomeTaskName'),
);

Usar Headless JS requiere escribir código nativo Java para iniciar el servicio cuando sea necesario. ¡Consulta nuestra nueva documentación de Headless JS para aprender más!

La API del teclado

Ahora es más fácil trabajar con el teclado en pantalla usando Keyboard. Puedes escuchar eventos nativos del teclado y responder a ellos. Por ejemplo, para ocultar el teclado activo, simplemente llama a Keyboard.dismiss():

import {Keyboard} from 'react-native';

// Hide that keyboard!
Keyboard.dismiss();

División animada

React Native ya admitía combinar valores animados mediante suma, multiplicación y módulo. Con la versión 0.36, ahora es posible combinar valores animados mediante división. Hay casos donde un valor animado necesita invertir otro valor animado para cálculos. Por ejemplo, al invertir una escala (2x --> 0.5x):

const a = Animated.Value(1);
const b = Animated.divide(1, a);

Animated.spring(a, {
toValue: 2,
}).start();

b seguirá entonces la animación de resorte de a y producirá el valor de 1 / a.

El uso básico es así:

<Animated.View style={{transform: [{scale: a}]}}>
<Animated.Image style={{transform: [{scale: b}]}} />
<Animated.View>

En este ejemplo, la imagen interna no se deformará porque la escala del elemento padre se cancela. Si quieres aprender más, consulta la guía de animaciones.

Barras de estado oscuras

Se ha añadido un nuevo valor barStyle a StatusBar: dark-content. Con esto, ahora puedes usar barStyle tanto en Android como en iOS. El comportamiento será:

  • default: Usa el valor predeterminado de la plataforma (claro en iOS, oscuro en Android).

  • light-content: Barra de estado clara con texto e iconos negros.

  • dark-content: Barra de estado oscura con texto e iconos blancos.

...y más

Esto es solo una muestra de los cambios en 0.36. Consulta las notas de lanzamiento en GitHub para ver la lista completa de nuevas funciones, correcciones de errores y cambios importantes.

Puedes actualizar a la versión 0.36 ejecutando estos comandos en la terminal:

$ npm install --save react-native@0.36
$ react-native upgrade

Hacia una mejor documentación

· 5 min de lectura
Kevin Lacker
Engineering Manager en Facebook
Traducción Beta No Oficial

Esta página fue traducida por PageTurner AI (beta). No está respaldada oficialmente por el proyecto. ¿Encontraste un error? Reportar problema →

Parte de una gran experiencia para desarrolladores es contar con una excelente documentación. Crear buenos documentos requiere mucho: la documentación ideal debe ser concisa, útil, precisa, completa y atractiva. Recientemente hemos trabajado arduamente para mejorar la documentación basándonos en sus comentarios, y queremos compartir algunas de las mejoras que hemos implementado.

Ejemplos integrados

Cuando aprendes una nueva biblioteca, lenguaje de programación o framework, hay un hermoso momento en que escribes un poco de código, lo pruebas, ves si funciona... y realmente funciona. Has creado algo real. Queríamos llevar esa experiencia visceral directamente a nuestra documentación. Así:

import React, { Component } from 'react';
import { AppRegistry, Text, View } from 'react-native';

class ScratchPad extends Component {
render() {
return (
<View style={{flex: 1}}>
<Text style={{fontSize: 30, flex: 1, textAlign: 'center'}}>
Isn't this cool?
</Text>
<Text style={{fontSize: 100, flex: 1, textAlign: 'center'}}>
👍
</Text>
</View>
);
}
}

AppRegistry.registerComponent('ScratchPad', () => ScratchPad);

Creemos que estos ejemplos integrados, que usan el módulo react-native-web-player con ayuda de Devin Abbott, son una excelente forma de aprender los fundamentos de React Native. Hemos actualizado nuestro tutorial para nuevos desarrolladores de React Native para usarlos siempre que sea posible. Échale un vistazo: si alguna vez has sentido curiosidad por ver qué pasaría si modificas solo un fragmento del código de ejemplo, esta es una forma genial de experimentar. Además, si estás construyendo herramientas para desarrolladores y quieres mostrar muestras en vivo de React Native en tu sitio, react-native-web-player puede simplificarlo.

El motor central de simulación lo proporciona el proyecto react-native-web de Nicolas Gallagher, que permite mostrar componentes de React Native como Text y View en la web. Explora react-native-web si te interesa crear experiencias móviles y web que compartan gran parte de la base de código.

Guías mejoradas

En algunas partes de React Native existen múltiples formas de hacer las cosas, y hemos recibido comentarios de que podríamos ofrecer mejores orientaciones.

Tenemos una nueva guía de Navegación que compara los diferentes enfoques y recomienda qué deberías usar: Navigator, NavigatorIOS, NavigationExperimental. A mediano plazo, estamos trabajando para mejorar y consolidar esas interfaces. A corto plazo, esperamos que esta guía mejorada facilite tu trabajo.

También tenemos una nueva guía sobre manejo de toques que explica conceptos básicos para crear interfaces similares a botones, y un resumen breve de las diferentes formas de manejar eventos táctiles.

Otra área en la que trabajamos es Flexbox. Esto incluye tutoriales sobre cómo manejar diseño con Flexbox y cómo controlar el tamaño de componentes. También incluye una lista poco glamorosa pero útil de todas las props que controlan el diseño en React Native.

Comenzando

Al comenzar a configurar un entorno de desarrollo de React Native en tu máquina, necesitas instalar y configurar varios elementos. Es difícil que la instalación sea una experiencia divertida y emocionante, pero al menos podemos hacerla lo más rápida e indolora posible.

Creamos un nuevo flujo de Comenzando que te permite seleccionar tu sistema operativo de desarrollo y tu sistema operativo móvil desde el principio, proporcionando un lugar conciso con todas las instrucciones de configuración. También revisamos el proceso de instalación para garantizar que todo funcione y que cada punto de decisión tenga una recomendación clara. Tras probarlo con nuestros inocentes compañeros, estamos seguros de que es una mejora.

También trabajamos en la guía para integrar React Native en aplicaciones existentes. Muchas de las aplicaciones más grandes que usan React Native, como la propia aplicación de Facebook, construyen parte de la app con React Native y otra parte con herramientas de desarrollo convencionales. Esperamos que esta guía facilite que más personas puedan crear aplicaciones de esta manera.

Necesitamos tu ayuda

Tu retroalimentación nos indica en qué debemos enfocarnos. Sé que algunas personas leerán esta publicación y pensarán: "¿Mejor documentación? Pfff. ¡La documentación de X sigue siendo deficiente!". Eso es genial, necesitamos esa energía. La mejor manera de darnos feedback depende del tipo de comentario.

Si encuentras un error en la documentación, como descripciones inexactas o código que no funciona, crea un issue. Etiquétalo como "Documentation" para que sea más fácil dirigirlo a las personas adecuadas.

Si no hay un error específico, pero algo en la documentación es fundamentalmente confuso, no es adecuado para un issue de GitHub. En su lugar, publica en Canny sobre el área de la documentación que necesita mejoras. Esto nos ayuda a priorizar cuando realizamos trabajos más generales como la redacción de guías.

¡Gracias por leer hasta aquí y gracias por usar React Native!