Adding React Native to iOS and Android Apps Has Never Been Easier

Brownfield development adds React Native screens or modules to an existing native app. Teams can adopt it gradually, replace web views with native UI, and reuse components across platforms instead of rewriting an entire app. The speakers note that this can help teams share work across web, iOS, and Android, though web developers still need to learn mobile tools and environments.

The speakers describe common integration hurdles: changing repository structure, adding Node.js and npm, relying on CocoaPods for iOS, and wiring React Native dependencies into native build systems. These steps can tightly couple the native project to React Native upgrades. Their proposed alternative packages the React Native app as an XCFramework for iOS or an AAR for Android, which the host app can consume as a framework or library.

The setup adds a framework target to the React Native app, builds it, then imports it into the native app. On iOS, the demo uses an XCFramework and a SwiftUI view that loads a registered JavaScript module by name; the speakers describe a similar path for Android with Jetpack Compose. They recommend React Native Enterprise Framework for packaging and React Native Brownfield for runtime helpers, and say the tools work with both the new and old architectures.

Burak demonstrates building the framework, starting React Native from a SwiftUI app, and loading the `main` module. In debug mode, the app connects to Metro, and a JavaScript text change appears in the native app and SwiftUI preview. The speakers also flag dependency issues, including React Native Firebase bringing its own native framework, and advise checking for duplicate or missing frameworks.

The speakers say React Native Enterprise Framework and React Native Brownfield complement each other: one handles packaging and setup, while the other helps with communication and runtime behavior. They describe teams developing React Native separately and sharing framework builds, sometimes through Git submodules. For skeptical native developers, they suggest keeping native tooling changes limited and using React Native selectively where it fits.