Migration to React Native

Mike groups migration reasons into addressing current problems and creating future benefits. Poor performance, technical debt, and difficult maintenance can justify a rebuild, while shared code across platforms may reduce development time and cost. He also points to developer experience and the option to expand a React app to mobile or desktop.

Mike recommends four phases: business evaluation, planning and preparation, implementation, and validation and rollout. Teams should assess their skills, target platforms, documentation, designs, user stories, and tests before estimating the work. He says defining key performance indicators and critical-to-quality factors helps track whether the new app meets business and user needs.

Brownfield development adds React Native to an existing native app, so teams can introduce features or replace parts gradually while continuing to ship and earn revenue. Mike says this work requires knowledge of React Native and native iOS and Android systems, especially when setting up the integration. To avoid slowing native developers with JavaScript tooling and longer builds, Callstack packaged React Native code and assets as native artifacts such as an AAR or XCFramework.

Mike says repeated integration work led Callstack to create React Native Brownfield, a library of helpers for embedding React Native views and coordinating native and JavaScript navigation. He describes plans for a command-line tool to build distributable artifacts and a generator for native components backed by React Native. The planned release was delayed while the team worked to support Fabric and Turbo Modules alongside the older architecture.

Mike distinguishes converting an existing React app to additional platforms from migrating a non-React web app to React. The effort depends on component modularity, platform-specific code, layout differences, and styling; React Native Web can help reuse React Native components on the web. He recommends breaking the interface into small components and composing them, and notes that CSS or SCSS-heavy projects may require substantial styling work.