Curso Avanzado de React Native

Clase 1 • Descripción general de la arquitectura de React Native

Cubre el bridge, JSI y el pipeline de renderizado de Fabric. Conecta el conocimiento arquitectónico con las decisiones de rendimiento que se toman a lo largo del curso.

Clase 2 • Estructura del proyecto y convenciones de archivos

Define estructuras de carpetas escalables y convenciones de nomenclatura para aplicaciones grandes. Una estructura consistente reduce la fricción en la incorporación y favorece el crecimiento modular.

Clase 3 • Configuración del entorno de desarrollo

Configura Xcode, Android Studio y las herramientas de CLI para compilaciones multiplataforma. Una configuración adecuada previene errores relacionados con el entorno en capítulos posteriores.

Clase 1 • Zustand y stores de estado ligeros

Introduce Zustand como una alternativa minimalista para el estado global acotado. Los estudiantes eligen la herramienta adecuada según la complejidad de la app y el tamaño del equipo.

Clase 2 • Context API y riesgos de rendimiento

Enseña Context para compartir estado entre componentes evitando re-renderizados innecesarios. Se conecta directamente con las decisiones de estado global en aplicaciones más grandes.

Clase 3 • Integración con Redux Toolkit

Implementa slices, thunks y selectores de Redux Toolkit en una app React Native. Proporciona un patrón de estado global listo para producción en entornos de equipo.

Clase 4 • Profundización en React Hooks

Explora en profundidad useState, useReducer, useRef y hooks personalizados. Un conocimiento sólido de hooks es el prerrequisito para todos los patrones de gestión de estado que siguen.

Clase 1 • Deep Linking y Universal Links

Configura esquemas de URL y universal links para abrir pantallas específicas de la app desde fuentes externas. Es fundamental para campañas de marketing y flujos de notificaciones push.

Clase 2 • Flujos de autenticación y rutas protegidas

Implementa navegación condicional basada en el estado de autenticación mediante el cambio de navegador. Conecta el conocimiento de gestión de estado con patrones reales de control de acceso.

Clase 3 • Patrones de navegación por tabs y drawer

Construye navegadores de tabs inferiores y drawer lateral con IU personalizada y soporte para badges. Permite shells de app complejos que se usan en apps móviles en producción.

Clase 4 • Navegación con tipos seguros usando TypeScript

Define listas de parámetros de ruta tipadas y fuerza contratos de navegación en tiempo de compilación. Previene errores de enrutamiento en tiempo de ejecución en bases de código grandes.

Clase 1 • React Native Reanimated 3

Implementa animaciones basadas en worklets que se ejecutan completamente en el hilo de la IU. Logra un rendimiento sin interrupciones para interacciones complejas impulsadas por gestos.

Clase 2 • Animaciones con Lottie y SVG

Integra animaciones Lottie en JSON y react-native-svg para gráficos vectoriales. Amplía el conjunto de herramientas de animación más allá del movimiento impulsado por código.

Clase 3 • Integración de Gesture Handler

Combina React Native Gesture Handler con Reanimated para gestos de deslizamiento, pellizco y arrastre. Permite interacciones que se sienten nativas y coinciden con las convenciones de la plataforma.

Clase 4 • Técnicas avanzadas de StyleSheet

Cubre la creación de temas dinámicos, unidades responsivas y anulaciones de estilo específicas de la plataforma. Establece la base de estilos para el trabajo de animación y gestos que sigue.

Clase 1 • Comprendiendo el sistema de módulos nativos

Explica el sistema de módulos del bridge heredado y sus limitaciones antes de JSI. Proporciona contexto sobre por qué se introdujeron los TurboModules y cuándo se aplica cada enfoque.

Clase 2 • TurboModules e integración con JSI

Implementa un TurboModule utilizando la capa C++ JSI de la nueva arquitectura para llamadas síncronas. Ofrece ganancias de rendimiento medibles en comparación con los módulos basados en el bridge.

Clase 3 • Escritura de módulos nativos de Android en Kotlin

Construye un ReactContextBaseJavaModule en Kotlin y lo registra en un paquete. Refleja el capítulo del módulo de iOS para garantizar la paridad de funcionalidades multiplataforma.

Clase 4 • Componentes de IU nativos y Fabric

Crea componentes de vista nativos personalizados que se renderizan a través del renderizador Fabric. Permite incrustar widgets de IU nativos de la plataforma que no están disponibles como componentes de JavaScript.

Clase 1 • Optimización del bundle de JavaScript

Reduce el tamaño del bundle mediante la división de código, tree shaking y la compilación a bytecode de Hermes. Los bundles más pequeños mejoran el tiempo de inicio en todos los niveles de dispositivos.

Clase 2 • Herramientas de perfilado y métricas

Utiliza Flipper, el perfilador de Hermes y React DevTools para identificar cuellos de botella en JS y renderizado. Establece una mentalidad de medición previa antes de aplicar cualquier optimización.

Clase 3 • Rendimiento de listas con FlatList y FlashList

Optimiza el renderizado de listas grandes utilizando las props de FlatList y la librería FlashList de Shopify. Aborda directamente uno de los puntos críticos de rendimiento más comunes en las apps móviles.

Clase 4 • Gestión de memoria y prevención de pérdidas

Identifica pérdidas de memoria por suscripciones no limpiadas, closures y asignaciones nativas. Previene fallos de la app y la degradación del rendimiento en sesiones largas.

Clase 1 • Monitoreo de errores e informes de fallos

Integra componentes de límites de error y un SDK de informes de fallos para visibilidad en producción. Cierra el ciclo de retroalimentación entre el despliegue y la resolución de problemas.

Clase 2 • Pruebas de componentes con RNTL

Prueba componentes renderizados usando las queries y eventos de usuario de React Native Testing Library. Valida el comportamiento de la IU sin depender de detalles de implementación.

Clase 3 • Pruebas unitarias con Jest

Escribe pruebas unitarias para hooks, utilidades y reducers usando Jest y React Native Testing Library. Establece la capa base de pruebas para la pirámide completa de QA.

Clase 4 • Técnicas y herramientas de depuración

Aplica los plugins de Flipper, Chrome DevTools y Reactotron para la depuración en tiempo de ejecución. Una depuración eficiente reduce el tiempo medio de resolución de problemas en producción.

Clase 1 • Actualizaciones over-the-air con CodePush

Despliega actualizaciones del bundle de JavaScript a dispositivos en producción sin ciclos de revisión en la tienda. Permite arreglos rápidos y pruebas A/B de cambios en la IU.

Clase 2 • Firma de código y gestión de certificados

Gestiona los perfiles de aprovisionamiento de iOS y los keystores de Android para compilaciones de lanzamiento firmadas. Una firma correcta es un prerrequisito para cada paso de envío a la tienda.

Clase 3 • Pipelines de compilación automatizados

Configura flujos de trabajo de GitHub Actions o Bitrise para compilar, probar y archivar en cada push. La automatización elimina errores manuales de compilación y acelera la cadencia de lanzamientos.

Clase 4 • Automatización de envío a tiendas con Fastlane

Utiliza lanes de Fastlane para automatizar las subidas a TestFlight y los despliegues en Play Store. Reduce el tiempo de envío de horas a minutos con scripts repetibles.