$npx skillfedfor your agent

chatgpt-app-builder

ChatGPT App Builder streamlines development of ChatGPT applications featuring interactive React widgets through the mcp-use framework and OpenAI Apps SDK. It eliminates manual configuration by auto-registering widgets, providing built-in React hooks, and handling bundling and CSP setup automatically. The skill supports both MCP Apps and ChatGPT Apps SDK protocols, enabling widgets to work across multiple clients while maintaining compatibility.

ChatGPT App Builder lets you create production ChatGPT apps with interactive React widgets using mcp-use and OpenAI Apps SDK.

AI-generated summary based on this skill's SKILL.md

1 0 Apache-2.0updated by mcp-use

Decision gist · record as of 2026-01-31

ChatGPT App Builder lets you create production ChatGPT apps with interactive React widgets using mcp-use and OpenAI Apps SDK. ChatGPT App Builder streamlines development of ChatGPT applications featuring interactive React widgets through the mcp-use framework and OpenAI Apps SDK. It eliminates manual configuration by auto-registering widgets, providing built-in React hooks, and handling bundling and CSP setup automatically. The skill supports both MCP Apps and ChatGPT Apps SDK protocols, enabling widgets to work across multiple clients while maintaining compatibility.

manual: git clone https://github.com/mcp-use/skills → cp -r skills/skills/chatgpt-app-builder ~/.claude/skills/chatgpt-app-builder
skills/chatgpt-app-builder/SKILL.md · version 9f6453a4

Use it when

  • ChatGPT App Builder's mcp-use framework enables zero-config widget development by auto-registering React components and handling protocol.
  • Yes, ChatGPT App Builder supports dual-protocol widget deployment.

Verify before relying

Read SKILL.md below before installing (2 files). Open directory: indexed for reading, not audited.

Same gist for agents: .md · .json

Install

mcp-use/skills/chatgpt-app-builder

Open directory. Skills are indexed for reading, not audited. Review a skill's body before installing it.

Frequently asked questions

AI-generated answers based on this skill's SKILL.md and metadata

How do I build a ChatGPT app with interactive widgets?

ChatGPT App Builder streamlines creating ChatGPT applications with interactive React widgets through the mcp-use framework. You define React components, and the framework auto-registers them as widgets, handles bundling, and manages CSP policies automatically. Built-in React hooks simplify state management and ChatGPT integration, letting you focus on UI logic rather than configuration.

What is the mcp-use framework for apps?

ChatGPT App Builder's mcp-use framework enables zero-config widget development by auto-registering React components and handling protocol details. It supports both MCP Apps and ChatGPT Apps SDK protocols, allowing your widgets to work across multiple clients. The framework provides built-in hooks and automatic bundling, eliminating manual setup.

Can ChatGPT App Builder widgets work with both MCP and ChatGPT protocols?

Yes, ChatGPT App Builder supports dual-protocol widget deployment. Widgets created with the mcp-use framework automatically work with both MCP Apps and ChatGPT Apps SDK protocols, enabling compatibility across different clients without requiring separate implementations or configuration changes.

How does ChatGPT App Builder handle widget metadata and CSP setup?

ChatGPT App Builder automates widget metadata configuration and Content Security Policy setup. You define widget props and metadata declaratively, and the framework handles CSP policy generation and bundling automatically. This eliminates manual security configuration while ensuring your production apps meet ChatGPT's requirements.

What makes ChatGPT App Builder production-ready?

ChatGPT App Builder includes built-in Inspector for testing and debugging, automatic CSP policy handling, and support for production deployment across both MCP and ChatGPT protocols. The framework manages bundling, widget registration, and security configuration automatically, reducing deployment complexity.

Does ChatGPT App Builder require manual configuration?

No, ChatGPT App Builder provides zero-config widget development. It auto-registers React components, handles bundling, manages CSP policies, and configures metadata automatically. You write React code and the framework handles the rest, significantly reducing setup overhead for production ChatGPT applications.

