expo/skills

> **EAS service - costs apply.** Cloud builds use EAS plan resources, and EAS services have free-tier and paid-plan limits. Apple Developer and Google Play memberships are separate. Check https://expo.dev/pricing for the requested service.

"releaseNotes": "What's new in this version...",         "promoText": "Limited time offer!",         "privacyPolicyUrl": "https://example.com/privacy",

"promoText": "Limited time offer!",         "privacyPolicyUrl": "https://example.com/privacy",         "supportUrl": "https://example.com/support",

"privacyPolicyUrl": "https://example.com/privacy",

"supportUrl": "https://example.com/support",

"marketingUrl": "https://example.com"

// Fetch translations from CMS/localization service   const translations = await fetch(

const translations = await fetch(

"https://api.example.com/app-store-copy"

Install the [Expo Tools extension](https://marketplace.visualstudio.com/items?itemName=expo.vscode-expo-tools) for:

1. **Apple Developer Account** - Enroll at [developer.apple.com](https://developer.apple.com)

EAS Submit uploads the binary to App Store Connect. Public distribution continues through the app version's App Review and release flow, as described in the [EAS Submit guide](https://docs.expo.dev/submit/ios/).

1. Open the correct app and iOS version in App Store Connect. In its Build section, select the exact processed version/build you verified. Reuse an eligible TestFlight build when its code, icon, and configuration are ready for production; b

2. Complete the required listing and review information: screenshots, description, support/privacy URLs, age rating, privacy declarations, export compliance, reviewer contact/login, and pricing/availability as applicable. Resolve the versio

3. Choose the requested release timing: manual release, automatic release after approval, or automatic release no earlier than a chosen date. Approval is still required for the date-based option. 4. Click **Add for Review**, inspect the dra

4. Click **Add for Review**, inspect the draft submission, then **Submit for Review**. Adding to a draft alone does not send it to Apple. Handle review messages and verify the resulting status. See [Apple's submission steps](https://develop

5. After approval, follow the selected release timing. For manual release, the version waits in **Pending Developer Release** until **Release This Version** is completed. Verify availability in the intended storefronts before reporting it l

Use this path when the app runs SwiftUI or UIKit and the task is to build or distribute it with EAS. Adding React Native screens is a different task. [EAS Build supports native projects without Expo or React Native](https://docs.expo.dev/bu

The [default iOS worker](https://github.com/expo/eas-cli/blob/main/packages/build-tools/src/builders/ios.ts) skips prebuild for checked-in native projects but still runs `pod install`. For an app with no pods, a minimal `Podfile` can serve 

Use the app's real deployment target and target name. This does not add React Native pods. If the project must avoid CocoaPods or has a different layout, use a [custom EAS build](https://docs.expo.dev/custom-builds/get-started/) or archive/

Select the actual shared scheme. Set `ios.image` from the [current build-image list](https://docs.expo.dev/build-reference/infrastructure/) when a particular Xcode/SDK is required. Use explicit build configurations; `developmentClient: true

EAS remote versioning increments a counter. The [native version updater](https://github.com/expo/eas-cli/blob/main/packages/eas-cli/src/build/ios/version.ts) writes `CFBundleVersion` to the target's explicit `INFOPLIST_FILE`. A generated pl

The default icon should be 1024×1024 with no alpha channel, even if every pixel looks opaque. Preserve transparency in dark variants and Icon Composer layers; follow [Apple's guidance for each appearance](https://developer.apple.com/documen

Complete the [public release steps in App Store Connect](ios-app-store.md#complete-the-public-release): select the processed build, finish the listing/privacy/review information, submit for App Review, and apply the requested release timing

1. **Google Play Console Account** - Register at [play.google.com/console](https://play.google.com/console)

[Apple's TestFlight overview](https://developer.apple.com/help/app-store-connect/test-a-beta-version/testflight-overview/) describes tester limits and beta review. Processing, compliance, group assignment and invitations affect availability

Use [EAS Submit for iOS](https://docs.expo.dev/submit/ios/) for current CLI/configuration guidance, and [Apple's internal-tester guide](https://developer.apple.com/help/app-store-connect/test-a-beta-version/add-internal-testers/) for group 

> **EAS service - costs apply.** EAS Hosting is a paid Expo Application Services product with free-tier limits; production deploys use your plan's request and bandwidth allowance. See https://expo.dev/pricing. Authoring API routes and expor

const response = await fetch("https://api.openai.com/v1/chat/completions", {

[Credential-related source omitted]

This starts a local server at `http://localhost:8081` with full API route support.

curl http://localhost:8081/api/hello

curl -X POST http://localhost:8081/api/users -H "Content-Type: application/json" -d '{"name":"Test"}'

[Credential-related source omitted]

# https://docs.expo.dev/eas/workflows/syntax/#deploy

// Use fetch instead of node-fetch const response = await fetch("https://api.example.com");

const response = await fetch("https://api.example.com");

[Credential-related source omitted]

// From React Native components const response = await fetch("/api/hello");

const response = await fetch("/api/hello");

// With body const response = await fetch("/api/users", {

const response = await fetch("/api/users", {

const response = await fetch(

[Credential-related source omitted]

[Credential-related source omitted]

> **EAS service - costs apply.** EAS Observe is an Expo Application Services product. The free EAS plan allows up to 10,000 monthly active users, with a limited set of features; higher usage requires a paid subscription. For details, see ht

> **Source of truth:** https://docs.expo.dev/eas/observe/ — always consult the canonical docs when API details matter, especially get-started, configuration, integrations, and the metrics reference. EAS Observe is evolving; this skill's ref

- Get started: https://docs.expo.dev/eas/observe/get-started/

- Dashboard guide: https://docs.expo.dev/eas/observe/dashboard/

- Querying with EAS CLI: https://docs.expo.dev/eas/observe/eas-cli/

- Querying with the Expo MCP Server: https://docs.expo.dev/eas/observe/mcp/

- Metrics reference: https://docs.expo.dev/eas/observe/reference/metrics/

- Expo Router integration: https://docs.expo.dev/eas/observe/integrations/expo-router/

- React Navigation integration: https://docs.expo.dev/eas/observe/integrations/react-navigation/

- Expo Image integration: https://docs.expo.dev/eas/observe/integrations/expo-image/

- Reanimated integration: https://docs.expo.dev/eas/observe/integrations/react-native-reanimated/

- User-defined events: https://docs.expo.dev/eas/observe/events/

- Error reporting: https://docs.expo.dev/eas/observe/errors/

- Configuration: https://docs.expo.dev/eas/observe/configuration/ - Third-party integrations: https://docs.expo.dev/eas/observe/integrations/third-party/ - EAS Update download performance: https://docs.expo.dev/eas/observe/eas-update/

- Third-party integrations: https://docs.expo.dev/eas/observe/integrations/third-party/ - EAS Update download performance: https://docs.expo.dev/eas/observe/eas-update/ - Troubleshooting: https://docs.expo.dev/eas/observe/reference/troubles

- EAS Update download performance: https://docs.expo.dev/eas/observe/eas-update/

- Troubleshooting: https://docs.expo.dev/eas/observe/reference/troubleshooting/

Docs: https://docs.expo.dev/eas/observe/integrations/expo-image/

Docs: https://docs.expo.dev/eas/observe/integrations/react-native-reanimated/

> Source: https://docs.expo.dev/eas/observe/reference/metrics/ — this is the canonical reference for metrics. Consult this page for the latest guidance, full prose definitions, optimization tips, and rationale.

All durations are in seconds. Metric data is retained for a minimum of 60 days. By default, every installation dispatches all of its events; high-volume apps can sample per installation with `configure({ sampleRate })` — see [Sampling](http

- Full metric definitions and optimization guidance: https://docs.expo.dev/eas/observe/reference/metrics/

> Source: https://docs.expo.dev/eas/observe/eas-cli/ — the canonical CLI page. This reference adds table layouts, JSON output shapes, and pagination details that the docs page does not cover.

> Source: https://docs.expo.dev/eas/observe/mcp/

> Source: https://docs.expo.dev/eas/observe/get-started/ — consult this page for the latest guidance.

1. **An Expo account.** Sign up at [expo.dev/signup](https://expo.dev/signup) if needed.

2. **Expo SDK 55 or later.** Run `npx expo-doctor` to check, and `npx expo install --fix` to update dependencies. SDK 56+ unlocks the newer `ObserveRoot` / `useObserve` API. 3. **An EAS project.** The app must have `extra.eas.projectId` set

4. **A development build or a production build.** `expo-observe` is a native library, so it does **not** work in Expo Go. Testing the integration requires a [development build](https://docs.expo.dev/develop/development-builds/introduction/)

> By default, metrics collected from **debug builds** are not dispatched. A build is treated as a debug build when either the native app is a debug build or the JS bundle is a development bundle (`__DEV__` is `true`). To dispatch anyway whi

Open the **Observe** tab in the EAS dashboard at `https://expo.dev/accounts/[account]/projects/[project]/observe` to view metrics from the app.

Docs: https://docs.expo.dev/eas/observe/integrations/expo-router/

Docs: https://docs.expo.dev/eas/observe/integrations/react-navigation/

> Source: https://docs.expo.dev/eas/observe/events/ — consult this page for the latest guidance.

`expo-observe` records JavaScript errors and native crashes alongside the performance metrics. Errors are persisted on-device, batched, and dispatched on the next flush. They appear on the **Observe > Errors** page of the dashboard. Docs: h

{ "expo": { "extra": { "eas": { "observe": { "endpointUrl": "https://your-endpoint.com" } } } } }

> Source: https://docs.expo.dev/eas/observe/integrations/third-party/ — consult this page for the latest guidance.

Bash(npx *eas-cli@*), Bash(npx *agent-device@*), Bash(npx expo *), Bash(eas *), Bash(expo *), Bash(xcodebuild*), Bash(pod*), Bash(argent *), Bash(ffmpeg*)

> **EAS service - costs apply.** Sessions count toward your account's pricing and limits and stop at their maximum duration. Stop a session with `eas simulator:stop` when the task is done. See https://expo.dev/pricing for current terms.

[Credential-related source omitted]

npx --yes eas-cli@latest simulator:get --id <session-id> --json # Select the recording in artifacts[] by filename/name and metadata; use its downloadUrl: curl --fail --location --max-time 600 --output ./capture.mp4 '<downloadUrl>'

curl --fail --location --max-time 600 --output ./capture.mp4 '<downloadUrl>'

Source: EAS CLI [simulator:get](https://github.com/expo/eas-cli/blob/main/packages/eas-cli/src/commands/simulator/get.ts) exposes `artifacts[].{id,name,filename,metadata,downloadUrl}`.

[Credential-related source omitted]

To drive the connect yourself on a bare argent session (no launch flags), argent has `open-url`, which opens a scheme / deep link directly, so you can point a dev client at Metro without tapping through the launcher. Use the dev-client **cu

[Credential-related source omitted]

[Credential-related source omitted]

# sim_api <path> [extra query]: call a preview route, keeping the token query. # printf is a shell builtin, so the URL goes to curl on stdin and stays out of `ps`.

# printf is a shell builtin, so the URL goes to curl on stdin and stays out of `ps`.

sim_api() {   : "${API_BASE:?no preview API}"   printf 'url = "%s"\n' "$API_BASE$1?$API_QUERY${2:+&$2}" | curl -sS --fail-with-body --max-time 20 -K -

: "${API_BASE:?no preview API}"   printf 'url = "%s"\n' "$API_BASE$1?$API_QUERY${2:+&$2}" | curl -sS --fail-with-body --max-time 20 -K - }

printf 'url = "%s"\n' "$API_BASE$1?$API_QUERY${2:+&$2}" | curl -sS --fail-with-body --max-time 20 -K -

printf 'url = "%s"\n' "$API_BASE/crashes?$API_QUERY&tail=1" |   curl -sSN --fail-with-body --max-time 300 -H 'Accept: text/event-stream' -K - > "$EVENTS.log" 2> "$EVENTS.err" &

curl -sSN --fail-with-body --max-time 300 -H 'Accept: text/event-stream' -K - > "$EVENTS.log" 2> "$EVENTS.err" &

kill "$(cat "$EVENTS.pid")" 2>/dev/null; rm -f "$EVENTS.log" "$EVENTS.err" "$EVENTS.pid"

# 2. Build (no credentials prompt for a simulator build). Prints an artifact URL when done (~15-20 min). npx --yes eas-cli@latest build --platform ios --profile sim --non-interactive # → https://expo.dev/artifacts/eas/<hash>.tar.gz

# → https://expo.dev/artifacts/eas/<hash>.tar.gz

# 3. Start a session, then install-from-source so the VM downloads the artifact (no local upload) ART="https://expo.dev/artifacts/eas/<hash>.tar.gz"

ART="https://expo.dev/artifacts/eas/<hash>.tar.gz"

# 1. Start Metro with a tunnel on your own free port (tunnel-backend details at the end of this mode). EXPO_UNSTABLE_TUNNEL_V2=1 npx expo start --tunnel --port <your-free-port>   # background it durably #    Capture the manifest host. Headl

EXPO_UNSTABLE_TUNNEL_V2=1 npx expo start --tunnel --port <your-free-port>   # background it durably #    Capture the manifest host. Headless runs won't print it — read ngrok's API (curl -s 127.0.0.1:4040/api/tunnels) #    or the manifest (c

#    Capture the manifest host. Headless runs won't print it — read ngrok's API (curl -s 127.0.0.1:4040/api/tunnels)

#    or the manifest (curl -s -H "expo-platform: ios" localhost:<port>/ → launchAsset.url).

# install: a local .app uploads over the tunnel; an EAS artifact uses install-from-source (VM downloads it): npx --yes eas-cli@latest simulator:exec npx agent-device@latest install <bundleId> "$DEVAPP" --platform ios #   (EAS artifact inste

#   (EAS artifact instead:  install-from-source "https://expo.dev/artifacts/eas/<hash>.tar.gz" --platform ios)

Mode C needs a route from the EAS VM to your local Metro server. The account-signed Expo tunnel is the normal transport for this workflow: it forwards requests to `http://localhost:<your-free-port>` so the remote app can fetch its developme

Source: Expo CLI's [AsyncWsTunnel.ts](https://github.com/expo/expo/blob/main/packages/%40expo/cli/src/start/server/AsyncWsTunnel.ts) resolves the Expo account, requests a signed URL, and sets the local target port. Verify the installed CLI'

> **EAS service - costs apply.** Insights cover updates published through EAS Update, a paid Expo Application Services product with free-tier limits. Update delivery and the data behind these commands count against your plan's EAS Update us

Bash(npx expo *), Bash(npx *eas-cli@*), Bash(eas *)

> **EAS service - costs apply.** EAS Update is available on the Free plan; publishing and delivery use update, bandwidth, and storage allowances, with higher limits on paid plans. See https://expo.dev/pricing.

For dynamic app config, non-EAS builds, or a command that cannot complete automatically, follow the current setup documentation instead of guessing: https://docs.expo.dev/eas-update/getting-started.md.

Create a new native build when a change adds or modifies native code or native configuration, including most native-library additions and SDK upgrades. Do not work around a runtime mismatch or imply that publishing can add native capabiliti

Prefer a preview or staging channel for validation. When promoting a tested update, use the documented deployment flow so production receives the same artifact where possible: https://docs.expo.dev/eas-update/deployment.md.

4. Inspect the channel-to-branch mapping and the active update on that branch. 5. Fully terminate the release build and allow for the normal download-then-apply lifecycle. 6. Use the current debugging guide for native logs, export problems,

6. Use the current debugging guide for native logs, export problems, and configuration checks: https://docs.expo.dev/eas-update/debug.md.

- **Channel surfing:** an individual release build can override its `expo-channel-name` request header to request another compatible channel. This differs from changing the server-side channel-to-branch mapping. Follow https://docs.expo.dev

- Setup: https://docs.expo.dev/eas-update/getting-started.md

- Concepts and matching: https://docs.expo.dev/eas-update/how-it-works.md

- Deployment: https://docs.expo.dev/eas-update/deployment.md

- Debugging: https://docs.expo.dev/eas-update/debug.md

- Current EAS CLI reference: https://docs.expo.dev/eas/cli.md

Read,Write,Bash(node:*),Bash(npx *eas-cli@*)

> **EAS service - costs apply.** EAS Workflows run on Expo Application Services, a paid product with free-tier limits. Each workflow job consumes your plan's build/compute minutes, and jobs that build or submit also need paid Apple Develope

1. **JSON Schema** — https://api.expo.dev/v2/workflows/schema    - It is NECESSARY to fetch this schema

2. **Syntax Documentation** — https://raw.githubusercontent.com/expo/expo/refs/heads/main/docs/pages/eas/workflows/syntax.mdx

3. **Pre-packaged Jobs** — https://raw.githubusercontent.com/expo/expo/refs/heads/main/docs/pages/eas/workflows/pre-packaged-jobs.mdx

#!/usr/bin/env node

const response = await fetch(url, {

Executable file

Before writing this: gesture-handler ships [`ReanimatedSwipeable`](https://docs.swmansion.com/react-native-gesture-handler/docs/components/reanimated_swipeable/), which already does swipe-to-reveal actions — thresholds, overshoot, open/clos

Needs its own module and a one-time provider ([Expo keyboard guide](https://docs.expo.dev/guides/keyboard-handling/)):

`formSheet` is native on both platforms, but not the same on both — the [Expo modal docs](https://docs.expo.dev/router/advanced/modals/#form-sheet-presentation) have the full list:

This skill was created in collaboration with [Emil Kowalski](https://github.com/emilkowalski) and can also be found in the [emilkowalski/skills](https://github.com/emilkowalski/skills) repository, along with other useful animation skills.

> **Requirements.** Adding the App Clip target is open source. Shipping one requires an Apple Developer Program membership and App Store review, and the AASA file must be served over HTTPS on your domain (any HTTPS host works; EAS Hosting i

This installs [`@bacons/apple-targets`](https://github.com/EvanBacon/expo-apple-targets), adds it to the `plugins` array in `app.json`, and writes:

module.exports = (config) => ({   type: "clip",   icon: "https://github.com/expo.png",

type: "clip",   icon: "https://github.com/expo.png",   entitlements: {

icon: "https://github.com/expo.png",

- The `appclips` block is what lets a URL on the domain launch the Clip. - `webcredentials` is used for sharing credentials between the website, parent app, and the App Clip. - `activitycontinuation` is optional and used for sharing the lin

- `webcredentials` is used for sharing credentials between the website, parent app, and the App Clip. - `activitycontinuation` is optional and used for sharing the link between mobile and desktop. Must be used with `Head` from expo-router —

- `activitycontinuation` is optional and used for sharing the link between mobile and desktop. Must be used with `Head` from expo-router — see https://docs.expo.dev/router/advanced/apple-handoff/

- Notation and route-disabling details: https://sosumi.ai/documentation/xcode/supporting-associated-domains

The AASA file must be live before iOS will trust the association. Use [EAS Hosting](https://docs.expo.dev/eas/hosting/):

curl https://may20.expo.app/.well-known/apple-app-site-association

"releaseWithAppStoreVersion": true,         "reviewDetail": {           "invocationUrls": ["https://may20.expo.app/", null, null]

"reviewDetail": {           "invocationUrls": ["https://may20.expo.app/", null, null]         },

"invocationUrls": ["https://may20.expo.app/", null, null]

Apple's recommended App Clip metadata guidelines: https://sosumi.ai/documentation/appclip/configuring-the-launch-experience-of-your-app-clip

- Parent app target: `com.bacon.may20` - App Clip target: `com.bacon.may20.clip`, lives in `targets/clip/` - AASA hosted at `https://may20.expo.app/.well-known/apple-app-site-association`

- App Clip target: `com.bacon.may20.clip`, lives in `targets/clip/` - AASA hosted at `https://may20.expo.app/.well-known/apple-app-site-association` - Smart App Banner meta tag on every web route

- AASA hosted at `https://may20.expo.app/.well-known/apple-app-site-association`

// Display overlay to advertise full app.     // https://developer.apple.com/documentation/app_clips/recommending_your_app_to_app_clip_users

// https://developer.apple.com/documentation/app_clips/recommending_your_app_to_app_clip_users

More information available at https://docs.expo.dev/brownfield/overview/

Register the React Native Gradle plugin and Expo autolinking. Reference: [bare-minimum template `settings.gradle`](https://github.com/expo/expo/blob/sdk-57/templates/expo-template-bare-minimum/android/settings.gradle).

google()     mavenCentral()     maven { url 'https://www.jitpack.io' }

mavenCentral()     maven { url 'https://www.jitpack.io' }   }

maven { url 'https://www.jitpack.io' }

Apply the React Native plugin and configure the `react { ... }` block. The full template is at [bare-minimum `app/build.gradle`](https://github.com/expo/expo/blob/sdk-57/templates/expo-template-bare-minimum/android/app/build.gradle); the mi

Create (or update) `ios/Podfile` based on the [bare-minimum Podfile](https://github.com/expo/expo/blob/sdk-57/templates/expo-template-bare-minimum/ios/Podfile). The following excerpt follows SDK 57. For another SDK, adapt its matching templ

"type": "remotePublic",                 "name": "company",                 "url": "https://maven.example.com/releases"

"name": "company",                 "url": "https://maven.example.com/releases"               },

"url": "https://maven.example.com/releases"

Use the [Expo lifecycle guide](https://docs.expo.dev/brownfield/lifecycle-listeners/) and the installed delegate source to choose callbacks. Test the actual modules in use, including warm/cold deep links or push registration where applicabl

For runnable examples of both SwiftUI hosts, see the [iOS brownfield playgrounds](https://github.com/expo/skills/tree/main/tests/fixtures/expo-brownfield).

EAS Build/Submit can distribute the host after this integration works; they do not implement the runtime boundary. EAS Update requires an updates-enabled RN runtime and separate brownfield setup, not just an EAS project ID. Consult the [exi

Select the matching SDK/API using [version compatibility](./version-compatibility.md). Current reference: [Brownfield API](https://docs.expo.dev/versions/latest/sdk/brownfield/); implementation: [Expo SDK 57 brownfield](https://github.com/e

- **Integrated approach:** keep the hand-maintained host intact. Run `npx expo install --check` in the JS project, apply SDK-matched native template changes selectively, then run `bundle exec pod install` (or `pod install` without Bundler) 

1. Read the producer's `package.json` and lockfile; record resolved `expo`, `react-native`, and `expo-brownfield` versions. Check the host's deployment targets, Xcode/Node versions, and native dependency graph, including any existing RN run

2. For new work, check the [Expo releases](https://expo.dev/changelog/) and [SDK compatibility table](https://docs.expo.dev/versions/latest/#each-expo-sdk-version-depends-on-a-react-native-version). `npm view expo dist-tags --json` can conf

Sources: [SDK requirements](https://docs.expo.dev/versions/latest/), [SDK 57 Brownfield API](https://docs.expo.dev/versions/v57.0.0/sdk/brownfield/), [SDK 57 native template](https://github.com/expo/expo/tree/sdk-57/templates/expo-template-

const fetchUser = async (userId: string) => {   const response = await fetch(`https://api.example.com/users/${userId}`);

const response = await fetch(`https://api.example.com/users/${userId}`);

const createUser = async (userData: UserData) => {   const response = await fetch("https://api.example.com/users", {

const response = await fetch("https://api.example.com/users", {

const fetchWithErrorHandling = async (url: string, options?: RequestInit) => {   try {     const response = await fetch(url, options);

const response = await fetch(url, options);

[Credential-related source omitted]

return fetch(url, {

[Credential-related source omitted]

[Credential-related source omitted]

EXPO_PUBLIC_API_URL=https://api.example.com

const fetchUsers = async () => {   const response = await fetch(`${API_URL}/users`);

const response = await fetch(`${API_URL}/users`);

// .env.development EXPO_PUBLIC_API_URL=http://localhost:3000

EXPO_PUBLIC_API_URL=http://localhost:3000

// .env.production EXPO_PUBLIC_API_URL=https://api.production.com

EXPO_PUBLIC_API_URL=https://api.production.com

export const apiClient = {   get: async <T,>(path: string): Promise<T> => {     const response = await fetch(`${BASE_URL}${path}`);

get: async <T,>(path: string): Promise<T> => {     const response = await fetch(`${BASE_URL}${path}`);     if (!response.ok) throw new Error(`HTTP ${response.status}`);

const response = await fetch(`${BASE_URL}${path}`);

post: async <T,>(path: string, body: unknown): Promise<T> => {     const response = await fetch(`${BASE_URL}${path}`, {

const response = await fetch(`${BASE_URL}${path}`, {

[Credential-related source omitted]

const data = await fetch(url).then((r) => r.json());

const response = await fetch(url);

export async function loader() {   const response = await fetch("https://api.example.com/posts");

const response = await fetch("https://api.example.com/posts");

) => {   const id = params.id as string;   const response = await fetch(`https://api.example.com/posts/${id}`);

const response = await fetch(`https://api.example.com/posts/${id}`);

params, ) => {   const data = await fetch("https://api.stripe.com/v1/balance", {

) => {   const data = await fetch("https://api.stripe.com/v1/balance", {     headers: {

const data = await fetch("https://api.stripe.com/v1/balance", {

[Credential-related source omitted]

export async function loader() {   const response = await fetch("https://api.example.com/posts");

const response = await fetch("https://api.example.com/posts");

fetch(url, { signal: controller.signal })

After building or changing a screen, screenshot it and check it against these principles (from [Expo's design-principles guide](https://expo.dev/blog/how-to-apply-professional-design-principles-in-ai-app-development)). Each one maps to a sy

For confirmation choices, follow [Apple’s alert guidance](https://developer.apple.com/design/human-interface-guidelines/alerts): uncommon irreversible actions warrant confirmation; routine undoable actions generally do not.

> **Free locally; cloud builds are paid.** `expo-dev-client` itself is open source and building locally is free. Building or distributing via EAS Build/TestFlight uses your EAS plan's build minutes and needs a paid Apple Developer account f

**Development clients are the recommended setup for any real or production app.** Expo Go is a playground for learning and quick experiments with the native libraries it bundles; most apps outgrow it and move to a development client. See [E

Read,Bash(gh api:*),Bash(git clone:*),Bash(npx create-expo:*),Bash(npx degit:*),Bash(bun create:*)

[expo/examples](https://github.com/expo/examples) is Expo's official library of ~70 **integration examples** — directories named `with-<library>` (e.g. `with-stripe`, `with-maps`), each built around **one** library or service. These are not

gh api repos/expo/examples/contents/with-stripe/utils/stripe-server.ts --jq '.content' | base64 -d # No gh? Raw URL (branch is master): curl -s https://raw.githubusercontent.com/expo/examples/master/with-stripe/utils/stripe-server.ts

curl -s https://raw.githubusercontent.com/expo/examples/master/with-stripe/utils/stripe-server.ts

npx degit expo/examples/with-stripe /tmp/expo-ref/with-stripe   # clean copy, no git history # fallback without degit (sparse-checkout, no full ~64 MB clone): git clone --depth 1 --filter=blob:none --sparse https://github.com/expo/examples.

# fallback without degit (sparse-checkout, no full ~64 MB clone): git clone --depth 1 --filter=blob:none --sparse https://github.com/expo/examples.git /tmp/expo-ref/examples \   && (cd /tmp/expo-ref/examples && git sparse-checkout set with-

git clone --depth 1 --filter=blob:none --sparse https://github.com/expo/examples.git /tmp/expo-ref/examples \

- **Default branch is `master`,** not `main` (matters for raw URLs and sparse checkout). - **Single-click deploy.** Every example has a launch URL: `https://launch.expo.dev/?github=https://github.com/expo/examples/tree/master/<example>`.

- **Single-click deploy.** Every example has a launch URL: `https://launch.expo.dev/?github=https://github.com/expo/examples/tree/master/<example>`.

A categorized view of [expo/examples](https://github.com/expo/examples) for fast triage. Each entry is a **single-concern integration demo** (one library/service, managed project, usually one screen) — not a full app. This snapshot drifts —

[Credential-related source omitted]

[Credential-related source omitted]

[Credential-related source omitted]

[Credential-related source omitted]

1. Use the SF Symbols app on macOS (free from Apple) 2. Search at https://developer.apple.com/sf-symbols/

2. Search at https://developer.apple.com/sf-symbols/

const player = useAudioPlayer({ uri: 'https://stream.nightride.fm/rektory.mp3' });

const videoSource = 'https://example.com/video.mp4';

const binaryString = atob(base64);

defaults differ by SDK. - **Read the docs for that SDK, not `latest`.** Use the version-pinned URL, e.g.   `https://docs.expo.dev/versions/v56.0.0/sdk/ui/` on SDK 56 instead of

- **Read the docs for that SDK, not `latest`.** Use the version-pinned URL, e.g.   `https://docs.expo.dev/versions/v56.0.0/sdk/ui/` on SDK 56 instead of   `https://docs.expo.dev/versions/latest/sdk/ui/` — the `latest` pages track the newest

`https://docs.expo.dev/versions/v56.0.0/sdk/ui/` on SDK 56 instead of

`https://docs.expo.dev/versions/latest/sdk/ui/` — the `latest` pages track the newest

Appending `+api` to a file in `app/` makes it a server **API route**. Server code is different from frontend code — it runs in a Node-like server environment (deployed with EAS Hosting or on [third-party services](https://docs.expo.dev/rout

Based on [Expo app folder structure best practices](https://expo.dev/blog/expo-app-folder-structure-best-practices) by Kadi Kraman. For `src/` precedence and alias mechanics, see the [Expo docs](https://docs.expo.dev/router/reference/src-di

Docs https://docs.expo.dev/versions/unversioned/sdk/router - read to see the full API.

<Pressable>       <Image         source={{ uri: "https://example.com/thumb.jpg" }}

<Image         source={{ uri: "https://example.com/thumb.jpg" }}         style={{ width: 120, height: 120, borderRadius: 12 }}

source={{ uri: "https://example.com/thumb.jpg" }}

<Link.AppleZoom>         <Image           source={{ uri: "https://example.com/thumb.jpg" }}

<Image           source={{ uri: "https://example.com/thumb.jpg" }}           style={{ width: 200, aspectRatio: 4 / 3 }}

source={{ uri: "https://example.com/thumb.jpg" }}

<Link.AppleZoomTarget>         <Image           source={{ uri: "https://example.com/full.jpg" }}

<Image           source={{ uri: "https://example.com/full.jpg" }}           style={{ width: "100%", aspectRatio: 4 / 3 }}

source={{ uri: "https://example.com/full.jpg" }}

<Link.AppleZoom alignmentRect={{ x: 0, y: 0, width: 200, height: 300 }}>   <Image source={{ uri: "https://example.com/thumb.jpg" }} />

<Image source={{ uri: "https://example.com/thumb.jpg" }} />

export default function PhotoScreen() {   usePreventZoomTransitionDismissal();   return <Image source={{ uri: "https://example.com/full.jpg" }} />;

usePreventZoomTransitionDismissal();   return <Image source={{ uri: "https://example.com/full.jpg" }} />; }

return <Image source={{ uri: "https://example.com/full.jpg" }} />;

<Pressable>       <Image         source={{ uri: "https://example.com/thumb.jpg" }}

<Image         source={{ uri: "https://example.com/thumb.jpg" }}         style={{ width: 120, height: 120 }}

source={{ uri: "https://example.com/thumb.jpg" }}

- Expo Router Zoom Transitions: https://docs.expo.dev/router/advanced/zoom-transition/

- Link.AppleZoom API: https://docs.expo.dev/versions/v55.0.0/sdk/router/#linkapplezoom

- Apple UIKit Fluid Transitions: https://developer.apple.com/documentation/uikit/enhancing-your-app-with-fluid-transitions

Bash(node *expo-ui/scripts/list-components.js *)

- Overview — https://docs.expo.dev/versions/latest/sdk/ui/drop-in-replacements/index.md

- Per component — https://docs.expo.dev/versions/latest/sdk/ui/drop-in-replacements/{component}/index.md (slug is the component name lowercased, no hyphens, e.g. `bottomsheet`, `datetimepicker`, `segmentedcontrol`)

- Expo UI's API mirrors Jetpack Compose's API. Use Jetpack Compose and Material Design 3 knowledge to decide which components or modifiers to use. If you need deeper Jetpack Compose or Material 3 guidance (e.g. which component to pick, layo

(`<skill-root>` is the directory containing this `references/` folder.) - **Always read the `.d.ts` type files** to confirm prop shapes and signatures — read the relevant `{ComponentName}/index.d.ts` from the installed `@expo/ui/jetpack-com

- **Always read the `.d.ts` type files** to confirm prop shapes and signatures — read the relevant `{ComponentName}/index.d.ts` from the installed `@expo/ui/jetpack-compose` package in `node_modules`. This is the most reliable source of tru

- When about to use a component, fetch its docs to confirm the API — https://docs.expo.dev/versions/latest/sdk/ui/jetpack-compose/{component-name}/index.md

- When unsure about a modifier's API, refer to the docs — https://docs.expo.dev/versions/latest/sdk/ui/jetpack-compose/modifiers/index.md

- `RNHostView` embeds React Native components inside a Jetpack Compose tree (the same concept as in `@expo/ui/swift-ui`) — wrap any RN child in `<RNHostView>`. - If a required composable or modifier is missing in Expo UI, it can be extended

- If a required composable or modifier is missing in Expo UI, it can be extended via a local Expo module. See: https://docs.expo.dev/guides/expo-ui-jetpack-compose/extending/index.md. Confirm with the user before extending.

- **LazyColumn** — Use instead of react-native `ScrollView`/`FlatList` for scrollable lists. Wrap in `<Host style={{ flex: 1 }}>`. Not suitable for large lists — each item is a JSX node processed on the JS thread, which causes noticeable sl

- **Icon** — Use `<Icon source={require('./icon.xml')} size={24} />` with Android XML vector drawables. To get icons: go to [Material Symbols](https://fonts.google.com/icons), select an icon, choose the Android platform, and download the XM

- `ObservableState.value` is readable/writable from worklets; `onChange` fires a worklet listener on state change. - Docs — https://docs.expo.dev/versions/latest/sdk/ui/jetpack-compose/usenativestate/index.md

- Docs — https://docs.expo.dev/versions/latest/sdk/ui/jetpack-compose/usenativestate/index.md

(`<skill-root>` is the directory containing this `references/` folder.) - **The installed package's TypeScript types (`.d.ts`) are the most reliable source of truth** for prop shapes and signatures — read the relevant `{Component}/index.d.t

- **The installed package's TypeScript types (`.d.ts`) are the most reliable source of truth** for prop shapes and signatures — read the relevant `{Component}/index.d.ts` from the installed `@expo/ui/swift-ui` package in `node_modules`. Use

- When about to use a component, fetch its docs to confirm the API — https://docs.expo.dev/versions/latest/sdk/ui/swift-ui/{component-name}/index.md

- When unsure about a modifier's API, refer to the docs — https://docs.expo.dev/versions/latest/sdk/ui/swift-ui/modifiers/index.md

- If a required modifier or View is missing in Expo UI, it can be extended via a local Expo module. See: https://docs.expo.dev/guides/expo-ui-swift-ui/extending/index.md. Confirm with the user before extending.

- `ObservableState.value` is readable/writable from worklets; `onChange` fires a worklet listener on state change. - Docs — https://docs.expo.dev/versions/latest/sdk/ui/swift-ui/usenativestate/index.md

- Docs — https://docs.expo.dev/versions/latest/sdk/ui/swift-ui/usenativestate/index.md

Docs — https://docs.expo.dev/versions/latest/sdk/ui/universal/textinput/index.md

- Overview — https://docs.expo.dev/versions/latest/sdk/ui/universal/index.md

- Per component — https://docs.expo.dev/versions/latest/sdk/ui/universal/{component-name}/index.md

#!/usr/bin/env node

Check if latest is beta: https://exp.host/--/api/v2/versions (look for `-preview` in `expoVersion`)

rm -rf node_modules .expo

- Review release notes for the target SDK version at https://expo.dev/changelog

- Update versioned docs links in agent instruction files (`AGENTS.md`). The default template links to `https://docs.expo.dev/versions/v<version>/`. Search for `docs.expo.dev/versions/` and bump each link to the new SDK version.

- `EXPO_USE_FAST_RESOLVER=1` is removed in SDK +54. - cjs and mjs extensions are supported by default in SDK +50. - Expo webpack is deprecated, migrate to [Expo Router and Metro web](https://docs.expo.dev/router/migrate/from-expo-webpack/).

- Expo webpack is deprecated, migrate to [Expo Router and Metro web](https://docs.expo.dev/router/migrate/from-expo-webpack/).

https://docs.expo.dev/versions/latest/sdk/audio/

<Video   ref={videoRef}   source={{ uri: 'https://example.com/video.mp4' }}

ref={videoRef}   source={{ uri: 'https://example.com/video.mp4' }}   style={{ width: 350, height: 200 }}

source={{ uri: 'https://example.com/video.mp4' }}

const player = useVideoPlayer('https://example.com/video.mp4', player => {

https://docs.expo.dev/versions/latest/sdk/video/

- Read docs for more info https://docs.expo.dev/versions/v55.0.0/sdk/router-native-tabs/

Full guide: https://docs.expo.dev/guides/new-architecture/

Verify from the command line if the currently running app uses the New Architecture: `bunx xcobra expo eval "_IS_FABRIC"` -> `true`

- Official Expo Router SDK 55 → 56 migration guide: https://docs.expo.dev/router/migrate/sdk-55-to-56

A web React app does not *convert* to native — there is no transpiler. It **migrates**, screen by screen, the way a strangler fig grows around a tree and slowly replaces it: stand up a native shell, run the whole web UI inside it on day one

- [`./references/verify-on-device.md`](./references/verify-on-device.md) — the two-agent parity recipe: drive the web app (browser agent) and the native app (argent), open the same route, compare. - [`./references/run-as-goal.md`](./referen

- [Expo — From Web to Native with React](https://expo.dev/blog/from-web-to-native-with-react) — the canonical guide this skill operationalizes.

| Web | Native | Gotcha | |---|---|---| | `fetch('/api/x')` (relative) | absolute URL | Native has no origin — relative paths fail. Use a configured base URL (`EXPO_PUBLIC_API_URL`). |

|---|---|---| | `fetch('/api/x')` (relative) | absolute URL | Native has no origin — relative paths fail. Use a configured base URL (`EXPO_PUBLIC_API_URL`). | | CORS | n/a | No browser CORS, but you still need a reachable absolute host. |

| `fetch('/api/x')` (relative) | absolute URL | Native has no origin — relative paths fail. Use a configured base URL (`EXPO_PUBLIC_API_URL`). |