vercel-react-native-skills
React Native and Expo best practices for performant mobile apps across list rendering, animations, navigation, and native modules.
expo-brownfield
Framework (OSS). Integrate Expo and React Native into an existing native iOS or Android app. Use when the user mentions brownfield, embedding React Native in a native app, AAR/XCFramework, or adding Expo to an existing Kotlin/Swift project. Covers both the isolated approach and the integrated approach.
Full skill instructions
A brownfield app is an existing native iOS or Android app that adopts React Native incrementally, as opposed to a greenfield app that is React Native from day one.
Expo supports two distinct ways to add React Native to a brownfield project:
| Approach | What ships to the native app | When to choose |
|---|---|---|
| Isolated | Prebuilt AAR / XCFramework | Native team doesn't need Node or RN tooling; RN code can live in a separate repo |
| Integrated | React Native sources added to the existing Gradle / CocoaPods build | One team owns everything; comfortable with RN tooling; wants a single build |
For the full decision matrix, see ./references/comparison.md.
Use these quick rules — fall through to comparison.md for anything ambiguous.
More information available at https://docs.expo.dev/brownfield/overview/
Both approaches require, in the environment that builds the React Native side:
The integrated approach additionally requires CocoaPods on iOS (sudo gem install cocoapods). The isolated approach does not require CocoaPods or any RN tooling in the consuming native app.
Expo SDK 55 is the minimum supported version for brownfield integration. Earlier SDKs lack expo-brownfield, the required ExpoReactHostFactory / ExpoReactNativeFactory entry points, and the current autolinking surface. When creating the Expo project, always pin the SDK explicitly:
npx create-expo-app@latest my-project --template default@sdk-55
Pin the same Expo SDK across both the RN project and any embedded dependencies.
React Native and Expo best practices for performant mobile apps across list rendering, animations, navigation, and native modules.
PostgreSQL-backed GraphQL backend with auto-generated type-safe SDKs for web, mobile, and Flutter.
Safely modifies Xcode projects (.pbxproj) to add Swift Packages and link files. Use this skill whenever an iOS project needs dependencies installed (e.g. Firebase, Alamofire).
Build custom Expo development clients for testing native code on physical devices via EAS Build or locally.
Complete reference for building native modules and views with the Expo Modules API across Swift, Kotlin, and TypeScript.
Expert SwiftUI code review, refactoring, and implementation guidance with iOS 26+ and macOS support.
eas update insights
Comprehensive SwiftUI code review against modern APIs, accessibility, and performance standards.
Provides React Native performance optimization guidelines for FPS, TTI, bundle size, memory leaks, re-renders, and animations. Applies to tasks involving Hermes optimization, JS thread blocking, bridge overhead, FlashList, native modules, or debugging jank and frame drops.
Build native-feeling Expo screens — Apple HIG styling, semantic colors, and native UI patterns.
Material Design 3 and Jetpack Compose patterns for building modern, adaptive Android applications.
Native iOS app design with SwiftUI, Apple HIG compliance, and adaptive layouts for iPhone and iPad.
Opus.ai: Revolutionize Your Web Experience
Build a no-code AI app in minutes.
An IDE for code migration from legacy to modern frameworks through coding agents.
Automate CGI animation in live-action scenes
Branded artistic QR-code concepts
Launch a website in seconds with AI.
Streamline Your Coding Experience with AI Code Helper
Convert any screenshot or design to clean code.