React Native Integration & Best Practices: Core Concepts

The same codebase renders a web storefront and a React Native app. These pages cover the five mechanisms that make that possible — what stays shared, what is allowed to diverge, and where the runtime differences are absorbed.

Read them in this order:

Platform Separation

How a platform overrides a file. The folder-based shadowing chain (src/app/… over src/shop/…), what has to match between the two versions, and how to keep logic shared so only the view layer forks.

UI Abstractions

The shared primitive layer (View, Text, Button) and styling with react-native-unistyles, so feature code is not written twice against two component vocabularies.

Data Abstractions

Platform-agnostic persistence. NativeStorage wraps AsyncStorage with an in-memory cache and a subscription API, mirroring the web's storage behind a single interface.

Multi-Runtime Compatibility

Writing modules that survive being loaded in Node (SSR), a browser and Hermes.

Global Polyfills

The globals React Native does not provide, and how Archibald fills the gaps.