MCP in Claude Code: Connect to External Tools, Databases & APIs
Claude Code can read and write files, execute shell commands, and search your codebase. But here’s the problem: it lives in isolation. It can’t talk to your database. It can’t query your Jira board. It can’t inspect network requests in your running app. It can’t access your AWS infrastructure.
Without MCP, Claude Code is smart but limited.
With MCP (Model Context Protocol), Claude Code becomes a full participant in your development ecosystem—talking to databases, APIs, monitoring systems, and custom tools in real-time.
The Problem Without MCP
Imagine you hire the world’s smartest developer. But that desk has:
- No internet
- No database access
- No Jira board
- No Slack
- No GitHub issues
- No internal documentation
- No AWS console
- No monitoring dashboard
How useful are they? Still smart, but frustratingly limited.
That’s Claude Code without MCP.
What Is MCP?
MCP (Model Context Protocol) is an open standard that lets Claude connect to external tools, databases, APIs, and services in real-time—not through copy-paste, not through uploaded files, but through live two-way connections.
Think of it as USB for AI. Just like USB lets you plug any device into any computer, MCP lets you plug any tool/service into Claude Code.
Key insight: MCP servers are extensions—extra tools you hand to Claude. Once connected, Claude doesn’t just know about your database—it can actually talk to it.
Three Perspectives on MCP
Developers: Supercharge Your Workflow
Before MCP: You describe a bug in chat, Claude guesses what’s wrong based on source code.
With MCP: Claude opens your browser, reproduces the bug, reads console errors, inspects network requests, then fixes the code.
Before MCP: You ask Claude to implement a feature from a Jira ticket.
With MCP: Claude fetches the ticket, reads the full requirements, explores the codebase, implements the feature, and creates a PR.
Testers: Automated Testing at Speed
Before MCP: You describe test scenarios in text, Claude writes tests blind.
With MCP (Playwright MCP): Claude:
- Navigates your app at localhost:5173
- Clicks buttons, fills forms with real data
- Takes screenshots at each step
- Reads console errors and warnings
- Generates Playwright test files from its own actions
- Runs tests across Chrome, Firefox, Safari
You get end-to-end tests that actually work, generated by an AI that can see your app.
DevOps: Infrastructure & Automation
Before MCP: You describe infrastructure needs in chat, Claude writes Terraform blind.
With MCP: Claude:
- Queries your AWS, Kubernetes, or Terraform state
- Sees current infrastructure status
- Validates changes against real configs
- Runs deployments and monitors results
- Reads logs from production systems
You get infrastructure changes that are proven to work before they touch production.
MCP in Action: Three Real Examples
Example 1: Chrome DevTools MCP (Developers & Testers)
One command:
claude mcp add chrome-devtools --scope project --npx chrome-devtools-mcp@latest
What happens:
- Claude connects to Chrome DevTools via MCP
- Scopes it to this project only
- Runs the MCP server automatically (no install needed)
Verify it’s working:
/mcp
Developer scenario:
You: “My React app at localhost:5173 has a login form that always fails. Open it, test with sample data, figure out what’s broken, and fix it.”
Claude:
- Opens the browser
- Fills the login form with test data
- Clicks Submit
- Reads console errors and network responses
- Traces the bug back to source code
- Fixes it
Without MCP: Claude reads source files, makes educated guesses. You go back and forth.
With MCP: Claude sees the actual error, fixes it first try.
Example 2: Playwright MCP (Testers & Developers)
One command:
claude mcp add playwright --scope project npx @playwright/mcp@latest
What Playwright does:
- Microsoft’s open-source browser automation
- Controls Chrome, Firefox, Safari
- Clicks, fills forms, waits for elements
- Takes screenshots, intercepts network
- Battle-tested at enterprise scale
Tester scenario:
You: “Walk through my entire user flow (signup → login → dashboard → settings). Capture every console error. Then look at source code and propose fixes ranked by severity.”
Claude walks through your app, collects all errors, reads the code, and proposes fixes with specific file/line numbers.
Tester scenario 2:
You: “Test my checkout flow with edge cases: empty fields, SQL injection strings, extremely long inputs, unicode/emoji, mismatched passwords, already-taken emails. Report what happened for each case.”
Claude tests each edge case, reports which ones the app handled gracefully, which ones failed. Developers get a detailed bug report.
Developer scenario:
You: “Our form submission is timing out in production. Open localhost:5173/checkout, monitor network requests, and tell me which API call is slow.”
Claude opens the form, submits it, watches network requests in real-time, identifies the slow endpoint with timing data.
Example 3: Context7 MCP (Developers & DevOps)
The problem: Claude was trained on data up to a cutoff. When you ask about React 19, it might know React 18 but miss new APIs.
The solution: Context7 indexes official documentation for thousands of libraries and serves docs optimized for AI.
One command:
claude mcp add --transport http context7 --scope project https://mcp.context7.com/mcp
(Note: This is a remote server, different from local npx.)
Developer scenario:
Your app eagerly imports all 18 page components at startup. Everyone pays the load cost, even job seekers who never visit admin pages.
You: “Using context7, look up React Router v7 docs for lazy-loading routes. Then refactor src/App.jsx to lazy-load all pages instead of eager imports.”
Claude:
- Fetches the exact React Router v7 lazy-loading API (not v6, not your memory)
- Refactors with the current best practice
- Adds proper error boundaries and fallbacks
DevOps scenario:
You: “Our staging environment uses a deprecated API endpoint. Query the API docs via context7, identify all callers in the codebase, and refactor them to the new endpoint.”
Claude gets live documentation, finds all callers, refactors them correctly.
Common MCP Scenarios & Outcomes
| Scenario | Without MCP | With MCP | Audience |
|---|---|---|---|
| Frontend bug | Claude guesses from code | Opens browser, sees error, fixes it | Dev/Tester |
| Test generation | Tests written blind | Tests from actual app behavior | Tester |
| API integration | Educated guess | Fetches live API docs, integrates | Dev |
| DB query optimization | Code review only | Queries actual data, proposes indexes | DevOps |
| Jira feature impl | Manual reading | Fetches ticket, implements, creates PR | Dev |
| Prod monitoring | Logs pasted in chat | Queries Sentry/DataDog, fixes bugs live | DevOps |
| Deploy validation | Terraform review | Queries AWS state, validates, deploys | DevOps |
MCP Tool Search & Context Window Efficiency
By default, Claude scans lightweight tool names from all MCP servers. It pulls full schemas only when needed.
Why this matters:
- You can connect 10+ MCP servers without blowing up context
- Idle tools cost almost nothing
- Context only grows when a tool is actually used
- ~95% less context consumption vs loading all schemas upfront
Setting Up MCP for Your Team
For Developers: Chrome DevTools + Context7
# Browser automation + always-fresh docs
claude mcp add chrome-devtools --scope project --npx chrome-devtools-mcp@latest
claude mcp add --transport http context7 --scope project https://mcp.context7.com/mcp
For Testers: Playwright + GitHub
# Browser testing + issue tracking
claude mcp add playwright --scope project npx @playwright/mcp@latest
claude mcp add github --scope project npx @github-mcp/server@latest
For DevOps: AWS + Databases + Monitoring
# Infrastructure + data + alerts
claude mcp add aws --scope project npx @aws-sdk/client-s3@latest
claude mcp add postgres --scope project npx @postgres-mcp/server@latest
claude mcp add datadog --scope project npx @datadog-mcp/server@latest
Real-World Workflow Examples
Developer Workflow: Feature Implementation
- You: “Implement the feature described in Jira ticket ENG-4521”
- Claude (via MCP):
- Fetches Jira ticket details
- Reads full requirements
- Explores codebase
- Implements feature
- Creates PR with description
- You review PR and merge
Tester Workflow: Cross-Browser Testing
- You: “Test my app across Chrome, Firefox, Safari. Capture screenshots at 1920x1080, 768x768, and 375x667. Compare against baseline/. Report visual regressions.”
- Claude (via Playwright MCP):
- Opens app in three browsers
- Takes screenshots at three resolutions
- Compares to baseline images
- Reports differences with visual details
DevOps Workflow: Production Troubleshooting
- You: “Check recent Sentry errors in the auth module. Analyze stack traces. Fix the root cause and create a PR with before/after metrics.”
- Claude (via Sentry MCP):
- Queries Sentry for recent errors
- Reads stack traces
- Finds root cause in codebase
- Implements fix
- Compares error rates before/after
Building Custom MCP Servers
If your tool isn’t in the marketplace, you can build your own MCP server.
Example: Internal documentation system
---
name: internal-docs-mcp
description: Query internal documentation from our wiki
tools: Read, Glob
---
You are an MCP server that queries our internal documentation.
When asked about company policies, architecture decisions, or runbooks,
fetch from our internal wiki at wiki.company.com and serve the results.
This lets Claude access your company’s internal knowledge just like external APIs.
Comparison: MCP vs Traditional Integrations
| Aspect | Copy-Paste | File Upload | MCP |
|---|---|---|---|
| Real-time data | No | No | Yes |
| Live execution | No | No | Yes |
| Bandwidth | Manual | One-time | Efficient |
| Security | Risky | Risky | Scoped |
| Setup time | Minutes | Minutes | One command |
Security & Scoping
MCP servers are scoped:
# Project scope - only available in this project
claude mcp add chrome-devtools --scope project npx chrome-devtools-mcp@latest
# User scope - available in all projects
claude mcp add context7 --scope user https://mcp.context7.com/mcp
Principle of least privilege: Only give Claude the tools it needs for the current task.
Next Steps
- Skills Guide: Create reusable playbooks that use MCP tools
- Sub-Agents Guide: Delegate MCP work to specialized agents
- Rules Guide: Define when and how Claude can use MCP tools
- GitHub Actions Bot: Automate MCP-powered workflows in CI/CD
Resources
- MCP Protocol: https://modelcontextprotocol.io
- Claude Code Docs: https://code.claude.com/docs
- Available MCP Servers: https://smithery.ai
