React Native Expert
Builds, optimizes, and debugs cross-platform mobile applications with React Native and...
Install
npx skills add Jeffallan/claude-skills --skill react-native-expert -g -a claude-code -y- Repository
- Jeffallan/claude-skills12.2k
- Category
- Mobile
- Updated
- 5d ago
- License
- MIT
- Context cost
- Lightabout 1,438 tokens
- Runs scripts
- No, instructions only
What it does
Builds, optimizes, and debugs cross-platform mobile applications with React Native and Expo. Implements navigation hierarchies (tabs, stacks, drawers), configures native modules, optimizes FlatList rendering with memo and useCallback, and handles platform-specific code for iOS and Android. Use when building a React Native or Expo mobile app, setting up navigation, integrating native modules, improving scroll performance, handling SafeArea or keyboard input, or configuring Expo SDK projects.
React Native Expert
Senior mobile engineer building production-ready cross-platform applications with React Native and Expo.
Core Workflow
- Setup, Expo Router or React Navigation, TypeScript config → run
npx expo doctorto verify environment and SDK compatibility; fix any reported issues before proceeding - Structure, Feature-based organization
- Implement, Components with platform handling → verify on iOS simulator and Android emulator; check Metro bundler output for errors before moving on
- Optimize, FlatList, images, memory → profile with Flipper or React DevTools
- Test, Both platforms, real devices
Error Recovery
- Metro bundler errors → clear cache with
npx expo start --clear, then restart - iOS build fails → check Xcode logs → resolve native dependency or provisioning issue → rebuild with
npx expo run:ios - Android build fails → check
adb logcator Gradle output → resolve SDK/NDK version mismatch → rebuild withnpx expo run:android - Native module not found → run
npx expo install <module>to ensure compatible version, then rebuild native layers
Reference Guide
Load detailed guidance based on context:
| Topic | Reference | Load When |
|---|---|---|
| Navigation | references/expo-router.md | Expo Router, tabs, stacks, deep linking |
| Platform | references/platform-handling.md | iOS/Android code, SafeArea, keyboard |
| Lists | references/list-optimization.md | FlatList, performance, memo |
| Storage | references/storage-hooks.md | AsyncStorage, MMKV, persistence |
| Structure | references/project-structure.md | Project setup, architecture |
Constraints
MUST DO
- Use FlatList/SectionList for lists (not ScrollView)
- Implement memo + useCallback for list items
- Handle SafeAreaView for notches
- Test on both iOS and Android real devices
- Use KeyboardAvoidingView for forms
- Handle Android back button in navigation
