react-native-expert
React Native gotchas and decision criteria. Covers FlatList optimization, storage hierarchy, and platform-specific pitfalls.
Best use case
react-native-expert is best used when you need a repeatable AI agent workflow instead of a one-off prompt.
React Native gotchas and decision criteria. Covers FlatList optimization, storage hierarchy, and platform-specific pitfalls.
Teams using react-native-expert should expect a more consistent output, faster repeated execution, less prompt rewriting.
When to use this skill
- You want a reusable workflow that can be run more than once with consistent structure.
When not to use this skill
- You only need a quick one-off answer and do not need a reusable workflow.
- You cannot install or maintain the underlying files, dependencies, or repository context.
Installation
Claude Code / Cursor / Codex
Manual Installation
- Download SKILL.md from GitHub
- Place it in
.claude/skills/react-native-expert/SKILL.mdinside your project - Restart your AI agent — it will auto-discover the skill
How react-native-expert Compares
| Feature / Agent | react-native-expert | Standard Approach |
|---|---|---|
| Platform Support | Not specified | Limited / Varies |
| Context Awareness | High | Baseline |
| Installation Complexity | Unknown | N/A |
Frequently Asked Questions
What does this skill do?
React Native gotchas and decision criteria. Covers FlatList optimization, storage hierarchy, and platform-specific pitfalls.
Where can I find the source code?
You can find the source code on GitHub using the link provided at the top of the page.
SKILL.md Source
> **AI-consumed reference.** Optimized for Claude to read during execution.
> Human-readable explanation: see [docs/architecture/HIERARCHICAL_PLANNING.md](../../../docs/architecture/HIERARCHICAL_PLANNING.md)
> or [docs/getting-started/](../../../docs/getting-started/) depending on topic.
# React Native Expert — Gotchas & Decisions
Use Context7 for React Native/Expo docs.
## Key Decisions
```toon
decisions[4]{choice,use_when}:
FlatList vs FlashList,"FlashList (@shopify/flash-list) for large lists — 5-10x faster. FlatList for simple short lists"
Storage hierarchy,"AsyncStorage: non-sensitive KV. SecureStore: tokens/secrets. MMKV: high-perf sync access"
Expo vs bare RN,"Expo: most projects (EAS Build handles native). Bare: custom native modules required"
NativeWind vs StyleSheet,"NativeWind for Tailwind familiarity. StyleSheet for performance-critical views"
```
## Gotchas
- FlatList: always set `keyExtractor`, `getItemLayout` (fixed height), `maxToRenderPerBatch`, `windowSize`
- `ScrollView` inside `FlatList` or vice versa — causes layout issues. Use `SectionList` or nested FlatList with `horizontal`
- `Platform.select({ ios: X, android: Y, default: Z })` — always include `default` for web
- `Animated.Value` persists across renders — create in `useRef` not `useState`
- `useWindowDimensions()` over `Dimensions.get()` — the hook updates on rotation
- Expo: `npx expo install` for compatible package versions — `npm install` may get incompatible versions
- `react-native-safe-area-context` > `SafeAreaView` from react-native (more reliable on Android)
- Deep linking: configure both `app.json` scheme AND native URL schemes for universal links
- `console.log` in production kills performance — use `__DEV__` guard or babel plugin to stripRelated Skills
vue-expert
Vue 3 gotchas and decision criteria. Covers reactivity traps, Composition API pitfalls, and Pinia patterns.
typescript-expert
TypeScript gotchas and decision criteria covering nullish coalescing pitfalls (|| vs ??), strict tsconfig settings (noUncheckedIndexedAccess, exactOptionalPropertyTypes), type guard patterns, discriminated unions, and as const vs enum. Use when writing TypeScript, configuring tsconfig, implementing type guards, or debugging null/undefined errors.
refactor-expert
Guide safe, incremental refactoring that improves code quality without changing behavior.
react-expert
React gotchas and decision criteria covering stale closure bugs in useEffect, conditional rendering traps (falsy 0/empty string), state management selection (useState vs Context vs Zustand vs TanStack Query), and hooks rules. Use when writing React components, debugging re-renders, choosing state management, or encountering useEffect infinite loops.
python-expert
Python gotchas and decision criteria. Covers async pitfalls, FastAPI/Django patterns, and type hint traps.
nodejs-expert
Node.js gotchas and decision criteria. Covers async pitfalls, Express/NestJS patterns, and common mistakes.
nextjs-expert
Next.js 14+ gotchas and decision criteria. Covers server/client boundary, caching strategy, and data fetching patterns Claude commonly gets wrong.
laravel-expert
Laravel/PHP gotchas and decision criteria. Covers N+1 prevention, Eloquent traps, and migration safety.
go-expert
Go gotchas and decision criteria. Covers error handling patterns, concurrency pitfalls, and interface design.
design-expert
UI/UX design expertise — component design, design system selection, responsive layout. Includes auto-detection from package.json and Context7 integration for library docs.
angular-expert
Angular 17+ gotchas and decision criteria. Covers signals vs observables, standalone patterns, and common pitfalls Claude gets wrong.
tree-of-thoughts
Branch, evaluate, prune, expand — structured search over solution space. Use for architecture with multi-step decisions, refactor planning, or complex debug hypothesis trees. Paper: Yao et al. 2023.