Skill Claude CodeCodex
Use when adding animations or gestures to a React Native + Expo app: scale/opacity/translation transitions, layout animations (FadeIn/SlideIn/FadeOut), shared-value driven motion, swipe-to-delete, pan/pinch/long-press gestures, scroll-linked animations. Triggers on: "anima questo", "swipe to X", "fade in/out", "pinch…
Skill Claude CodeCodex
Use to connect an Expo + RN app to a backend (auth, database, storage, realtime), agnostic of the provider. Teaches the shared patterns: secure-store for tokens, auth state via Zustand + TanStack Query, refresh-on-401 middleware, auth-gate routing via Expo Router (app)/layout.tsx, row-level security vs API-auth…
Skill Claude CodeCodex
Scaffold a new Expo + React Native app from a PROJECT.md + PRD.md + DESIGN.md using the opinionated stack (Expo Router, TypeScript, NativeWind v4, Zustand, TanStack Query, Reanimated, expo-image, FlashList). Reads .workflow/meta.json with stack.framework="expo-rn" and phase in {prddrafted, designextracted}. Produces a…
Skill Claude CodeCodex
Use when working with React Native core components (View, Text, ScrollView, FlatList, TextInput, Pressable, Modal, KeyboardAvoidingView, SafeAreaView) or platform APIs (Platform, Dimensions, useWindowDimensions, Linking, AppState). Triggers on: "which RN component should I use", "ScrollView vs FlatList", "how do I…
Skill Claude CodeCodex
Use when fetching data from APIs in React Native: choosing between fetch+useEffect (didactic only) and TanStack Query (production default), wiring the QueryClient provider, building queries / mutations / optimistic updates / paginated and infinite lists / cache invalidation / refetch on focus, handling loading and…
Skill Claude CodeCodex
Use for cloud builds and OTA updates of an Expo + RN app via EAS: configuring eas.json profiles (development/preview/production), managing credentials (APNs key, Android keystore) without committing them to git, submitting builds to App Store Connect / Google Play via EAS Submit, shipping JS-only fixes via EAS Update…
Skill Claude CodeCodex
Use to deploy an Expo + RN app end-to-end: initialize eas.json with 3 profiles (development/preview/production), set up credentials (APNs key, Android keystore) via eas credentials, build for preview to smoke-test, build production, submit to App Store Connect + Play Console via EAS Submit, configure EAS Update…
Skill Claude CodeCodex
Use when working with navigation in an Expo + React Native app: adding routes, building tab/stack/drawer layouts, modal routes, dynamic segments (e.g. /profile/[id]), typed routes, deep linking, search params. Triggers on: "add a route", "wire up tabs", "open as modal", "set up deep linking", "configure navigation"…
Skill Claude CodeCodex
Use at the start of any React Native or Expo task to lock in foundational choices: Expo managed workflow as default, latest Expo SDK with New Architecture ON, TypeScript, npm. Triggers on: "starting a new RN/Expo project", "what is the right architecture for an Expo app", "managed vs bare workflow", questions about…
Skill Claude CodeCodex
Use to wire a backend/infra module (auth, db, storage, realtime, push, payments) into a scaffolded Expo + RN app. Reads .workflow/meta.json with stack.framework="expo-rn" and the user-chosen provider for each module (Supabase, Firebase, custom REST, tRPC, RevenueCat). Installs deps, generates the wiring code…
Skill Claude CodeCodex
Use when preparing an Expo + RN app for store submission (metadata, screenshots, localized listings, privacy nutrition label, age rating) and integrating monetization (In-App Purchases via RevenueCat for digital goods/subscriptions; Stripe via WebView ONLY for non-digital services). Triggers on: "submit to App Store"…
Skill Claude CodeCodex
Use when adding push or local notifications to an Expo + RN app: requesting permissions at the right moment, registering for push (Expo push service in dev, APNs/FCM direct in prod), handling foreground + tapped + cold-start notifications, deep linking from a notification payload to a specific route, scheduling local…
Skill Claude CodeCodex
Use when styling React Native + Expo components: choosing between StyleSheet/NativeWind/inline, wiring NativeWind v4 from DESIGN.md tokens, handling Flexbox in RN (column-by-default, not row), safe-area insets, dark mode, responsive design with useWindowDimensions, optimized images via expo-image, performant lists via…
Skill Claude CodeCodex
Use to upgrade an existing Expo + RN project to a newer Expo SDK: bump expo, run npx expo install --fix to align every dependency, run npx expo-doctor for diagnostics, clear caches, and native-rebuild only for bare-workflow projects — skipped entirely for CNG (Continuous Native Generation) projects. Walks a…
Skill Claude CodeCodex
Use to write tests for an Expo + RN app: Jest + React Native Testing Library for unit/integration (components, hooks, queries, mutations) and Maestro for end-to-end flows (sign-in, navigation, forms). Sets up the testing stack on first call (jest-expo preset, RNTL, jest config) and writes a focused test next to the…
Skill Claude CodeCodex
Generate a real, working page (route + components) inside an already-scaffolded app from a single UI screenshot, applying the project's DESIGN.md tokens and the existing UI library (shadcn, Base UI, MUI, or Coss). Reads a screenshot from .workflow/screenshots/, plus .workflow/DESIGN.md and .workflow/meta.json for…
Skill Claude CodeCodex
Audit a React/shadcn app for missing UI fundamentals — accessibility, interaction, empty/error/loading states, form wiring, responsive shell, production polish — with the shadscan CLI, then route each real fix to the dev-flow skill that owns it. The third pre-deploy gate, alongside compliance-audit (legal) and…
Skill Claude CodeCodex
Review a diff on the two axes a dev-flow project can check that a generic reviewer cannot: the spec it was built from (.workflow/PRD.md + tasks.md) and the contract it was built under (golden rules, meta.json#stack). Two parallel sub-agents, reported side by side and never merged, with a Fowler smell baseline as the…
Skill Claude CodeCodex
Apply React 19 / Next.js 16 state discipline — useState is the last resort, not the default: derive from props/URL/data, key to reset, useMountEffect for one-time external sync, never bare useEffect. Use when the user pastes useState + useEffect + fetch, reaches for useState to mirror a prop, hand-rolls a derived…
Skill Claude CodeCodex
Give a Next.js 16 App Router app ONE motion system: a token layer (durations, easings, springs) plus a library of tokenized micro-interactions — entrance/exit, stagger, layout, modal/dropdown/toast/accordion, hover, feedback and route/page transitions. Four modes: Setup (scaffold lib/motion/ from the DESIGN.md motion…
Skill Claude CodeCodex
Ship a Next.js 16 App Router project to production on Vercel end-to-end: preview → smoke test → a staged production deployment (vercel --prod --skip-domain) that serves no traffic yet → vercel promote → domains and DNS, plus a rollback runbook. Requires stack.framework in {next, monorepo} and phase >= featurecomplete…
Skill Claude CodeCodex
Run vercel-doctor on a Next.js project to find costly Vercel patterns BEFORE they inflate the bill, then route the fixes to the owning dev-flow skill (data-fetching for caching, design-md-to-app for images). The cost counterpart to compliance-audit (legal gate); dev-flow proposes it before a Vercel deploy. Use when…
Skill Claude CodeCodex
Decide whether a Next.js 16 project should reach for WebGPU at all, then wire vgpu in: the .wgsl loader (Turbopack/webpack), a "use client" canvas that survives SSR, a prefers-reduced-motion path the library omits, a headless render snapshot in CI. Non-visual uses too — compute shaders (compute/dispatch, storage…
Skill Claude CodeCodex
Write Vitest unit/integration tests OR Playwright e2e tests for an existing source file (server action, page, component, query). Reads the project's wired test framework from .workflow/meta.json#stack.test, follows the mocking patterns already present in vitest.setup.ts and any sibling test files. Use when the user…