DEV Community

brian austin
brian austin

Posted on

Claude Code MCP servers: connect Claude to your database, browser, and APIs

Claude Code MCP Servers: Connect Claude to Your Database, Browser, and APIs

MCP (Model Context Protocol) servers let Claude Code reach outside your filesystem. Instead of pasting database schema into chat, you connect Claude directly to Postgres. Instead of describing your API, Claude calls it live.

Here's how to set up the most useful MCP servers in Claude Code.

What MCP Actually Does

Without MCP, Claude Code sees:

  • Your local files
  • Whatever you paste into the prompt
  • Output from shell commands

With MCP, Claude Code sees:

  • Live database records
  • Browser state and DOM
  • External API responses
  • File system with semantic search

Setting Up MCP Servers

MCP config lives in .claude/mcp.json in your project root:

{
  "mcpServers": {
    "postgres": {
      "command": "npx",
      "args": ["-y", "@modelcontextprotocol/server-postgres", "postgresql://localhost/mydb"]
    },
    "filesystem": {
      "command": "npx",
      "args": ["-y", "@modelcontextprotocol/server-filesystem", "/Users/you/projects"]
    },
    "brave-search": {
      "command": "npx",
      "args": ["-y", "@modelcontextprotocol/server-brave-search"],
      "env": {
        "BRAVE_API_KEY": "your-key-here"
      }
    }
  }
}
Enter fullscreen mode Exit fullscreen mode

Restart Claude Code after editing this file.

1. Postgres MCP Server

The most immediately useful server. Once connected, Claude can:

  • Query your tables directly
  • Understand your schema without you explaining it
  • Write migrations based on real column types
# Install the server
npx -y @modelcontextprotocol/server-postgres postgresql://localhost/mydb
Enter fullscreen mode Exit fullscreen mode

Then ask Claude:

"Look at the users table and write a migration to add an email_verified column with a default of false"

Claude will actually query information_schema.columns first, then write the migration with correct types.

2. Filesystem MCP Server

Gives Claude access to directories outside your project:

{
  "filesystem": {
    "command": "npx",
    "args": [
      "-y", 
      "@modelcontextprotocol/server-filesystem",
      "/Users/you/shared-types",
      "/Users/you/design-tokens"
    ]
  }
}
Enter fullscreen mode Exit fullscreen mode

Useful when your types or configs live in a monorepo root above your project.

3. Puppeteer/Browser MCP Server

Lets Claude control a real browser:

{
  "puppeteer": {
    "command": "npx",
    "args": ["-y", "@modelcontextprotocol/server-puppeteer"]
  }
}
Enter fullscreen mode Exit fullscreen mode

Now you can:

"Open localhost:3000, click the signup button, fill in test@example.com, submit, and tell me what error you see"

Claude will run the browser, take a screenshot, read the DOM, and report back. This is genuinely useful for debugging UI flows without you having to describe them.

4. SQLite MCP Server

For local dev databases:

{
  "sqlite": {
    "command": "npx",
    "args": ["-y", "@modelcontextprotocol/server-sqlite", "./db/development.sqlite"]
  }
}
Enter fullscreen mode Exit fullscreen mode

5. GitHub MCP Server

Connects Claude to your repos, issues, and PRs:

{
  "github": {
    "command": "npx",
    "args": ["-y", "@modelcontextprotocol/server-github"],
    "env": {
      "GITHUB_PERSONAL_ACCESS_TOKEN": "ghp_..."
    }
  }
}
Enter fullscreen mode Exit fullscreen mode

Useful for:

  • Reading open issues and writing fix PRs
  • Searching existing code before writing something new
  • Creating PRs with proper descriptions

Verifying MCP Is Connected

In Claude Code, type /mcp to see connected servers and available tools:

/mcp

Connected servers:
- postgres (9 tools)
- filesystem (5 tools)
- github (12 tools)
Enter fullscreen mode Exit fullscreen mode

If a server isn't showing, check the JSON syntax in .claude/mcp.json — a trailing comma will break the whole config.

A Real Workflow: Database-Driven Feature

Here's a complete example of MCP-powered development:

# 1. Start Claude Code with MCP connected
cd myproject
claude

# 2. Give Claude a task that requires DB knowledge
> "Add a user preferences feature. Check what columns already exist on 
   the users table, add a preferences JSONB column, write a migration, 
   and create GET/PATCH /api/users/:id/preferences endpoints"

# Claude will:
# - Query your users table via Postgres MCP
# - See existing columns (id, email, created_at, etc.)
# - Write an appropriate migration
# - Create the endpoints with correct types
# - Not ask you to describe your schema
Enter fullscreen mode Exit fullscreen mode

Without MCP, you'd spend 10 minutes pasting schema. With MCP, Claude just knows.

Rate Limits and MCP

MCP sessions are stateful. If you're running a complex database migration or browser automation task, Claude Code may use more tokens than usual — especially with large schemas.

If you hit rate limits mid-task, you lose the MCP context and have to restart.

One fix: set ANTHROPIC_BASE_URL to a proxy with higher limits:

export ANTHROPIC_BASE_URL=https://simplylouie.com
Enter fullscreen mode Exit fullscreen mode

SimplyLouie runs Claude Sonnet with no session rate limits at ✌️$2/month — useful for long MCP sessions that need to query the DB 30+ times without interruption.

Building Custom MCP Servers

The protocol is simple enough to implement in an afternoon:

import { Server } from '@modelcontextprotocol/sdk/server/index.js';
import { StdioServerTransport } from '@modelcontextprotocol/sdk/server/stdio.js';

const server = new Server(
  { name: 'my-api-server', version: '1.0.0' },
  { capabilities: { tools: {} } }
);

server.setRequestHandler(ListToolsRequestSchema, async () => ({
  tools: [{
    name: 'get_order',
    description: 'Fetch order by ID from internal API',
    inputSchema: {
      type: 'object',
      properties: { orderId: { type: 'string' } },
      required: ['orderId']
    }
  }]
}));

server.setRequestHandler(CallToolRequestSchema, async (request) => {
  if (request.params.name === 'get_order') {
    const order = await fetchFromInternalAPI(request.params.arguments.orderId);
    return { content: [{ type: 'text', text: JSON.stringify(order) }] };
  }
});

const transport = new StdioServerTransport();
await server.connect(transport);
Enter fullscreen mode Exit fullscreen mode

This gives Claude direct access to your internal APIs without you pasting response examples.

Quick Reference

Server Package Best For
Postgres @modelcontextprotocol/server-postgres Live DB queries
SQLite @modelcontextprotocol/server-sqlite Local dev DB
Filesystem @modelcontextprotocol/server-filesystem Multi-directory access
Puppeteer @modelcontextprotocol/server-puppeteer Browser automation
GitHub @modelcontextprotocol/server-github Issues, PRs, code search
Brave Search @modelcontextprotocol/server-brave-search Web research

MCP is the feature that takes Claude Code from "smart file editor" to "agent that understands your full system". Once you connect your database, you stop describing your schema and start describing what you want built.

Top comments (0)