Expo Web to Native: a skill that moves a web React app to iOS and Android, screen by screen

Expo's skill makes Claude migrate a web React app to native iOS and Android with Expo: web shell first, then native screens one by one.

Installs: 21.1K; on skills.sh
Stars: 4K; on GitHub
Files: 5; besides SKILL.md
Updated: Nov 2026; last repo commit

The skill treats the move as a migration, not a conversion. Claude writes a worklist of your screens, scaffolds an Expo Router shell, runs every screen inside DOM components so the whole app works on a phone, then redesigns the most valuable screens as native ones using @expo/ui first. It then wires data, auth and storage and ships through EAS.

It triggers when you want to turn a website into a mobile app, port a Next.js, Vite or CRA codebase to React Native, or ask how web idioms map to native. Each step hands off to another Expo skill, such as expo-dom, expo-router, expo-data-fetching, eas-hosting and eas-app-stores, so install the whole Expo set.

Claude compares the running web screen with the running native screen, and the skill requires two tools for that, agent-browser and argent. If either is missing, the skill tells Claude to ask you and install it. See the permissions section below.

Good for

Web developers with a Next.js, Vite or CRA React app who want a mobile app
Teams that want a shippable app on day one, then native screens by priority
Web developers learning how DOM, CSS, localStorage and React Router map to native

Install expo-web-to-native

Claude Code

Copy this prompt.

Install the expo-web-to-native skill in Claude Code. Run this command:

claude plugin install expo@claude-plugins-official

Then check that it loaded and tell me how to use it.

2
Paste it into Claude Code. It shows the change and asks before running it.

Pick one route, not both, or you get every skill twice. This skill hands off to other Expo skills such as expo-dom, expo-router and eas-app-stores, so install the whole set. The expo plugin holds 23 skills, defines no hooks and bundles one Expo MCP server setting that points to https://mcp.expo.dev/mcp.

From the project README. Source.

What's in the skill

When it loads

Migrate an existing web React app to a native iOS/Android app with Expo. Use when the user wants to turn a website into a mobile app, port a Next.js/Vite/CRA React codebase to React Native, reuse web code on native incrementally, or asks how web idioms (the DOM, CSS, React Router, localStorage, window) map to native. This is the end-to-end migration guide; use the `expo-dom` skill for the DOM-component mechanism itself.

Sections in SKILL.md

Principles
Run it as a loop (recommended)
The migration
1. Assess → write the worklist
2. Scaffold the shell
3. Shell it in DOM components — the day-one milestone
4. Strangle screens to native — by value
5. Wire data, auth, and storage
6. Ship
Verify by running, not compiling
References
Submitting Feedback

Key facts

Author: Expo
License: MIT
Repository: expo/skills
Installs on skills.sh: 21,087 as of 2026-11-02
GitHub stars: 4,005 as of 2026-11-02
Last repo commit: 2026-11-01
Files in the skill folder: 6 files including SKILL.md (4 reference guides and 1 agents/openai.yaml)
skills.sh audits: Gen Agent Trust Hub pass, Socket pass, Snyk pass
Described by the repo as: Official AI agent skills from the Expo team
Works with: Other Expo skills it hands off to: expo-dom, expo-router, expo-data-fetching, eas-hosting, eas-app-stores and others

What it includes

Writes migration-progress.md, the worklist
Sorts page routes (screens) from server routes, and buckets each screen as port-as-is, nativize-now, nativize-later or hybrid. Flags third-party SDKs and payments.
Files · 1. Assess
create-expo-app plus matching Expo Router routes
Mirrors the web routes with empty screens, one per route.
Runs code · 2. Scaffold the shell
Runs every web screen inside a native route
Uses 'use dom' components (the expo-dom skill) so the full app runs on a phone before anything is native. The skill calls this the day-one milestone.
Files · 3. DOM-component shell
Redesigns screens one at a time, highest value first
Uses @expo/ui first, then expo-router navigation and RN primitives for custom layouts. Each screen is checked off the worklist.
Files · 4. Strangle screens to native
Replaces relative fetches, cookie sessions and localStorage
Uses the expo-data-fetching skill, and eas-hosting if the backend moves to EAS Hosting.
Files · 5. Wire data, auth, storage
Store builds through eas-app-stores, OTA through EAS Update
Hands off to other Expo skills for App Store, Play and TestFlight builds.
Runs code · 6. Ship
Compares the web screen with the native screen
Uses agent-browser to capture the web original and argent to drive the native app. Judges content and behavior, not pixels.
Runs code · Verify by running
Repeats the steps one screen per turn
references/run-as-goal.md has an objective for Claude Code /goal or similar loops. It re-reads the skill every turn and stops when the nativize-now items are done or blocked.
Files · Run as a goal loop
Reference guides for web idioms and UX patterns
references/false-friends.md maps web idioms to native ones, and references/native-patterns.md maps web UX patterns to native redesigns.
Read · False friends and native patterns

