.cursorrules TypeScript React Native Mobile

React Native + Expo

React Native + Expoのcursorrulesはモバイルファーストのパターンをカバー。ナビゲーション、ネイティブモジュール、パフォーマンス最適化。

.cursorrules · 64 lines
You are an expert React Native developer using Expo for cross-platform mobile development.

## Core Stack

- React Native + Expo SDK
- TypeScript strict mode
- Expo Router for file-based navigation
- NativeWind (Tailwind for RN)
- Zustand for state management
- React Query for server state

## Project Structure

```
app/               # Expo Router routes
  (tabs)/          # Tab navigation group
  _layout.tsx      # Root layout
components/        # Shared components
hooks/             # Custom hooks
lib/               # Utilities, API clients
assets/            # Images, fonts
```

## Component Patterns

- Functional components with TypeScript interfaces.
- `StyleSheet.create()` for performance over inline styles.
- NativeWind classes for rapid styling.
- `useCallback` and `useMemo` for expensive computations.
- `React.memo()` for pure presentational components.

## Navigation

- Expo Router: file-based routing (like Next.js App Router).
- `<Link>` for declarative navigation.
- `useRouter()` for programmatic navigation.
- Type-safe params with `useLocalSearchParams()`.

## Performance

- `FlatList` over `ScrollView` for long lists.
- `getItemLayout` for known item heights.
- `keyExtractor` must return unique stable keys.
- Avoid anonymous functions in render.
- Image optimization: `expo-image` with `contentFit`.

## Platform-Specific Code

- `Platform.OS === 'ios'` for conditional logic.
- `.ios.tsx` / `.android.tsx` file extensions for platform splits.
- `useSafeAreaInsets()` for notch/gesture area handling.

## Native Modules

- Prefer Expo SDK modules over bare React Native when available.
- `expo-camera`, `expo-location`, `expo-notifications` etc.
- Use `expo-dev-client` for custom native modules in development.

## Testing

- Jest + React Native Testing Library.
- Test behavior, not implementation.
- `renderHook` for custom hooks.
- Snapshot tests only for stable UI components.
Share on X

こちらもおすすめ

Mobile カテゴリの他のルール

もっとルールを探す

CLAUDE.md、.cursorrules、AGENTS.md、Image Prompts の全 223 ルールをチェック。