modelcontextprotocol/ext-apps
4 skills3.1k installs9.6k starsGitHub
Install
npx skills add https://github.com/modelcontextprotocol/ext-appsSkills in this repo
1Create Mcp Appcreate-mcp-app is an agent skill for builders who want interactive MCP Apps—not plain text tool results—in hosts such as Claude Desktop. It explains the mandatory pairing of a callable tool and a UI resource, how metadata wires the resource URI into the tool, and how hosts orchestrate rendering and result delivery. The skill branches on whether you extend an existing MCP server or start fresh, and on frontend choice from React with provided hooks to manual lifecycle for vanilla or other frameworks. Solo developers use it when prompts ask to create an MCP App, add a UI to a tool, scaffold an MCP View, or clarify registration and host integration. It is procedural SDK guidance rather than a hosted generator binary, optimized so agents produce correct registration code and bundling assumptions the first time.1.4kinstalls2Add App To Serveradd-app-to-server is a procedural agent skill for developers who already ship an MCP server with tools and want to enrich those tools with MCP Apps—interactive HTML UIs that render in sandboxed iframes when the host supports them. The workflow centers on the official @modelcontextprotocol/ext-apps SDK: study App lifecycle handlers in the cloned reference repo, decide per-tool whether a UI resource adds value, and wire each tool to a resource URI through _meta.ui.resourceUri so conversational clients can show charts, forms, or dashboards on tool calls. Text-only clients keep receiving normal tool output, so UI is additive. Solo builders building agent-facing products or internal tools use this when users ask to add a view, panel, or app surface to an existing server rather than greenfield scaffolding.649installs3Convert Web AppConvert-web-app is a Model Context Protocol skill for solo builders who already have a working web app and want it to render inside MCP-enabled clients without maintaining two UIs. It guides analysis of the existing app, adds a detection layer for MCP lifecycle versus standard browser loading, and stands up an MCP server that exposes bundled HTML as a resource plus a tool to open it inline. Standalone users still load the page in a browser; MCP paths flow host tool invocation through iframe rendering with shared components. The skill fits when you hear requests to add MCP App support, turn a SPA into a hybrid MCP App, wrap an iframe embed, or keep one codebase for web and agent surfaces. Intermediate familiarity with npm packaging and MCP server concepts helps. Clone the ext-apps SDK tag matching your npm version for reference implementations rather than guessing API shapes.538installs4Migrate Oai Appmigrate-oai-app is an agent skill for builders who already shipped or prototyped on the OpenAI Apps SDK and need a standards-based home on the Model Context Protocol. It walks through converting skybridge-style apps, remapping APIs documented in the ext-apps migration guide, and aligning interactive UI patterns with MCP Apps expectations. Solo founders and indie teams use it when a single codebase must serve Claude Code, Cursor, Codex, and other MCP clients without maintaining a parallel OpenAI-only stack. The workflow emphasizes cloning the tagged ext-apps repository for authoritative examples, using npm/pnpm/yarn to resolve compatible SDK versions, and closing with an explicit Before Finishing checklist so nothing from the mapping tables is left half-ported. It is narrow by design: one migration narrative, not general MCP authoring from scratch.525installs