A comprehensive monorepo template for building documentation chatbots using Mastra with separate MCP server and agent components.
This template demonstrates a modular architecture separating concerns between:
- MCP Server: Standalone server that exposes documentation tools via HTTP/SSE
- Agent: Mastra agent that consumes tools from the MCP server
- Web/Docs Apps: Frontend applications for user interaction
This template includes the following apps and packages:
apps/agent
: Mastra agent that connects to MCP servers for documentation assistanceapps/mcp-server
: Standalone MCP server exposing documentation toolsapps/docs
: Next.js documentation siteapps/web
: Next.js web application
packages/ui
: Shared React component librarypackages/eslint-config
: ESLint configurationspackages/typescript-config
: TypeScript configurations
-
Install dependencies:
pnpm install
-
Set up environment files:
# Copy environment files for each app cp apps/mcp-server/.env.example apps/mcp-server/.env cp apps/agent/.env.example apps/agent/.env
-
Add your OpenAI API key to
apps/agent/.env
:OPENAI_API_KEY=your_openai_api_key_here
-
Start the development servers:
# Start all services pnpm dev # Or start individual services pnpm dev:mcp # MCP server (port 4111) pnpm dev:agent # Agent server (port 4112) pnpm dev:web # Web app (port 3000) pnpm dev:docs # Docs app (port 3001)
The MCP server exposes documentation tools via HTTP/SSE:
# Check server status
curl http://localhost:4111/mcp
# Connect with MCP client
curl -X POST http://localhost:4111/mcp/message \
-H "Content-Type: application/json" \
-d '{"method": "tools/list"}'
The agent consumes MCP tools and provides chat functionality:
# Chat with the docs agent
curl -X POST http://localhost:4112/agents/docsAgent/chat \
-H "Content-Type: application/json" \
-d '{"messages": [{"role": "user", "content": "Tell me about getPlanetaryData"}]}'
# Health check
curl http://localhost:4112/health
Build all apps and packages:
pnpm build
Build specific apps:
pnpm build --filter=@templates/mcp-server
pnpm build --filter=@templates/agent
pnpm dev
- Start all development serverspnpm dev:mcp
- Start only MCP serverpnpm dev:agent
- Start only agent serverpnpm dev:web
- Start only web apppnpm dev:docs
- Start only docs apppnpm lint
- Run linting across all packagespnpm format
- Format code with Prettierpnpm check-types
- Run TypeScript type checking
- Replace
apps/mcp-server/src/data/functions.json
with your documentation data - Modify tools in
apps/mcp-server/src/tools/
- Add new tools and register them in
apps/mcp-server/src/server.ts
- Update agent instructions in
apps/agent/src/mastra/agents/docs-agent.ts
- Configure MCP server connections in
apps/agent/src/mastra/mcp/mcp-client.ts
- Add new agents in
apps/agent/src/mastra/agents/
- Customize the web interface in
apps/web/
- Update documentation site in
apps/docs/
- Modify shared UI components in
packages/ui/
This separation provides several advantages:
- Modularity: MCP server can be deployed independently and consumed by multiple clients
- Scalability: Each component can be scaled separately based on load
- Flexibility: Different frontends can consume the same MCP server
- Development: Teams can work on different components independently
- Deployment: Components can be deployed to different environments or platforms
Each app should be deployed independently:
- MCP Server: Deploy as a standalone service (Docker, serverless, etc.)
- Agent: Deploy with Mastra's built-in deployment options
- Web/Docs: Deploy to Vercel, Netlify, or other hosting platforms
The Agent app should be deployed first, then the deployment URL should be added to the MCP server's MCP_SERVER_URL
environment variable.