SKILL.md

Rendered from the published skill. Quoted content, verbatim.

ChatGPT App Builder

Build production-ready ChatGPT apps with interactive widgets using the mcp-use framework and OpenAI Apps SDK. This skill provides zero-config widget development with automatic registration and built-in React hooks.

Quick Start

Always bootstrap with the MCP Apps template:

npx create-mcp-use-app my-chatgpt-app --template mcp-apps
cd my-chatgpt-app
yarn install
yarn dev

This creates a project structure:

my-chatgpt-app/
├── resources/              # React widgets (auto-registered!)
│   ├── display-weather.tsx # Example widget
│   └── product-card.tsx    # Another widget
├── public/                 # Static assets
│   └── images/
├── index.ts               # MCP server entry
├── package.json
├── tsconfig.json
└── README.md

Why mcp-use for ChatGPT Apps?

Traditional OpenAI Apps SDK requires significant manual

(truncated - see the full file via the links below)

File tree — 2 files
skills/chatgpt-app-builder/LICENSE.txt
skills/chatgpt-app-builder/SKILL.md

Let your AI agent find skills like this

Example. Real query, live index.

You found this page by searching. An agent finds it by wishing: SkillFed indexes 56,283 agent skills by what they can do, searchable in plain language.

wish › “Build production ChatGPT apps with interactive React widgets”

Give your agent the search over MCP, or paste the wish link into any chat. No install? Search from any chat →

Related skills

mcp-builder
by mcp-use · mcp-use/skills

This skill guides you through building production-ready MCP servers using the mcp-use framework. Learn to scaffold projects with templates, define tools and resources, create reusable prompts, test locally with the Inspector UI, and deploy to mcp-use Cloud.

Apache-2.0updated Jan 2026
★ 1repo stars
chatgpt-app-builder
by mcp-use · mcp-use/mcp-use

A comprehensive reference guide covering MCP server fundamentals, authentication strategies, and feature implementation patterns. Provides structured navigation to architecture decisions, security considerations, and common pitfalls across tools, resources, prompts, widgets, and deployment scenarios.

MITupdated Jul 2026
★ 10,400repo stars
mcp-apps-builder
by mcp-use · mcp-use/mcp-use

mcp-apps-builder is a comprehensive reference guide for constructing MCP servers using the mcp-use framework. It covers foundational concepts, authentication integration, backend feature implementation, and visual widget development, with detailed patterns for tools, resources, prompts, and deployment strategies.

MITupdated Jul 2026
★ 10,400repo stars
mcp-builder
by mcp-use · mcp-use/mcp-use

mcp-builder is a comprehensive guide for creating MCP servers using the mcp-use framework. It covers scaffolding new projects, implementing core features like tools and resources, adding authentication, and building interactive widgets. The skill provides navigation to detailed reference files on architecture, deployment, and common patterns to follow throughout development.

MITupdated Jul 2026
★ 10,400repo stars
mcp-apps-builder
by Shubhamsaboo · Shubhamsaboo/awesome-llm-apps

A comprehensive reference guide for building production-grade MCP servers using mcp-use. Covers server architecture, authentication patterns, tool and resource implementation, prompt templates, and React-based widgets with detailed examples and decision trees for each component.

Apache-2.0updated Jul 2026
★ 128,171repo stars
mcp-builder
by Pixel-Process-UG · Pixel-Process-UG/superkit-agents

Create MCP servers that expose capabilities to AI clients through a structured development process covering tool definition, resource management, prompt templates, and transport configuration. The skill guides you through design decisions, implementation patterns, security hardening, and testing to deploy servers ready for CLI and web environments.

MITupdated Mar 2026
★ 1repo stars
Tags
widget-frameworkapp-developmentreact-integrationprotocol-agnosticinteractive-uimcp-protocolproduction-readyzero-config-setupdual-protocolcsp-management