mcp-tool-resource-pattern
Implements the core MCP Apps architectural pattern where a Tool declares _meta.ui.resourceUri referencing a registered Resource. Covers registerAppTool, registerAppResource, text fallback, structuredContent, and app-only helper tools.
npx skills add a5c-ai/babysitter --skill mcp-tool-resource-pattern --agent claude-code
Same command for any agent — swap --agent for codex, cursor, copilot.
Weekly change comes from our own snapshots, not the repository page — it measures attention, not adoption.
# mcp-tool-resource-pattern Implement the foundational Tool + Resource pattern that every MCP App requires: a Tool that returns data and references a Resource that serves the interactive UI. ## Overview Every MCP App is built on the Tool + Resource pattern: 1. **Tool** (registered via `registerAppTool`): Called by the LLM/host, returns data. Its `_meta.ui.resourceUri` tells the host which Resource provides the UI. 2. **Resource** (registered via `registerAppResource`): Serves a bundled HTML file that renders the interactive UI in a sandboxed iframe. 3. The tool passes data to the UI via `structuredContent` (available in `ontoolresult` handler). 4. The tool MUST also return a `content` array with text fallback for non-UI hosts. ## Capabilities ### registerAppTool Implementation - Register tools with `_meta.ui.resourceUri` linking to a resource - Pass data via `structuredContent` for rich UI rendering - Always include `content` array with text fallback - Configure tool input schemas via Zod ### registerAppResource Implementation - Register HTML resources with `RESOURCE_MIME_TYPE` - Serve single-file bundled HTML - Configure CSP domains in `contents[]` return - Support multiple tools
- Overview
- Capabilities
- registerAppTool Implementation
- registerAppResource Implementation
- App-Only Helper Tools
- Graceful Degradation
- Usage
- Basic Tool + Resource Pattern
- Client-Side: Calling App-Only Tools
- Multiple Tools Sharing One Resource
- Critical Rules
- Verification Checklist
- Task Definition
- Applicable Processes
What does the mcp-tool-resource-pattern skill do?
Implements the core MCP Apps architectural pattern where a Tool declares _meta.ui.resourceUri referencing a registered Resource. Covers registerAppTool, registerAppResource, text fallback, structuredContent, and app-only helper tools.
How do I install it?
Run `npx skills add a5c-ai/babysitter --skill mcp-tool-resource-pattern --agent claude-code` — it drops the skill into your project so the agent can pick it up. Swap the --agent value for codex, cursor or copilot if you use one of those.
Where does this skill come from?
From a5c-ai/babysitter, a repository with 1,642 stars. We read it straight from the repository tree rather than a submitted listing, so what you see here is what is actually published.
Is a popular skill a good skill?
Not necessarily. Stars measure attention, not adoption — a repository can trend for a week and be abandoned. That is why we show the weekly change from our own snapshots next to the total, instead of a single flattering number.