From the official docs

Permissions

Medium risk

Claude rewrites your app's screens and may install two global npm tools to check its work. Use a branch, and say no to installs you do not want.

What it can do

Read your data
Create and change things
Delete things
Read-only mode

Watch out for

Tells Claude to install two global npm tools
verify-on-device.md checks for agent-browser and @swmansion/argent and installs them if missing, plus a Chrome download for agent-browser. It says to ask you first, so say no if you do not want global installs.
The plugin route adds 23 skills and an Expo MCP server
The stored plugin install brings every skill in the expo plugin (23 in plugins/expo/skills), a .mcp.json that points to https://mcp.expo.dev/mcp, and an agents/openai.yaml. The plugin.json lists no hooks. Use the skills CLI route if you do not want the MCP server setting.
The goal loop can edit many screens without you
run-as-goal.md repeats one screen per turn until the worklist is done or blocked. Work on a branch and check in after a few passes.
Creates files in your repo
It writes migration-progress.md, and migration-goal.md if your agent cannot loop. Add them to .gitignore if you do not want them committed.
Includes a feedback command that reports to Expo
SKILL.md ends with an `npx --yes @expo/agent-cli@latest feedback` command, to be used only for specific, actionable feedback.

Technical details

Talks to	npm registry for global installs of agent-browser and argent. EAS services for builds and hosting if you use them. mcp.expo.dev, if you install the plugin route

Questions

What does the Expo Web to Native skill do?

It makes Claude migrate an existing web React app to a native iOS and Android app with Expo. It starts by running your web UI inside a native shell, then replaces screens with native ones in priority order, keeping the app shippable at every step.

Does it convert my web code automatically?

No. The skill says a web app does not convert to native because there is no transpiler. It migrates screen by screen, and a nativized screen is meant to be a redesign that feels native, not a reskin.

How do I install it in Claude Code, the Claude app or Codex?

Use the install box above, which installs the whole Expo set because this skill hands off to others in it. The README documents a Claude Code plugin, a Codex plugin and the skills CLI. It does not document a Claude app upload, and one skill alone would lack its helpers.

Do I need other skills or tools?

Yes. It routes to other Expo skills such as expo-dom, expo-router, expo-data-fetching, eas-hosting and eas-app-stores. Its verify step also needs agent-browser and argent, and tells Claude to ask you and install them if they are missing.

Is it safe to install?

It bundles no scripts. Claude edits your project, runs Expo commands and, with your approval, installs two global npm tools. The optional goal loop can run many screens in a row, so work on a branch and review each pass.

Which web frameworks does it cover?

The description names Next.js, Vite and CRA React codebases. Next's route tree maps almost one to one onto Expo Router, and the skill notes async Server Components must be split first.

Can I take payments the same way as on the web?

Not always. The skill warns that in-app digital goods must use store in-app purchases through RevenueCat, not Stripe, and says to decide this early.

Information

updated Nov 2, 2026

Repository: expo/skills
Folder: plugins/expo/skills/expo-web-to-native

expo/skills skills.sh

Sources

Docs, issue trackers and discussions this page is built from.

Show all 6

expo/skills README · github.com
.mcp.json · github.com
SKILL.md · github.com
verify-on-device.md · github.com
run-as-goal.md · github.com
plugin.json · github.com