[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"project-83290":3},{"id":4,"name":5,"fullName":6,"owner":7,"repo":5,"description":8,"homepage":9,"htmlUrl":9,"language":10,"languages":9,"totalLinesOfCode":9,"stars":11,"forks":12,"watchers":13,"openIssues":14,"contributorsCount":14,"subscribersCount":14,"size":14,"stars1d":15,"stars7d":16,"stars30d":16,"stars90d":14,"forks30d":14,"starsTrendScore":17,"compositeScore":18,"rankGlobal":9,"rankLanguage":9,"license":19,"archived":20,"fork":20,"defaultBranch":21,"hasWiki":22,"hasPages":20,"topics":23,"createdAt":9,"pushedAt":9,"updatedAt":24,"readmeContent":25,"aiSummary":9,"trendingCount":14,"starSnapshotCount":14,"syncStatus":26,"lastSyncTime":27,"discoverSource":28},83290,"web-to-mobile-magic-plugin","suntay44\u002Fweb-to-mobile-magic-plugin","suntay44","Website to React Native mobile app Plugin. Audit, Plan, QA scan, and deep review. Plan-first, approval-gated and Token Efficient.",null,"JavaScript",98,11,3,0,1,46,12,69.84,"MIT License",false,"main",true,[],"2026-06-12 04:01:40","\u003Cdiv align=\"center\">\n\n\u003Cbr \u002F>\n\n\u003Cimg width=\"1920\" height=\"600\" alt=\"WebToMobile — open-source AI plugin that converts any website or web app into a native Expo React Native mobile app, for Claude Code, Cursor, and Codex\" src=\"https:\u002F\u002Fgithub.com\u002Fuser-attachments\u002Fassets\u002F13ad5b52-bdd9-4ad8-8568-4e542d50074e\" \u002F>\n\n\n\n\n### Open-Source AI Skills & Plugin for Coding Agents\n### ⭐ Stars are appreciated!\n\n**Turn websites and web repos into audited mobile migration plans and Expo React Native implementation workflows.**\u003Cbr \u002F>\nPlan-first. Approval-gated. Works with Claude Code, Cursor, and Codex.\n\n\u003Cbr \u002F>\n\n[![License: MIT](https:\u002F\u002Fimg.shields.io\u002Fbadge\u002FLicense-MIT-blue.svg)](LICENSE)\n[![Works with Claude Code](https:\u002F\u002Fimg.shields.io\u002Fbadge\u002FClaude%20Code-Plugin-darkorange)](https:\u002F\u002Fclaude.ai\u002Fcode)\n[![Works with Codex](https:\u002F\u002Fimg.shields.io\u002Fbadge\u002FCodex-Plugin-blue)](https:\u002F\u002Fchatgpt.com\u002Fcodex)\n[![Works with Cursor](https:\u002F\u002Fimg.shields.io\u002Fbadge\u002FCursor-Plugin-black)](https:\u002F\u002Fcursor.sh)\n[![Expo React Native](https:\u002F\u002Fimg.shields.io\u002Fbadge\u002FTarget-Expo%20React%20Native-4630EB)](https:\u002F\u002Fexpo.dev)\n\n\u003Cbr \u002F>\n\n\u003C\u002Fdiv>\n\n---\n\n## What It Does\n\n**WebToMobile is an open-source AI plugin and skill set that converts a website or web app into a native mobile app** (Expo React Native) — directly inside Claude Code, Cursor, or Codex. Point it at a URL, a GitHub repo, or a local web project, and it audits the source, writes an approval-gated migration plan, builds the mobile app, and verifies the result.\n\nIt gives AI coding agents six commands for website-to-mobile work:\n\n- Convert a website or web repo into an Expo React Native migration plan\n- Finish an unfinished mobile app\n- Run QA checks and senior-style mobile reviews\n- Keep the workflow audit-first, plan-first, and approval-gated\n\nIt is a **helper, not a magician**. The quality of the result depends on the source you provide.\n\n---\n\n## Input Matters\n\n| You provide | What WebToMobile can do |\n|-------------|--------------------------|\n| Live website URL | UI\u002FUX-focused mobile plan from public pages: layout, navigation, visual hierarchy, and a mobile shell. It cannot see private code, API logic, state, auth, or anything behind login. |\n| GitHub repo or local path | Full source-backed migration plan: routes, framework, scripts, auth, APIs, styling, browser-only APIs, env vars, reusable logic, rewrite-required code, mobile-native gaps, and blockers. |\n\n> **Rule of thumb:** URL gets you a faithful *interface*. Repo gets you a faithful *app*.\n\n---\n\n## Scope\n\nWebToMobile runs inside your AI coding agent. It audits your web source, writes an approval-gated plan, implements the approved checklist in Expo React Native, and verifies the result with real evidence.\n\nIt deliberately does **not** replace your backend, deploy infrastructure, submit to app stores, or handle secrets.\n\n| Not this | Because |\n|----------|---------|\n| Hosting, deployment, or CI\u002FCD | We're a coding helper, not infrastructure. We list the release steps; your pipeline runs them. |\n| Backend \u002F API generation | We reuse or consume your existing API. If a website is server-coupled with no client API, we flag it as a blocker — we don't invent one. |\n| No-code builder or design tool | We don't replace Figma or a designer. We translate what exists. |\n| App Store \u002F Play Store submission | We produce the release checklist; a human submits. |\n| Secret\u002Fcredential handling | We never request, store, or transmit keys or tokens. |\n\nOutputs are evidence-backed and confidence-labeled: `[from-code]`, `[inferred]`, or `[assumption]`. Human-only checks like pixel fidelity, animation feel, brand judgment, and real-device testing are called out explicitly.\n\n---\n\n## Why It Helps\n\nGoing from a website to a mobile app usually means a lot of manual back-and-forth: explaining your project, hunting for which parts can be reused, and hoping nothing important gets missed. WebToMobile turns that into a repeatable flow.\n\n- **One command instead of many prompts.** You point it at your source once; it does the audit instead of you re-explaining the project each turn.\n- **Reusable vs. rewrite is decided for you.** The audit separates code you can port directly from code that needs a mobile rewrite, so you are not guessing.\n- **Web routes become a mobile navigation map.** The plan maps routes like `\u002Fdashboard`, `\u002Fsettings`, or `\u002Fproducts\u002F:id` into reviewed mobile destinations such as tabs, stacks, detail screens, auth flows, or modals.\n- **Risks surface before you build.** Auth, API, storage, browser-only APIs, routing, and server-coupling issues are flagged in the plan — not discovered halfway through.\n- **The plan is your memory.** Progress lives in a Markdown checklist you can read, resume, and review — not buried in chat history.\n- **Checks happen before \"done.\"** Verification is part of the workflow, not something you have to remember to ask for.\n\n> Results depend on your project's size, framework, and how much source access you give the agent. A URL gives less than a full repo.\n\n---\n\n## Updating\n\nMost users should update with one command from the cloned repo:\n\n```bash\nnode scripts\u002Finstall.mjs --update\n```\n\n`--update` pulls the latest WebToMobile from GitHub, then refreshes the installed Claude commands and skills.\n\nUse `--refresh` only when you already have the version you want locally:\n\n```bash\nnode scripts\u002Finstall.mjs --refresh\n```\n\nCommon cases:\n\n| Use case | Command |\n|----------|---------|\n| You want the latest release from GitHub | `node scripts\u002Finstall.mjs --update` |\n| You edited the plugin locally and want Claude to use your edits | `node scripts\u002Finstall.mjs --refresh` |\n| You already ran `git pull` yourself | `node scripts\u002Finstall.mjs --refresh` |\n| You installed from a ZIP download | Download the latest ZIP, replace the folder, then run `node scripts\u002Finstall.mjs --refresh` |\n\n`--update` refuses to run if you have local uncommitted changes. It will ask you to commit\u002Fstash or update manually first.\n\n---\n\n## Commands\n\n| Command | Scenario | What it does |\n|---------|----------|--------------|\n| `\u002Fweb-to-mobile` | **Start from a website or web app** | Audit, plan, approve, build, parity-check, and QA an Expo React Native migration |\n| `\u002Fmobile-resume` | **Finish an unfinished mobile app** | Audit the app, plan remaining work, approve, build, and QA |\n| `\u002Fmobile-scan` | **Fast QA report** | Run commands only and produce a Shippable \u002F Needs Work \u002F Blocked report |\n| `\u002Fmobile-review` | **Deep senior review** | Read targeted files and report architecture, quality, robustness, performance, and security issues |\n| `\u002Fmobile-audit` | **Mobile audit only** | Inspect an existing mobile app and report complete, partial, and missing areas |\n| `\u002Fmobile-qa` | **Final verification** | Verify a mobile app against its approved plan before completion |\n\n---\n\n## Typical Use\n\n```\n\u002Fweb-to-mobile https:\u002F\u002Fyourwebsite.com          # UI\u002FUX only — visual starting point\n\u002Fweb-to-mobile https:\u002F\u002Fgithub.com\u002Fyou\u002Fyour-web-app   # full port — reuses real logic\n\u002Fweb-to-mobile .\u002Flocal-web-project                   # full port — reuses real logic\n```\n\n```\n\u002Fmobile-resume .\u002Fmy-unfinished-app\n\u002Fmobile-resume https:\u002F\u002Fgithub.com\u002Fyou\u002Funfinished-app\n```\n\n```\n\u002Fmobile-scan .\u002Fmy-app\n\u002Fmobile-review .\u002Fmy-app\n```\n\nBuild commands follow:\n\n```text\nAudit -> Markdown plan -> your approval -> implementation -> verification\n```\n\n`\u002Fmobile-scan` is command-driven and cheaper. `\u002Fmobile-review` is code-driven and deeper. Both start from audit output to stay token-efficient.\n\n---\n\n## How It Works\n\nWebToMobile uses small audit scripts first, then targeted reads only when needed.\n\n```\nAudit script -> JSON summary -> targeted reads -> Markdown plan\u002Freport -> approval gate -> build or review\n```\n\nThe Markdown plan acts as external memory between phases, so the agent does not need to keep re-reading or re-explaining the whole project.\n\n---\n\n## Install\n\n**Prerequisites:** [Node.js](https:\u002F\u002Fnodejs.org) v18+ and at least one of: Claude Code (CLI or Desktop), Cursor, or Codex.\n\n```bash\ngit clone https:\u002F\u002Fgithub.com\u002Fsuntay44\u002Fweb-to-mobile-magic-plugin\ncd web-to-mobile-magic-plugin\n```\n\n### Claude Code — CLI and Desktop App\n\n**Global install** (commands available in every project):\n\n```bash\nnode scripts\u002Finstall.mjs\n```\n\nThis symlinks commands to `~\u002F.claude\u002Fcommands\u002F` and skills to `~\u002F.claude\u002Fskills\u002F`. Restart Claude Code after running.\n\nUseful installer commands:\n\n| Command | Use |\n|---------|-----|\n| `node scripts\u002Finstall.mjs` | First install |\n| `node scripts\u002Finstall.mjs --update` | Pull latest release and refresh installed links |\n| `node scripts\u002Finstall.mjs --refresh` | Refresh local edits or a manual `git pull` |\n| `node scripts\u002Finstall.mjs --unlink` | Remove WebToMobile-owned links |\n\n**Project-level install** (commands available in this project only):\n\n```bash\nmkdir -p .claude\u002Fcommands .claude\u002Fskills\ncp commands\u002F* .claude\u002Fcommands\u002F\ncp -r skills\u002F. .claude\u002Fskills\u002F\n```\n\nAfter install, type any command from the [Commands](#commands) table in Claude Code. If the Skill tool is unavailable, each command can read its matching `SKILL.md` directly from `skills\u002F` or `~\u002F.claude\u002Fskills\u002F`.\n\n### Cursor\n\nCursor does not yet have a native slash command system equivalent to Claude Code's.\n\n1. Copy `commands\u002F*.md` into `.cursor\u002Frules\u002F` in your project.\n2. The `skills\u002F` directory should be in your workspace so the AI can read skill files when referenced.\n\nThe `.cursor-plugin\u002Fplugin.json` manifest is ready for when Cursor's plugin API adds slash command support.\n\n### Codex\n\nIn Codex, go to **Settings → Plugins → Add Plugin** and point it to this repository using the HTTPS URL:\n\n```text\nhttps:\u002F\u002Fgithub.com\u002Fsuntay44\u002Fweb-to-mobile-magic-plugin\n```\n\nDo not use the SSH form (`git@github.com:suntay44\u002Fweb-to-mobile-magic-plugin.git`) unless your machine already has GitHub SSH keys configured. Codex reads:\n\n```\n.codex-plugin\u002Fplugin.json\n```\n\nAfter installation, ask Codex directly:\n\n```text\nUse the web-to-mobile skill on this repo.\nUse the web-to-mobile skill on https:\u002F\u002Fgithub.com\u002Fyou\u002Fyour-web-app.\nUse the mobile-resume skill on .\u002Fmy-unfinished-app.\n```\n\nSome Codex surfaces may expose skill shortcuts or default prompts, but exact invocation depends on the Codex interface.\n\nIf you see `Permission denied (publickey)`, Codex is trying to clone with SSH. Retry with the HTTPS URL above.\n\n---\n\n## Troubleshooting\n\n### Codex: `Permission denied (publickey)`\n\nUse HTTPS unless your machine already has GitHub SSH keys configured:\n\n```text\nhttps:\u002F\u002Fgithub.com\u002Fsuntay44\u002Fweb-to-mobile-magic-plugin\n```\n\n---\n\n## Stack\n\n| Default | Alternate |\n|---------|-----------|\n| Expo React Native | Swift \u002F SwiftUI (iOS-only, on request) |\n\n---\n\n## Repository Layout\n\n```\nweb-to-mobile\u002F\n├── commands\u002F\n│   ├── web-to-mobile.md       # \u002Fweb-to-mobile\n│   ├── mobile-resume.md       # \u002Fmobile-resume\n│   ├── mobile-scan.md         # \u002Fmobile-scan\n│   ├── mobile-review.md       # \u002Fmobile-review\n│   ├── mobile-audit.md        # \u002Fmobile-audit (standalone)\n│   └── mobile-qa.md           # \u002Fmobile-qa (standalone)\n├── skills\u002F\n│   ├── web-to-mobile\u002F         # Orchestrator: web → mobile\n│   ├── web-to-mobile-audit\u002F   # Inspect web source\n│   ├── mobile-migration-plan\u002F # Route map + checklist + approval\n│   ├── mobile-parity-check\u002F   # Design + functional parity vs. web\n│   ├── mobile-resume\u002F         # Orchestrator: resume unfinished app\n│   ├── mobile-app-audit\u002F      # Inspect existing mobile app\n│   ├── mobile-completion-plan\u002F# Completion status + checklist + approval\n│   ├── mobile-qa-scan\u002F        # QA report (command-driven)\n│   ├── mobile-deep-review\u002F    # Senior review (code-driven)\n│   ├── expo-react-native-build\u002F# Build from approved checklist\n│   └── mobile-qa-release\u002F     # Verify: perf, a11y, layout, release\n├── references\u002F\n│   ├── output-contracts.md        # Shared behavioral rules for all skills\n│   ├── dependency-substitutions.md# Web → mobile dep swap map (drop-in\u002Fconfig\u002Frewrite)\n│   └── framework-migration-notes.md# Per-framework reuse\u002Frewrite guide\n├── scripts\u002F\n│   ├── web-repo-audit.mjs     # Summarizes a web project as JSON\n│   ├── mobile-app-audit.mjs   # Summarizes a mobile app as JSON\n│   └── install.mjs            # Global install \u002F uninstall \u002F refresh\n├── examples\u002F\n│   ├── sample-web-to-mobile-plan.md\n│   └── sample-mobile-completion-plan.md\n├── tests\u002F\n│   ├── fixtures\u002Freact-web\u002F\n│   ├── fixtures\u002Fpartial-expo-app\u002F\n│   ├── pressure-scenarios.md\n│   └── validate-structure.mjs\n├── roadmap\u002F                  # Maintainer release checklists and implementation briefs\n├── .claude-plugin\u002Fplugin.json\n├── .cursor-plugin\u002Fplugin.json\n├── .codex-plugin\u002Fplugin.json\n└── LICENSE\n```\n\n---\n\n## Validate\n\n```bash\nnode tests\u002Fvalidate-structure.mjs\n```\n\nChecks manifests, command wiring, skill frontmatter, token-size limits, required workflow gates, audit script correctness against fixtures, and pressure-test scenario coverage.\n\n---\n\n## FAQ\n\n### How do I convert a website into a mobile app?\n\nInstall WebToMobile in Claude Code, Cursor, or Codex, then run `\u002Fweb-to-mobile` with your website URL, GitHub repo, or local project path. It audits the source, writes a migration plan you approve, builds an Expo React Native app, and verifies it.\n\n### Can I turn a React, Next.js, or Vite web app into a React Native app?\n\nYes. When you give WebToMobile your repository or local source, it reads your actual code — reusing TypeScript types, API clients, validation schemas, and business logic, while flagging DOM components, CSS, and browser APIs that need a mobile rewrite. Next.js App Router, Pages Router, Remix, Vite, Nuxt, SvelteKit, and Astro are all recognized.\n\n### Can it convert a website from just a URL?\n\nA URL gives you a UI\u002FUX-focused result only — layout, navigation, and visual direction inferred from public pages. It cannot see code, state, APIs, or anything behind a login. For a faithful port, provide the GitHub repo or local source.\n\n### Does it work with Claude Code, Cursor, and Codex?\n\nYes. It ships as a plugin\u002Fskill for all three. Claude Code uses slash commands like `\u002Fweb-to-mobile`; Codex and Cursor invoke the same skills through their own interfaces.\n\n### Is WebToMobile free and open source?\n\nYes. It is MIT-licensed and free to use, modify, and distribute.\n\n### Does it build my backend or submit to the App Store?\n\nNo. WebToMobile is a helper, not a magician. It reuses or consumes your existing API, lists release steps, and hands store submission to you. It never generates a backend, provisions infrastructure, or handles secrets.\n\n### What does it target — iOS, Android, or both?\n\nBoth. The default output is Expo React Native, which builds for iOS and Android from one codebase. Swift\u002FSwiftUI is available on request for iOS-only native work.\n\n---\n\n## License\n\nMIT © [Next Level Builder](LICENSE)\n",2,"2026-06-11 04:10:49","CREATED_QUERY"]