Esta skill fornece documentação abrangente para criar aplicativos ChatGPT com widgets interativos usando mcp-use e OpenAI Apps SDK. Ela orienta desenvolvedores através de arquitetura, configuração, implementação e padrões avançados para criar experiências ChatGPT ricas e interativas.
تنزيل ZIP المهارة
رفع في Claude
اذهب إلى Settings → Capabilities → Skills → Upload skill
فعّل وابدأ الاستخدام
اختبرها
استخدام "chatgpt-app-builder". How do I create a widget that displays search results?
النتيجة المتوقعة:
- Use o helper widget() no seu handler server.tool()
- Retorne widget({ props: searchResults, output: text('Found X results') })
- Crie um componente React em resources/ que recebe props via useWidget()
استخدام "chatgpt-app-builder". What's the difference between props and output?
النتيجة المتوقعة:
- output: O que o LLM vê na conversa (text, object, markdown)
- props: Dados enviados para a UI do widget (oculto do LLM)
التدقيق الأمني
آمنThis skill is documentation/reference material for building ChatGPT apps with mcp-use. All static analyzer findings are false positives: (1) 'Weak cryptographic algorithm' triggers on 'sha' substring in words like 'shape' - no actual crypto usage; (2) 'Ruby/shell backtick execution' detects markdown code fences, not shell commands; (3) 'System reconnaissance' and 'Hardcoded URL' are documentation patterns; (4) The critical heuristic 'Code execution + Network + Credential access' is triggered by documentation showing code examples with URLs and environment variables - standard documentation practice, not malicious behavior. This skill contains no executable code.
مشكلات منخفضة المخاطر (2)
درجة الجودة
ماذا يمكنك بناءه
Criando Aplicativos ChatGPT com Widgets Interativos
Desenvolvedor aprendendo a criar aplicativos ChatGPT com componentes de UI ricos e interativos usando framework mcp-use
Desenvolvimento de Servidor MCP
Desenvolvedor criando servidores MCP (Model Context Protocol) com widgets React customizados para assistentes de IA
Arquitetura de Plugin ChatGPT
Engenheiro projetando interações baseadas em widget para conversas ChatGPT ou Claude
جرّب هذه الموجهات
Quero criar um aplicativo ChatGPT com widgets interativos usando mcp-use. Como configuro o projeto e crio meu primeiro widget?
Devo usar uma tool ou um widget para uma funcionalidade de busca de restaurante que mostra resultados em uma lista e permite usuários clicarem para detalhes?
Como persisto o estado do widget entre conversas e aciono o LLM a partir de interações do widget?
Crie um widget multi-step com entrada de formulário, chamadas de API e renderização condicional baseada na seleção do usuário.
أفضل الممارسات
- Comece com tools-only, atualize para widgets apenas quando interação visual for necessária
- Mantenha widgets focados em um único propósito - múltiplos widgets simples escalam melhor que um widget complexo
- Use props para dados sensíveis que o LLM não deve ver, output para contexto conversacional
تجنب
- Lazy-loading de dados que devem ser retornados upfront - tool calls são caras
- Usar tools para gerenciamento de estado interno do widget - mantenha seleção de vôos, dados de formulário no estado do widget
- Criar widgets para funcionalidades puramente conversacionais que não precisam de representação visual