--- name: build-mobile-app-with-expo description: Builds an iOS and Android app with Expo and React Native - start the project the standard way, check the SDK version before any advice, install packages with npx expo install, then pick the right path for screens, navigation, dev builds or store release. Use when the user wants a mobile app, mentions Expo, React Native, Expo Go or EAS, or asks how to ship an app to the App Store. license: MIT metadata: category: frontend tags: "expo,react-native,mobile,react,typescript" author: johnny-bravo version: "1.0" updated: "2026-10-31" status: published aliases: "expo-overview,expo,react-native-expo" source_url: "https://github.com/expo/skills/blob/05754e71d02abe0d2d7a2fb5259ccac41f5ea59c/plugins/expo/skills/expo-overview/SKILL.md" source_license: MIT copyright: "Copyright (c) 2025-present 650 Industries, Inc. (aka Expo)" original_author: "Expo / 650 Industries (expo/skills, 'expo-overview')" modified: "Adapted by TheSkillVault: the router and shared setup rules rewritten as plain-language steps for beginners; skill map shortened to a goal list pointing at Expo's own skills; feedback-CLI section dropped; added gotchas, safety, portability and done-when sections." imported_on: "2026-10-31" --- # Build a mobile app with Expo Expo is the standard way to build an iOS and Android app with React Native. Most mistakes come from advice for the wrong SDK version or packages that do not match it. This skill sets up the shared rules, then sends each goal down the right path. ## When to use - Starting a new phone app for iOS and Android. - Working in a project whose `package.json` has an `expo` dependency. - Shipping an Expo app to TestFlight, the App Store or Google Play. Not for a bare React Native project with no `expo` dependency. ## Steps 1. **Confirm it is Expo work.** The user mentions Expo or EAS, or `package.json` lists `expo`. A native app that only uses EAS to build and ship counts too. 2. **Read the real goal** in plain words: build screens, add navigation, fetch data, ship to the stores, upgrade? Ask if it is unclear. 3. **New app? Start the standard way:** ```bash npx create-expo-app@latest my-app cd my-app && npx expo start ``` Open it in Expo Go on your phone by scanning the QR code. Keep screens in the `app/` folder (Expo Router, file-based routes). 4. **Detect the SDK version** before any version-specific advice. Read the `expo` version in `package.json` and `app.json` or `app.config.ts`. 5. **Read the docs for that SDK**, not `latest`. Use version-pinned pages like `https://docs.expo.dev/versions/v.0.0/...`. The `latest` pages can describe APIs your project does not have yet. 6. **Install packages with `npx expo install `**, not plain `npm install`. It picks versions that match your SDK. 7. **Know which setup you have.** Committed `ios/` and `android/` folders mean native projects exist (prebuild or bare). Config plugins and native steps differ from a managed project. 8. **Pick the path for the goal:** - Screens, styling, native controls: Expo UI and React Native components. - Navigation (tabs, stacks, modals): Expo Router. - A library that Expo Go cannot run: a development build (`expo-dev-client`). - Builds and store release: EAS Build and EAS Submit. Check `eas whoami`, log in with `eas login`, and run `eas init` if `extra.eas.projectId` is missing. - Over-the-air fixes after release: EAS Update. - Moving to a newer SDK: a separate upgrade task, not hand-edited versions. Expo publishes detailed skills for each path at github.com/expo/skills. 9. **Check health** with `npx expo-doctor` before builds and after adding packages. ## Gotchas - Advice written for another SDK is the most common failure. Always check step 4 first. - Some libraries need native code and will not run in Expo Go. Use a development build. - Upgrading the SDK by bumping version numbers by hand breaks dependencies. Use Expo's upgrade guide. - `FlatList` or `FlashList` is for long lists. A settings-style grouped list is not virtualised. ## Safety - Never put API keys or secrets in app code or `EXPO_PUBLIC_` variables. Anything in the app bundle can be read by users. Keep secrets on a server. - Store signing credentials (keystores, certificates) in EAS or a password manager, never in git. ## Works with other setups Works on macOS, Windows or Linux; iOS builds run in the cloud with EAS if you have no Mac. Prefer another mobile stack, such as Flutter or native Swift and Kotlin, instead? Steps 2, 4 and 5 still apply: confirm the goal, check versions, read version-matched docs. ## Done when - The app runs on a phone or simulator, and `npx expo-doctor` reports no problems. - You know the SDK version and which path (dev build, EAS Build, EAS Update) the next step needs. ## Example prompt "I'm new to Expo. Help me start an iPhone and Android app for my booking site." --- Adapted from "expo-overview" in expo/skills by Expo / 650 Industries (MIT). See LICENSE.txt.