Hello Widget Example
Click on "Install Server".
Wait a few minutes for the server to deploy. Once ready, it will show a "Started" state.
In the chat, type
@followed by the MCP server name and your instructions, e.g., "@Hello Widget ExampleSay hello to Bob with confetti"
That's it! The server will respond to your query, and you can continue using it as needed.
Here is a step-by-step guide with screenshots.
Hello Widget Example
A minimal ChatGPT app with interactive greeting widget, confetti animation, and theme support.
Built with Smithery CLI
Prerequisites
Smithery API key: Get yours at smithery.ai/account/api-keys
Getting Started
Install dependencies:
npm installStart smithery playground:
npm run dev
Try asking: "Say hello to Alice"
Development
Your code is organized as:
app/server/- MCP server with widget resourceapp/shared/- Shared TypeScript typesapp/web/src/- React widget component
Edit app/web/src/greeter.tsx to customize the widget UI.
Build
npm run buildCreates bundled server and widget JS in .smithery/
Deploy
Ready to deploy? Push your code to GitHub and deploy to Smithery:
Create a new repository at github.com/new
Initialize git and push to GitHub:
git add . git commit -m "Hello widget" git remote add origin https://github.com/YOUR_USERNAME/YOUR_REPO.git git push -u origin mainDeploy your app to Smithery at smithery.ai/new
Learn More
Related MCP Connectors
MCP server for AI dialogue using various LLM models via AceDataCloud
Hosted MCP server connecting claude.ai, ChatGPT and other AI apps to your own computer
MCP server for GLM chat completions using Zhipu AI models via AceDataCloud
Latest Blog Posts
- Who's Calling? MCP Hosts Are an Identity Blind Spot (And the Spec Knows It)By Om-Shree-0709 on .mcpAgent IdentityOAuth 2.1
- Your AI Chatbot Just Exposed Your CEO's Salary to an InternBy Om-Shree-0709 on .Agent IdentityMCP SecurityOAuth Delegation
- Why MCP Servers Need Execution Sandboxing (And Why Your Current Stack Isn't Enough)By Om-Shree-0709 on .Agentic AiPrompt InjectionWebAssembly
MCP directory API
We provide all the information about MCP servers via our MCP API.
curl -X GET 'https://glama.ai/api/mcp/v1/servers/arjunkmrm/tic-tac-toe'
If you have feedback or need assistance with the MCP directory API, please join our Discord server