MCP Server Setup
Learn how to configure and use the 13 MCP servers included with your Craft template for enhanced AI-powered development with Claude Code.
✨ What are MCP Servers?
Model Context Protocol (MCP) servers extend Claude Code's capabilities by providing specialized tools and context. They enable Claude to:
- • Access full project context (150-200K tokens)
- • Validate code against quality rules
- • Check architecture boundaries
- • Run type-checking and tests
- • Interact with GitHub, Supabase, and more
Auto-Configured Servers (11)
These servers are automatically configured during pnpm install via the postinstall script. No additional setup required!
| Server | Description |
|---|---|
crafted-context | Full project context (150-200K tokens) |
crafted-cli | Code generation (routers, pages, components) |
rules-validator | Validates code against Craft quality rules |
architecture-guard | Validates architecture boundaries |
typescript | Type-checking and compilation |
vitest | Test runner and coverage |
filesystem | File operations |
github | GitHub integration |
sequential-thinking | Advanced reasoning for complex problems |
shadcn | shadcn/ui component integration |
chrome-devtools | Browser automation and testing |
Manual Setup Required (2)
These servers require additional configuration to work properly:
1. Git MCP Server
Enables Claude Code to interact with your git repository (commit history, branches, etc.).
Setup Instructions:
# Initialize git repositorygit init# Add files and create first commitgit add .git commit -m "Initial commit"✅ Verification:
Run git log and you should see your first commit.
2. Supabase MCP Server
Enables Claude Code to interact with your Supabase project (database, auth, storage).
Setup Instructions:
- Create a Supabase project at supabase.com
- Copy your project credentials from Settings → API
- Add them to
apps/web/.env.local:
DATABASE_URL="postgresql://..."NEXT_PUBLIC_SUPABASE_URL="https://xxx.supabase.co"NEXT_PUBLIC_SUPABASE_ANON_KEY="eyJ..."SUPABASE_SERVICE_ROLE_KEY="eyJ..."✅ Verification:
Run pnpm db:push to test the database connection.
Troubleshooting
❓ How do I verify MCP servers are running?
Open Claude Code in your project directory:
claude-code .You should see MCP servers listed in the status bar or available tools panel.
❓ An MCP server failed to connect
Check the postinstall script output:
pnpm installLook for errors in the postinstall section. Common issues:
- Missing
claudeCLI - install Claude Code first - Permission errors - run
chmod +x scripts/setup-mcp.sh - Missing dependencies - run
pnpm installagain
❓ I want to add custom MCP servers
You can add additional MCP servers using the Claude Code CLI:
# Example: Add a custom MCP serverclaude mcp add --scope project my-server -- node ./path/to/server.jsSee the Claude Code documentation for more details on custom MCP servers.