使用说明

ChatGPT Apps Builder - Clawdbot Plugin

Complete ChatGPT Apps builder for Clawdbot with MCP server generation, widgets, auth, database, testing, and deployment.

Note: This is a consolidated single-skill version of the original multi-skill plugin from prompt-circle-claude-plugins.

Features

Complete Workflow: From concept to production deployment
MCP Server Generation: Full TypeScript MCP servers with session management
Widget System: Inline HTML widgets with OpenAI Apps SDK integration
Authentication: Auth0 and Supabase Auth support
Database Integration: PostgreSQL via Supabase with RLS
Testing Framework: Golden prompts and MCP Inspector integration
Validation Suite: 10-point validation before deployment
Automated Deployment: Render deployment with health checks

Installation

Option 1: Extract to plugins directory

unzip chatgpt-apps-builder-clawdbot.zip
mv chatgpt-apps-builder ~/.clawdbot/plugins/

Option 2: Extract to workspace

unzip chatgpt-apps-builder-clawdbot.zip
mv chatgpt-apps-builder <your-workspace>/plugins/

Then restart Clawdbot or start a new session.

Usage

Create a new ChatGPT App

/chatgpt-apps new

Add components

/chatgpt-apps add-tool
/chatgpt-apps add-widget
/chatgpt-apps add-auth
/chatgpt-apps add-database

Test and deploy

/chatgpt-apps validate
/chatgpt-apps test
/chatgpt-apps deploy

Resume work

/chatgpt-apps resume

Commands

Command	Description
`/chatgpt-apps new`	Create a new ChatGPT App from concept
`/chatgpt-apps add-tool`	Add an MCP tool to your app
`/chatgpt-apps add-widget`	Add a widget to display data
`/chatgpt-apps add-auth`	Configure Auth0 or Supabase Auth
`/chatgpt-apps add-database`	Set up PostgreSQL database
`/chatgpt-apps validate`	Run validation suite
`/chatgpt-apps test`	Run automated tests
`/chatgpt-apps deploy`	Deploy to Render
`/chatgpt-apps resume`	Resume working on an app

What Gets Generated

Each ChatGPT App includes:

{app-name}/
├── package.json              # Dependencies and scripts
├── tsconfig.server.json      # TypeScript config
├── setup.sh                  # One-command setup
├── START.sh                  # Multi-mode launcher
├── .env.example              # Environment template
├── .gitignore                # Git ignores
└── server/
    └── index.ts              # Complete MCP server

Key Features

MCP Server Architecture

Server class from MCP SDK
StreamableHTTPServerTransport for HTTP mode
Session management with Map
Widget resources with text/html+skybridge MIME type
Structured content responses for widgets

Widget System

Inline HTML with CSS/JS
OpenAI Apps SDK integration
Preview mode with mock data
Event-driven rendering
5 built-in patterns (Card Grid, Stats, Table, Chart, Detail)

Authentication

Auth0 (OAuth 2.1, social logins)
Supabase Auth (email/password)
User subject extraction
Multi-user isolation

Database

PostgreSQL via Supabase
RLS policies
Automatic schema generation
User-scoped queries

Testing

MCP Protocol tests
Schema validation
Widget rendering tests
Golden prompt validation

Deployment

Render deployment
Docker containerization
Health checks
Environment variable management

State Management

Apps maintain state in .chatgpt-app/state.json:

{
  "appName": "My App",
  "phase": "Implementation",
  "tools": ["list-items", "create-item"],
  "widgets": ["item-list"],
  "auth": { "enabled": true, "provider": "auth0" },
  "database": { "enabled": true, "entities": ["items"] },
  "validated": false,
  "tested": false,
  "deployed": false
}

Requirements

Node.js 18+
TypeScript 5+
For deployment: Git, Docker (optional)
For auth: Auth0 account or Supabase project
For database: Supabase project

Support

GitHub: https://github.com/hollaugo/prompt-circle-claude-plugins
Issues: Report bugs via GitHub Issues
Documentation: See SKILL.md for detailed workflows

License

MIT

Author

Prompt Circle