MCPClaude CodeSetup GuideTutorial

How to Set Up MCP Servers in Claude Code: Step-by-Step Guide

Complete guide to installing and configuring MCP servers in Claude Code. GitHub, Brave Search, Playwright, databases, and more.

March 27, 2026·11 min read

MCP (Model Context Protocol) is what transforms Claude Code from a smart code editor into a full development environment. Without MCP, Claude can read and write your code. With MCP, Claude can also create GitHub issues, query your database, search the web, run browser tests, send Slack messages, and interact with any external system that has an MCP server.

The difference is not incremental. It is a category change. Installing three MCP servers takes 10 minutes and fundamentally changes what you can delegate to Claude Code.

This guide walks through exactly how MCP works, how to install servers, how to configure them, and which servers are worth your time.


Key Takeaways

  • MCP is an open protocol that lets Claude Code interact with external tools through a standardized client-server architecture
  • Most MCP servers install with a single command using npx or uvx and require minimal configuration
  • The three highest-impact MCP servers for developers are GitHub, Brave Search, and Playwright
  • Claude Code supports two transport modes: stdio (local, fastest) and SSE/Streamable HTTP (remote)
  • MCP servers stack: you can run multiple servers simultaneously, and Claude uses them as needed
  • Security best practices require storing API tokens in environment variables and rotating them every 90 days

What is MCP?

Model Context Protocol is an open standard created by Anthropic that lets AI applications interact with external systems in a standardized way. Instead of building custom integrations for every tool, MCP provides a universal interface.

The architecture has three parts:

  • MCP Host: The application running Claude (Claude Code, Claude Desktop)
  • MCP Server: A program that exposes tools from an external system (GitHub, a database, a browser)
  • MCP Client: The connection layer between host and server

When you install an MCP server for GitHub, Claude Code gains access to tools like create_issue, create_pull_request, search_repositories, and get_file_contents. Claude sees these tools and uses them automatically when a task requires it.

You do not need to tell Claude "use the GitHub MCP server." You say "create a PR for these changes" and Claude calls the right tools.

Why MCP Matters

Without MCP, you are the integration layer. Claude tells you what to do, and you do it manually: copy this to GitHub, run that query, check this page in the browser. With MCP, Claude handles these steps directly. The workflow goes from conversational to autonomous.

For a broader overview of the best MCP servers available, see our complete guide to MCP servers for Claude.


Prerequisites

Before installing any MCP server, verify these requirements:

  • Node.js 18+ (run node -v to check; most MCP errors come from outdated Node.js)
  • npm 9+ (run npm -v)
  • Claude Code installed and authenticated
  • Python 3.10+ (only needed for Python-based MCP servers; run python --version)

Most MCP servers are distributed as npm packages or Python packages. If you have Node.js and Claude Code running, you are ready for 90% of MCP servers.


Transport Modes

MCP supports multiple transport modes. Understanding them matters for configuration.

TransportLatencyUse CaseHow It Works
stdio< 5msLocal serversClaude Code launches the server process and communicates via stdin/stdout
SSEVariableRemote serversServer runs elsewhere; communicates via Server-Sent Events over HTTP
Streamable HTTPVariableRemote/cloud serversNewer HTTP-based transport for hosted MCP servers

For most developers, stdio is the right choice. It is the fastest, simplest, and most reliable. Use SSE or Streamable HTTP only when the server needs to run on a remote machine or in the cloud.


How to Add an MCP Server to Claude Code

There are two ways to add MCP servers: via the Claude Code CLI or by editing the configuration file directly.

Method 1: CLI Command

The fastest way. From your terminal:

claude mcp add <server-name> -- <command> [args...]

Example for the GitHub MCP server:

claude mcp add github -- npx -y @modelcontextprotocol/server-github

This registers the server with Claude Code. It will launch automatically when needed.

Method 2: Edit Configuration Directly

MCP server configuration lives in .claude/settings.json in your project directory (project scope) or ~/.claude/settings.json (global scope).

{
  "mcpServers": {
    "github": {
      "command": "npx",
      "args": ["-y", "@modelcontextprotocol/server-github"],
      "env": {
        "GITHUB_PERSONAL_ACCESS_TOKEN": "${GITHUB_TOKEN}"
      }
    }
  }
}

The env field passes environment variables to the server process. Always use references to environment variables (like ${GITHUB_TOKEN}) rather than hardcoding tokens in the configuration file.

