Use when adding new error messages to React, or seeing "unknown error code" warnings.
npx skills add shipshitdev/library --skill "expo-architect"
Install specific skill from multi-skill repository
# Description
Scaffold a production-ready Expo React Native app with working screens, navigation, and optional Clerk auth. Generates complete mobile app structure that runs immediately with `bun start`.
# SKILL.md
name: expo-architect
description: Scaffold a production-ready Expo React Native app with working screens, navigation, and optional Clerk auth. Generates complete mobile app structure that runs immediately with bun start.
version: 1.0.0
tags:
- expo
- react-native
- mobile
- scaffold
- clerk
Expo Architect
Create production-ready Expo React Native apps with:
- Framework: Expo SDK 54 + React Native 0.83 + TypeScript
- Navigation: Expo Router (file-based routing)
- Auth: Clerk authentication (optional)
- UI: NativeWind (Tailwind for RN) or StyleSheet
- Quality: Biome linting + TypeScript strict mode
- Package Manager: bun
What Makes This Different
Generates working mobile apps, not empty scaffolds:
- Complete navigation structure with working screens
- Optional Clerk authentication flow
- Real UI components with proper styling
- API client integration ready
- Runs immediately with
bun start
Workflow Summary
- PRD Brief Intake - Extract app type, screens, features, auth needs
- Auth Setup (if requested) - Clerk provider, sign-in/sign-up screens
- Screen Generation - Tab or stack-based navigation
- Component Generation - UI components, entity components, layouts
- Quality Setup - Biome, TypeScript strict, path aliases
- Verification - Run quality gate, report results
Usage
# Create app with PRD-style prompt
python3 ~/.claude/skills/expo-architect/scripts/init-expo.py \
--root ~/www/myapp \
--name "My App" \
--brief "A fitness tracker where users can log workouts"
# With specific options
python3 ~/.claude/skills/expo-architect/scripts/init-expo.py \
--root ~/www/myapp \
--name "My App" \
--tabs "Home,Workouts,Profile" \
--auth
Generated Structure
myapp/
├── app/
│ ├── _layout.tsx # Root layout
│ ├── (tabs)/ # Tab navigator
│ │ ├── _layout.tsx
│ │ ├── index.tsx
│ │ └── ...
│ └── (auth)/ # Auth screens (if enabled)
├── components/
│ ├── ui/ # Base UI components
│ ├── [entity]/ # Feature components
│ └── layout/ # Layout components
├── lib/
│ ├── api.ts # API client
│ └── auth.ts # Auth utilities
├── providers/ # Context providers
├── types/ # TypeScript types
├── app.json # Expo config
├── package.json
├── tsconfig.json
└── biome.json
Development Commands
bun start # Start Expo dev server
bun run ios # iOS simulator
bun run android # Android emulator
bun run lint # Check code style
bun run typecheck # Type checking
Environment Variables
EXPO_PUBLIC_CLERK_PUBLISHABLE_KEY=pk_test_...
EXPO_PUBLIC_API_URL=http://localhost:3001
For detailed patterns, code templates, and complete examples: references/full-guide.md
# Supported AI Coding Agents
This skill is compatible with the SKILL.md standard and works with all major AI coding agents:
Learn more about the SKILL.md standard and how to use these skills with your preferred AI coding agent.