Serie · 19 partes · En curso
React Native Module Federation
Construye una app React Native federada desde cero con Module Federation y Re.Pack: remotes en tiempo de ejecución, el contrato de singleton compartido y un host shell que controla la navegación.
9 de 19 publicados Próxima parte · 17 de agosto de 2026
- Por qué Module Federation en React Native Qué aportan a una app de React Native los micro-apps en runtime, qué cuestan y cuándo compensa. Intro de una serie que construye un setup federado desde cero.
- Tu primer remote federado en React Native Dos apps de React Native, una carga la pantalla de la otra en runtime con Module Federation 2.0 y Re.Pack. Cada paso se copia y pega, hasta una app en marcha.
- El contrato de singletons compartidos en React Native Module Federation Comparte react, react-native y una librería nativa entre un host y su remote de la forma correcta; hacerlo mal rompe la app al arrancar, no en silencio.
- El shell del host: remotes federados como pestañas en React Native El host pasa de una pantalla a shell de la app: es dueño de la tab bar y la navegación, y cada pestaña es un remote construido, desplegado y cargado aparte.
- El paquete de contratos: una frontera versionada entre remotes federados en React Native Ninguna app ve lo que publican las demás. Dos paquetes instalados por versión (un contrato tipado y la pantalla de detalle compartida) dan a cada lado una sola definición y dejan que semver gobierne la deriva.
- Un store compartido: estado de servidor entre remotes federados en React Native Un remote y un paquete instalado inyectan sus endpoints en un solo store del host y comparten una caché; si lo compartes mal, la pantalla se queda colgada en un spinner que nunca se resuelve.
- Quién es dueño de qué: fronteras, equipos y acoplamiento en una app React Native federada ¿Quién es dueño de una frontera, de un componente, de una definición de datos? Cinco tests para cortar una app React Native federada por líneas de equipo, y qué mueve cada respuesta.
- El estado de cliente cruza la frontera: remotes que traen sus propios slices en React Native Un remote inyecta el slice que solo él posee en el store compartido, el contrato lleva la única acción que cruza, y la escritura llega como prop; despacha antes de que el slice exista y el añadir se pierde en silencio.
- Stacks de estado bajo federación: la misma app de React Native construida dos veces TanStack Query y Zustand reconstruyen la app que Redux Toolkit y RTK Query acaban de construir; ambos funcionan, y lo que los separa es lo que pasa cuando equipos independientes dejan de coordinarse.
- The design system as a federated singleton
- Accessibility testing across federated remotes
- shell.navigateTo: RN ↔ native handoff
- The production build and the three modes
- Loading remotes from a CDN + version resolution
- The live two-version flip
- Offline fallback baked into the binary
- In-session fallback when a remote fails
- Signing the version-map + replay/rollback guard
- Health-based cross-launch auto-rollback