메뉴
Production-grade Expo and React Native best practices covering performance, navigation, state management, native APIs, platform-specific code, OTA updates, testing, and accessibility
Codex 또는 Claude로 설치 이 Prompt를 복사해 Codex, Claude 또는 다른 어시스턴트에 붙여 넣으면 Skill 페이지를 검토하고 설치를 진행할 수 있습니다.
SOC 직업 분류 기준
Advanced React Native component patterns with TypeScript including compound components, headless components, HOCs, polymorphic pressables, animated patterns, and platform-adaptive components
Opinionated Expo + React Native + TypeScript project structure and screen-splitting guidance. Use this whenever the user asks how to organize a mobile codebase, where files should live, how to split large screens or components, how to structure components, hooks, services, store, constants, types, or navigation, or when an Expo app feels messy and needs a consistent architecture.
REST and GraphQL API design patterns for NestJS covering DTOs, versioning, pagination, filtering, sorting, caching, rate limiting, file uploads, and OpenAPI documentation. Use when building NestJS APIs, designing endpoints, implementing query patterns, or optimizing API performance.
Authentication and authorization deep-dive for NestJS covering JWT, sessions, refresh tokens, RBAC, permissions, guards, decorators, OAuth2, multi-tenancy, and security hardening. Use when implementing auth flows, role-based access control, permission systems, or securing NestJS APIs.
Deep Drizzle ORM patterns for NestJS applications covering schema design, migrations, relations, transactions, query builder, repositories, and testing. Use when integrating Drizzle with NestJS, designing database schemas, writing complex queries, or managing migrations.
Opinionated NestJS + TypeScript project structure covering module organization, layer-first architecture, monorepo patterns, and domain-driven folder conventions. Use when organizing a NestJS codebase, deciding where files should live, splitting large modules, or structuring services, controllers, repositories, DTOs, and guards.
| name | expo-best-practices |
| description | Production-grade Expo and React Native best practices covering performance, navigation, state management, native APIs, platform-specific code, OTA updates, testing, and accessibility |
| version | 1.0.0 |
| type | skill |
| tags | ["expo","react-native","typescript","performance","mobile","best-practices"] |
| category | Mobile |
| author | agent-skills |
Comprehensive best practices for building production Expo and React Native applications with TypeScript, Expo SDK 52+, and React Navigation.
Reference these guidelines when:
| Priority | Category | Impact | Prefix |
|---|---|---|---|
| 1 | Performance Optimization | CRITICAL | performance- |
| 2 | Navigation Patterns | HIGH | navigation- |
| 3 | State Management | HIGH | state- |
| 4 | Custom Hooks for Native | MEDIUM-HIGH | hooks- |
| 5 | Platform-Specific Code | MEDIUM | platform- |
| 6 | Error Handling & Resilience | MEDIUM | error- |
| 7 | OTA Updates | MEDIUM | ota- |
| 8 | Testing | LOW-MEDIUM | testing- |
| 9 | Accessibility | LOW-MEDIUM | a11y- |
performance-list-optimization - FlatList/FlashList tuning for smooth 60fps scrollingperformance-image-handling - Image caching, placeholders, and blurhash with expo-imageperformance-memory-management - Preventing memory leaks, cleanup patternsperformance-animation-bridge - UI thread animations with Reanimated, avoiding bridge overheadnavigation-stack-patterns - Native stack vs JS stack, screen options, gesturesnavigation-deep-linking - Universal links, URL schemes, Expo Router linkingnavigation-tab-optimization - Lazy tabs, unmountOnBlur, preloading strategiesstate-async-storage - AsyncStorage patterns and MMKV as fast alternativestate-context-patterns - Context splitting for mobile performancestate-offline-first - Offline-first architecture with optimistic updateshooks-native-apis - Camera, location, notifications hooks with cleanuphooks-permissions - Permission request patterns with rationale dialogshooks-app-lifecycle - AppState changes, background/foreground detectionplatform-specific-code - Platform.select, Platform.OS, and .ios.tsx/.android.tsx filesplatform-safe-areas - SafeAreaView and useSafeAreaInsets patternsplatform-gestures - Gesture handler patterns for iOS/Android differenceserror-crash-reporting - Sentry integration, error tracking, breadcrumbserror-network-resilience - Retry logic, timeout handling, offline detectionerror-boundaries-native - Error boundaries adapted for React Native screensota-updates-expo - EAS Update setup, rollback strategies, update channelsota-versioning - Runtime versioning, native compatibility checkstesting-detox-patterns - E2E testing with Detox for iOS/Androidtesting-component-native - React Native Testing Library patternsa11y-screen-readers - VoiceOver/TalkBack support, accessibilityLabel/Role/Hinta11y-touch-targets - Minimum 44x44 touch targets, hitSlop patternsa11y-dynamic-type - Dynamic type support, scaled fonts, layout adaptationRead individual guide files for detailed explanations and code examples:
guides/performance-list-optimization.md
guides/navigation-stack-patterns.md
Each guide file contains:
For the complete guide with all content expanded: AGENTS.md