Configuration Scopes

  • Project scope (.claude/settings.json): MCP servers available only in this project. Commit this file so your team shares the same setup.
  • User scope (~/.claude/settings.json): MCP servers available in all projects. Use this for personal tools like Brave Search.

Installing the Essential MCP Servers

These three servers cover the majority of developer needs. Install all three and your Claude Code experience transforms immediately.

1. GitHub MCP Server

What it does: Lets Claude interact with GitHub. Create issues, open PRs, review code, search repositories, read file contents, manage branches.

Install:

claude mcp add github -- npx -y @modelcontextprotocol/server-github

Set up authentication:

  1. Create a GitHub Personal Access Token at github.com/settings/tokens
  2. Select scopes: repo, read:org, read:user
  3. Set the environment variable:
export GITHUB_TOKEN=ghp_your_token_here

Add this to your shell profile (.bashrc, .zshrc) so it persists across sessions.

What you can do with it:

  • "Create a PR for the changes on this branch with a description of what changed"
  • "Look at the open issues labeled 'bug' and fix the easiest one"
  • "Review the latest PR and leave comments on any issues you find"
  • "Search our org's repos for how we handle authentication"

This is the single highest-ROI MCP server for any developer working with GitHub.

2. Brave Search MCP Server

What it does: Gives Claude web search capabilities. Look up documentation, find solutions, research libraries, check current information.

Install:

claude mcp add brave-search -- npx -y @anthropic-ai/mcp-server-brave-search

Set up authentication:

  1. Get a free API key from brave.com/search/api
  2. Set the environment variable:
export BRAVE_API_KEY=your_key_here

What you can do with it:

  • "Search for the latest migration guide from Prisma 5 to Prisma 6"
  • "Find the documentation for the useOptimistic hook in React 19"
  • "Look up common solutions for CORS issues with FastAPI"

Without Brave Search, Claude is limited to its training data. With it, Claude can look up current documentation and solutions.

3. Playwright MCP Server

What it does: Gives Claude browser automation capabilities. Navigate web pages, take screenshots, interact with elements, run end-to-end tests.

Install:

claude mcp add playwright -- npx -y @anthropic-ai/mcp-server-playwright

No API key required for local usage.

What you can do with it:

  • "Open the app at localhost:3000 and screenshot the dashboard page"
  • "Navigate to the signup flow and test it end-to-end"
  • "Check if the mobile responsive layout breaks on the pricing page"

Playwright MCP is especially valuable for frontend development. Claude can actually see what your app looks like and test user flows.


Installing Additional MCP Servers

Beyond the essential three, here are servers worth considering based on your stack:

PostgreSQL MCP Server

claude mcp add postgres -- npx -y @modelcontextprotocol/server-postgres "postgresql://user:password@localhost:5432/mydb"

Lets Claude query your database, inspect schemas, and write migrations based on actual data structures.

Filesystem MCP Server

claude mcp add filesystem -- npx -y @modelcontextprotocol/server-filesystem /path/to/allowed/directory

For Claude Desktop users, this provides file system access similar to what Claude Code has natively. For Claude Code users, this is useful when you need to give Claude access to directories outside your project root.

Slack MCP Server

claude mcp add slack -- npx -y @anthropic-ai/mcp-server-slack

Requires a Slack Bot Token. Lets Claude read channels, post messages, and search conversation history. Useful for pulling context from team discussions into development tasks.

Memory MCP Server

claude mcp add memory -- npx -y @modelcontextprotocol/server-memory

Gives Claude persistent memory across sessions using a knowledge graph. Claude can store and recall facts, decisions, and preferences without relying on CLAUDE.md for everything.


Verifying Your MCP Setup

After installing servers, verify they are working:

claude mcp list

This shows all registered MCP servers and their status. You can also check a specific server:

claude mcp get github

To test that a server is functional, start a Claude Code session and ask Claude to use one of its tools:

Use the GitHub MCP to list the open issues on this repository.

If Claude successfully retrieves the issues, the server is working. If you get an error, check the troubleshooting section below.


Troubleshooting Common Issues

"MCP server failed to start"

Most common cause: Node.js version too old. Run node -v and ensure you are on version 18 or higher. This accounts for the vast majority of MCP startup failures.

Fix:

nvm install 22
nvm use 22

"Tool not found" or Claude does not use MCP tools

