--- title: Working With the React Native Super App Showcase Repository description: An architectural walkthrough of Callstack's open-source Super App Showcase for React Native, demonstrating how to build super apps using Re.Pack with Module... canonical: https://daily.dev/posts/working-with-the-react-native-super-app-showcase-repository-5ciobo8b6 twitter:card: summary_large_image twitter:site: @dailydotdev og:type: website og:site_name: daily.dev og:title: Working With the React Native Super App Showcase Repository | daily.dev og:description: An architectural walkthrough of Callstack's open-source Super App Showcase for React Native, demonstrating how to build super apps using Re.Pack with Module... og:url: https://daily.dev/posts/working-with-the-react-native-super-app-showcase-repository-5ciobo8b6 og:image: https://api.daily.dev/og/posts/5cIOBo8B6.png og:image:alt: Working With the React Native Super App Showcase Repository og:image:width: 1200 og:image:height: 630 og:locale: en --- > ## Documentation Index > Fetch the complete documentation index at: https://daily.dev/llms.txt > Use this file to discover all available pages before exploring further. # Working With the React Native Super App Showcase Repository **[Callstack Blog](https://daily.dev/sources/callstack-blog)** · 7 min read · 0 upvotes · 0 comments ## Summary An architectural walkthrough of Callstack's open-source Super App Showcase for React Native, demonstrating how to build super apps using Re.Pack with Module Federation V2. It breaks down three structural roles - the Host Shell (native code, navigation, auth), federated mini apps (independently deployable feature domains exposing full navigators), and a Shared SDK singleton (dependency contracts, real-time state) - plus two hard rules: native code only lives in the Host Shell, and shared dependencies must be pinned to a single catalog version. It also covers cold start sequencing, real-time state sharing to avoid duplicate socket connections, React Compiler usage, and production concerns like bundle signing and version-compatible backend routing. ## Full article daily.dev links to this article rather than hosting it. Read it at the original source: ## Questions this post answers ### Why does registering the same native module twice in a React Native Module Federation setup crash the app? Native modules must exist in exactly one instance across the process lifetime, and registering two instances of a native module causes an immediate application crash rather than a soft warning. This is why native code should live only in the Host Shell package, while federated mini apps declare native dependencies purely as peer dependencies instead of bundling them. _Teams debugging multi-bundle crashes in React Native track architecture patterns like this on daily.dev._ ### How do you prevent duplicate socket connections when multiple React Native feature tabs subscribe to the same real-time data feed? Keep the real-time data service inside a single shared SDK singleton so all feature tabs subscribe to one connection instead of opening their own. Newly mounted components then receive cached state synchronously on subscription, showing accurate values on the first frame and avoiding state drift from duplicate sockets. _Developers tuning real-time state sharing across app modules follow this kind of pattern on daily.dev._ ### What are the production steps needed before shipping a React Native app built with Module Federation and Re.Pack? Replace local manifest URLs with stable remote hosting or a trusted discovery service, define caching, rollback, offline, and monitoring policies, and enable signature verification on the host so it validates signed remote bundles. Backend routing must also prevent an older host binary from fetching an incompatible remote bundle version, since remote bundles deploy instantly while host binaries go through app store review. _Teams planning a production rollout of federated mobile bundles compare notes on daily.dev._ ## Similar posts on daily.dev - [Build a React Native Super App With Re.Pack 5](https://daily.dev/posts/build-a-react-native-super-app-with-re-pack-5-j2m1cagow) · Callstack Blog · 0 upvotes · 0 comments - [Super App Development Services](https://daily.dev/posts/super-app-development-services-cot5v1rgr) · Callstack Blog · 0 upvotes · 0 comments --- Tags: [#webdev](https://daily.dev/tags/webdev), [#general-programming](https://daily.dev/tags/general-programming), [#react-native](https://daily.dev/tags/react-native) [View this post on daily.dev](https://daily.dev/posts/working-with-the-react-native-super-app-showcase-repository-5ciobo8b6) ```json {"@context":"https://schema.org","@graph":[{"@type":"Organization","@id":"https://daily.dev/#organization","name":"daily.dev","url":"https://daily.dev","logo":{"@type":"ImageObject","url":"https://daily.dev/apple-touch-icon.png","width":180,"height":180},"sameAs":["https://twitter.com/dailydotdev","https://github.com/dailydotdev","https://www.linkedin.com/company/daily-dev-ltd"]},{"@type":"WebSite","@id":"https://daily.dev/#website","url":"https://daily.dev","name":"daily.dev","publisher":{"@id":"https://daily.dev/#organization"},"potentialAction":{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https://daily.dev/search?q={search_term_string}"},"query-input":"required name=search_term_string"}}]} {"@context":"https://schema.org","@type":"TechArticle","headline":"Working With the React Native Super App Showcase Repository","url":"https://daily.dev/posts/working-with-the-react-native-super-app-showcase-repository-5ciobo8b6","mainEntityOfPage":{"@type":"WebPage","@id":"https://daily.dev/posts/working-with-the-react-native-super-app-showcase-repository-5ciobo8b6"},"datePublished":"2026-08-31T07:17:42.395Z","dateModified":"2026-08-31T07:18:05.782Z","description":"An architectural walkthrough of Callstack's open-source Super App Showcase for React Native, demonstrating how to build super apps using Re.Pack with Module...","image":"https://media.daily.dev/image/upload/f_auto,q_auto/v1/posts/e90ac528d6127f629e4de6f425f84e9b?_a=AQAEuop","thumbnailUrl":"https://media.daily.dev/image/upload/f_auto,q_auto/v1/posts/e90ac528d6127f629e4de6f425f84e9b?_a=AQAEuop","isAccessibleForFree":true,"articleSection":"Callstack Blog","inLanguage":"en","publisher":{"@type":"Organization","name":"daily.dev","url":"https://daily.dev","logo":{"@type":"ImageObject","url":"https://daily.dev/apple-touch-icon.png","width":180,"height":180}},"author":{"@type":"Organization","name":"Callstack Blog","logo":"https://media.daily.dev/image/upload/s--3qItoroi--/f_auto,q_auto/v1774179048/logos/callstack-blog?_a=BAMAMiWQ0","url":"https://daily.dev/sources/callstack-blog"},"commentCount":0,"discussionUrl":"https://daily.dev/posts/working-with-the-react-native-super-app-showcase-repository-5ciobo8b6","interactionStatistic":[{"@type":"InteractionCounter","interactionType":{"@type":"LikeAction"},"userInteractionCount":0},{"@type":"InteractionCounter","interactionType":{"@type":"CommentAction"},"userInteractionCount":0}],"keywords":"webdev,general-programming,react-native","timeRequired":"PT7M"} {"@context":"https://schema.org","@type":"BreadcrumbList","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https://daily.dev"},{"@type":"ListItem","position":2,"name":"Callstack Blog","item":"https://daily.dev/sources/callstack-blog"},{"@type":"ListItem","position":3,"name":"Working With the React Native Super App Showcase Repository"}]} {"@context":"https://schema.org","@type":"FAQPage","@id":"https://daily.dev/posts/working-with-the-react-native-super-app-showcase-repository-5ciobo8b6#faq","mainEntity":[{"@type":"Question","name":"Why does registering the same native module twice in a React Native Module Federation setup crash the app?","acceptedAnswer":{"@type":"Answer","text":"Native modules must exist in exactly one instance across the process lifetime, and registering two instances of a native module causes an immediate application crash rather than a soft warning. This is why native code should live only in the Host Shell package, while federated mini apps declare native dependencies purely as peer dependencies instead of bundling them. Teams debugging multi-bundle crashes in React Native track architecture patterns like this on daily.dev."}},{"@type":"Question","name":"How do you prevent duplicate socket connections when multiple React Native feature tabs subscribe to the same real-time data feed?","acceptedAnswer":{"@type":"Answer","text":"Keep the real-time data service inside a single shared SDK singleton so all feature tabs subscribe to one connection instead of opening their own. Newly mounted components then receive cached state synchronously on subscription, showing accurate values on the first frame and avoiding state drift from duplicate sockets. Developers tuning real-time state sharing across app modules follow this kind of pattern on daily.dev."}},{"@type":"Question","name":"What are the production steps needed before shipping a React Native app built with Module Federation and Re.Pack?","acceptedAnswer":{"@type":"Answer","text":"Replace local manifest URLs with stable remote hosting or a trusted discovery service, define caching, rollback, offline, and monitoring policies, and enable signature verification on the host so it validates signed remote bundles. Backend routing must also prevent an older host binary from fetching an incompatible remote bundle version, since remote bundles deploy instantly while host binaries go through app store review. Teams planning a production rollout of federated mobile bundles compare notes on daily.dev."}}]} ```