Mawsool-MCP
A starter template for building MCP and ChatGPT apps using the Skybridge framework.
README
Skybridge Template
A starter TypeScript template for building MCP and ChatGPT Apps with the Skybridge framework.
Getting Started
Prerequisites
- Node.js 24+
Local Development
1. Install
npm install
# or
pnpm install
# or
bun install
# or
deno install
# or
yarn install
2. Start your local server
Run the development server from the root directory:
npm run dev
# or
pnpm dev
# or
bun dev
# or
deno task dev
# or
yarn dev
This command starts:
- Your MCP server at
http://localhost:3000/mcp. - Skybridge DevTools UI at
http://localhost:3000.
3. Project structure
├── src/
│ ├── server.ts # Server entry point
│ ├── views/ # React components (one per view)
│ ├── components/ # Shared UI components
│ ├── helpers.ts # Shared utilities
│ └── index.css # Global styles
├── vite.config.ts
├── alpic.json # Deployment config
└── package.json
Create your first view
1. Add a new view
- Register a tool in
src/server.tswith a unique name (e.g.,my-view) usingregisterTooland aviewconfig. - Create a matching React component at
src/views/my-view.tsx. The file name must match the view name exactly.
2. Edit views with Hot Module Replacement (HMR)
Edit and save components in src/views/ — changes will appear instantly inside your App.
3. Edit server code
Modify files in src/ and refresh the tool list with your MCP Client to see the changes.
Testing your App
You can test your app locally by using our DevTools UI on http://localhost:3000 while running the dev command.
To connect your app with web clients like ChatGPT or Claude, expose your server on the internet by adding the --tunnel flag.
By enabling the tunnel, you'll also be able to access a playground to chat with your app and a real LLM. Learn more by reading the test guide.
Deploy to Production
Skybridge is infrastructure vendor agnostic, and your app can be deployed on any cloud platform supporting MCP.
The simplest way to deploy your app is by running the deploy command, which will push your MCP server to the Alpic cloud for free.
Resources
- Skybridge Documentation
- Apps SDK Documentation
- MCP Apps Documentation
- Model Context Protocol Documentation
- Alpic Documentation
Mawsool-MCP
Recommended Servers
playwright-mcp
A Model Context Protocol server that enables LLMs to interact with web pages through structured accessibility snapshots without requiring vision models or screenshots.
Magic Component Platform (MCP)
An AI-powered tool that generates modern UI components from natural language descriptions, integrating with popular IDEs to streamline UI development workflow.
Audiense Insights MCP Server
Enables interaction with Audiense Insights accounts via the Model Context Protocol, facilitating the extraction and analysis of marketing insights and audience data including demographics, behavior, and influencer engagement.
VeyraX MCP
Single MCP tool to connect all your favorite tools: Gmail, Calendar and 40 more.
graphlit-mcp-server
The Model Context Protocol (MCP) Server enables integration between MCP clients and the Graphlit service. Ingest anything from Slack to Gmail to podcast feeds, in addition to web crawling, into a Graphlit project - and then retrieve relevant contents from the MCP client.
Kagi MCP Server
An MCP server that integrates Kagi search capabilities with Claude AI, enabling Claude to perform real-time web searches when answering questions that require up-to-date information.
E2B
Using MCP to run code via e2b.
Neon Database
MCP server for interacting with Neon Management API and databases
Exa Search
A Model Context Protocol (MCP) server lets AI assistants like Claude use the Exa AI Search API for web searches. This setup allows AI models to get real-time web information in a safe and controlled way.
Qdrant Server
This repository is an example of how to create a MCP server for Qdrant, a vector search engine.