Cause: The server is registered but not running, or the server's tools are not being exposed correctly.

Fix: Remove and re-add the server:

claude mcp remove github
claude mcp add github -- npx -y @modelcontextprotocol/server-github

Authentication errors

Cause: Missing or expired API token.

Fix: Verify the environment variable is set:

echo $GITHUB_TOKEN

If empty, set it again and restart your terminal session. Environment variables set in the current shell are not automatically available to Claude Code if it was started in a different shell.

Server crashes during operation

Cause: Often a memory issue with large payloads or a timeout.

Fix: Check if the server has a --timeout option. For custom servers, increase the timeout in the configuration:

{
  "mcpServers": {
    "github": {
      "command": "npx",
      "args": ["-y", "@modelcontextprotocol/server-github"],
      "env": {
        "GITHUB_PERSONAL_ACCESS_TOKEN": "${GITHUB_TOKEN}"
      },
      "timeout": 30000
    }
  }
}

Security Best Practices

MCP servers have access to external systems. Treat their configuration with the same care as any other credential.

Store Tokens in Environment Variables

Never put API tokens directly in configuration files, especially files that might be committed to version control:

// BAD - token in plain text
"env": { "GITHUB_PERSONAL_ACCESS_TOKEN": "ghp_abc123..." }

// GOOD - reference to environment variable
"env": { "GITHUB_PERSONAL_ACCESS_TOKEN": "${GITHUB_TOKEN}" }

Rotate Tokens Regularly

Security best practices recommend rotating MCP-related tokens every 90 days. Set a calendar reminder. When a token is compromised, the blast radius is whatever that MCP server has access to.

Use Minimal Scopes

When creating API tokens (GitHub, Slack, etc.), grant only the permissions the MCP server actually needs. A GitHub token for code review does not need delete_repo permissions.

Restrict MCP Servers Per Project

Use project-scope configuration (.claude/settings.json) for sensitive servers. A project that does not need database access should not have the PostgreSQL MCP server configured. Principle of least privilege applies here.


Building Custom MCP Servers

If you need Claude to interact with an internal tool or proprietary API, you can build a custom MCP server. The MCP SDK is available in TypeScript and Python.

A minimal MCP server in TypeScript:

import { McpServer } from "@modelcontextprotocol/sdk/server/mcp.js";
import { StdioServerTransport } from "@modelcontextprotocol/sdk/server/stdio.js";

const server = new McpServer({ name: "my-tool", version: "1.0.0" });

server.tool("get_status", "Get the current system status", {}, async () => {
  const status = await fetchSystemStatus(); // your logic here
  return { content: [{ type: "text", text: JSON.stringify(status) }] };
});

const transport = new StdioServerTransport();
await server.connect(transport);

Register it with Claude Code:

claude mcp add my-tool -- node /path/to/my-server.js

The MCP SDK handles all the protocol details. You just define the tools and their implementation. For community-built servers and more examples, check Smithery.ai which hosts over 1,000 MCP servers with one-click installation.


Frontend Developer

  • GitHub MCP (PRs, issues)
  • Brave Search (documentation lookups)
  • Playwright (visual testing, screenshots)

Backend Developer

  • GitHub MCP (PRs, issues)
  • PostgreSQL MCP (database queries, schema inspection)
  • Brave Search (API documentation)

Full-Stack Developer

  • All of the above, plus:
  • Slack MCP (team communication context)
  • Memory MCP (persistent context across sessions)

DevOps / Platform Engineer

  • GitHub MCP (infrastructure repos)
  • Brave Search (troubleshooting)
  • Custom MCP servers for internal tools (deployment systems, monitoring)

Next Steps

Start with the three essential servers: GitHub, Brave Search, and Playwright. Install them now. The total setup time is under 10 minutes.

Once you experience Claude Code with MCP access, you will not go back. The combination of autonomous code execution and external tool access makes Claude Code the closest thing to having another developer on your team.

For more on getting the most out of Claude Code, read our tips and tricks guide. To understand how Claude Code compares to other AI coding tools, see our Claude Code vs Cursor comparison. And explore our directory of Claude tools and resources for more MCP servers and extensions.

The Claude Code Brief. Weekly. No noise.

One email/week. MCP patterns, agent architectures, and tools builders actually use in production.

No spam. Read the archive first.

Ready to try Claude?

Free to use. No credit card required.

Try Claude Free →