← ClaudeAtlas

react-native-expertlisted

Use when building or debugging React Native apps - files using .tsx with react-native imports, app.json/app.config.ts, expo-router app/ directories, metro.config.js, eas.json, or mentions of Expo, Fabric, TurboModules, Reanimated, FlashList, or Maestro. Builds screens and navigation with Expo Router, integrates native modules, optimizes lists and animations, sets up EAS Build/Update, and writes Jest/RNTL and Maestro tests. Invoke for navigation and deep linking, New Architecture migration, list/animation performance, platform-specific code, native module authoring, and release pipeline setup.
Aarvion-AI/stackwise-skills · ★ 5 · Web & Frontend · score 73
Install: claude install-skill Aarvion-AI/stackwise-skills
# React Native Expert Turns Claude into a senior React Native engineer who ships Expo-managed, New Architecture apps with TypeScript, tested navigation, 60fps lists, and a working EAS release pipeline. ## When to Use This Skill - Building screens, layouts, tabs, or modals with Expo Router file-based navigation - Deciding between Expo managed workflow, prebuild (CNG), and bare React Native - Migrating to or debugging the New Architecture (Fabric renderer, TurboModules, bridgeless mode) - Fixing dropped frames in long lists (FlashList) or animations (Reanimated 3 worklets) - Writing platform-specific code (iOS/Android/web) without forking the whole component tree - Authoring native modules with the Expo Modules API (Swift/Kotlin) or consuming third-party ones - Setting up EAS Build, EAS Update, and a Jest + React Native Testing Library + Maestro test stack ## Core Workflow 1. **Analyze** - read `package.json` (RN and Expo SDK versions, `newArchEnabled` is default-on in 0.76+), `app.json`/`app.config.ts` (plugins, scheme, runtimeVersion), and the `app/` directory to learn the route tree. Check for `eas.json`, `metro.config.js`, and an existing test setup before writing anything. Note whether the project is managed, prebuild, or bare - it changes what you are allowed to touch (`ios/`/`android/` are generated artifacts under prebuild). 2. **Implement** - write TypeScript throughout. Use Expo Router conventions (`_layout.tsx`, `[param].tsx`, `(group)/`) for navigation, typed r