메뉴
React Native mobile app development patterns with Expo 54, Tamagui, and expo-router. Use when creating screens, components, or navigation in the mobile app.
Codex 또는 Claude로 설치 이 Prompt를 복사해 Codex, Claude 또는 다른 어시스턴트에 붙여 넣으면 Skill 페이지를 검토하고 설치를 진행할 수 있습니다.
SOC 직업 분류 기준
Upgrade a project that is based on the agentic-mobile-blueprint template. Use when the user asks to check for template updates, upgrade to a newer version, or apply template changes.
Cut a new template version — bump TEMPLATE_VERSION, write upgrade notes, tag and publish a GitHub release. Use when releasing a new version of the agentic-mobile-blueprint template.
Set up Apple Developer account, App Store Connect app listing, and EAS credentials for iOS builds and TestFlight distribution. Use when creating a new iOS app, configuring Apple certificates/provisioning, or troubleshooting App Store Connect submission issues.
Explains how EAS Build and Submit work together for App Store and Google Play deployment. Use when configuring eas.json, troubleshooting mobile builds/submissions, or understanding version management, submit profiles, and the build-then-submit pipeline.
Supabase Edge Function development patterns with Deno runtime. Use when creating, modifying, or debugging edge functions. For Langfuse tracing see the langfuse-tracing skill. For Sentry error handling see the sentry-integration skill.
Next.js frontend app development patterns with App Router, Tailwind CSS v4, Zustand, and TanStack Query. Use when creating pages, components, or API routes in the frontend app.
| name | mobile-development |
| description | React Native mobile app development patterns with Expo 54, Tamagui, and expo-router. Use when creating screens, components, or navigation in the mobile app. |
Expo 54, React Native 0.81, expo-router (file-based routing), Tamagui v4 (UI), TypeScript strict mode.
Required to run expo run:android or expo prebuild:
| Requirement | Check | Install |
|---|---|---|
| Java JDK 17 | java -version (must show 17.x) | brew install openjdk@17 |
| Android SDK | echo $ANDROID_HOME (must be set) | mise run install |
If expo run:android fails with a Java error:
brew install openjdk@17
export JAVA_HOME="$(brew --prefix openjdk@17)/libexec/openjdk.jdk/Contents/Home"
export PATH="$JAVA_HOME/bin:$PATH"
If expo run:android fails with ANDROID_HOME not set or SDK not found:
export ANDROID_HOME="$HOME/Library/Android/sdk"
export PATH="$ANDROID_HOME/emulator:$ANDROID_HOME/platform-tools:$PATH"
Both are set permanently by mise run install. If missing, re-run it or add to ~/.zshrc manually.
iOS builds require Xcode (App Store). No additional toolchain needed beyond Xcode.
Use @/ path alias for project root: @/lib/supabase, @/lib/posthog.
Use Tamagui components with shorthand props. Never use raw React Native View/Text.
// ✅
import { YStack, XStack, Text, Button, Card, Spinner, ScrollView } from 'tamagui';
<YStack gap="$4" p="$4">
<Text fos="$6" fow="bold">Title</Text>
<Button>Action</Button>
</YStack>
// ❌
import { View, Text } from 'react-native';
Common shorthand: bg (background), p/px/py (padding), m/mt (margin), br (borderRadius), bw (borderWidth), boc (borderColor), fos (fontSize), fow (fontWeight), col (color), ai (alignItems), jc (justifyContent), gap, elevate, bordered.
File-based via expo-router:
app/_layout.tsx — layout wrappers (Stack, Tabs)app/index.tsx — home screenapp/settings.tsx — named routeUse Stack with headerShown: false (current convention).
import { YStack, Text } from 'tamagui';
export default function MyScreen() {
return (
<YStack f={1} ai="center" jc="center" bg="$background">
<Text>My Screen</Text>
</YStack>
);
}
import { supabase } from '@/lib/supabase';
Single shared client. Uses EXPO_PUBLIC_SUPABASE_URL and EXPO_PUBLIC_SUPABASE_PUBLISHABLE_KEY.
Default theme is dark. TamaguiProvider wraps the app in _layout.tsx with defaultTheme="dark".
All public config uses EXPO_PUBLIC_* prefix. Access via process.env.EXPO_PUBLIC_*.