Intermediate

Client Integration

Connect your MCP servers to Claude Desktop, Claude Code CLI, Cline, Kilocode, and custom applications.

Claude Desktop

Claude Desktop is the most popular MCP client. Configure it by editing the claude_desktop_config.json file:

Config File Location 
# macOS
~/Library/Application Support/Claude/claude_desktop_config.json

# Windows
%APPDATA%\Claude\claude_desktop_config.json

# Linux
~/.config/Claude/claude_desktop_config.json
claude_desktop_config.json 
{
  "mcpServers": {
    "filesystem": {
      "command": "npx",
      "args": [
        "-y",
        "@modelcontextprotocol/server-filesystem",
        "/Users/you/Documents",
        "/Users/you/Projects"
      ]
    },
    "weather": {
      "command": "node",
      "args": ["/path/to/weather-server/dist/index.js"]
    },
    "python-server": {
      "command": "python",
      "args": ["/path/to/server.py"]
    }
  }
}
✅
After editing: Restart Claude Desktop for changes to take effect. You should see the tools icon (hammer) in the chat input area, showing the number of available tools.

Claude Code CLI

Claude Code supports MCP servers through its configuration. Add servers using the claude mcp command:

Terminal - Claude Code MCP 
# Add a stdio MCP server
claude mcp add filesystem npx -y @modelcontextprotocol/server-filesystem /path/to/dir

# Add a custom server
claude mcp add weather node /path/to/weather-server/dist/index.js

# Add a Python server
claude mcp add my-server python /path/to/server.py

# List configured servers
claude mcp list

# Remove a server
claude mcp remove weather

Cline (VS Code Extension)

Cline supports MCP servers through its VS Code settings. Open the Cline MCP settings panel:

  1. Open Cline Settings

    Click the Cline icon in the VS Code sidebar, then click the server icon (MCP Servers) at the top of the panel.

  2. Add Server Configuration

    Click "Edit MCP Settings" to open the configuration file. Add your server:

Cline MCP Settings 
{
  "mcpServers": {
    "filesystem": {
      "command": "npx",
      "args": [
        "-y",
        "@modelcontextprotocol/server-filesystem",
        "/path/to/allowed/directory"
      ],
      "disabled": false
    }
  }
}

Kilocode (VS Code Extension)

Kilocode uses the same MCP configuration format as Cline. Access MCP settings from the Kilocode panel in VS Code:

Kilocode MCP Settings 
{
  "mcpServers": {
    "github": {
      "command": "npx",
      "args": ["-y", "@modelcontextprotocol/server-github"],
      "env": {
        "GITHUB_PERSONAL_ACCESS_TOKEN": "ghp_your_token_here"
      }
    }
  }
}

Multi-Server Setup

You can connect multiple MCP servers simultaneously. Each server provides its own set of tools, resources, and prompts:

Multi-Server Configuration 
{
  "mcpServers": {
    "filesystem": {
      "command": "npx",
      "args": ["-y", "@modelcontextprotocol/server-filesystem", "/home/user"]
    },
    "postgres": {
      "command": "npx",
      "args": ["-y", "@modelcontextprotocol/server-postgres"],
      "env": {
        "POSTGRES_CONNECTION_STRING": "postgresql://localhost/mydb"
      }
    },
    "github": {
      "command": "npx",
      "args": ["-y", "@modelcontextprotocol/server-github"],
      "env": {
        "GITHUB_PERSONAL_ACCESS_TOKEN": "ghp_..."
      }
    },
    "brave-search": {
      "command": "npx",
      "args": ["-y", "@modelcontextprotocol/server-brave-search"],
      "env": {
        "BRAVE_API_KEY": "BSA..."
      }
    }
  }
}
📚
Server Isolation: Each MCP server runs as a separate process with its own context. Servers cannot see or interact with each other. The AI model can use tools from all connected servers in a single conversation.

Environment Variables

Pass environment variables to MCP servers using the env field. This is commonly used for API keys and connection strings:

Environment Variables 
{
  "my-server": {
    "command": "node",
    "args": ["dist/index.js"],
    "env": {
      "API_KEY": "sk-...",
      "DATABASE_URL": "postgresql://...",
      "LOG_LEVEL": "debug"
    }
  }
}
⚠
Security: The config file stores environment variables in plain text. Keep this file secure and never commit it to version control. Consider using a secrets manager for production deployments.

Debugging Connections

When an MCP server fails to connect, use these debugging strategies:

  1. Check the server logs

    For Claude Desktop, open Developer Tools (Help → Toggle Developer Tools) and check the Console tab. Look for MCP-related error messages.

  2. Test the server manually

    Run the server command directly in your terminal to verify it starts without errors.

  3. Use the MCP Inspector

    Run npx @modelcontextprotocol/inspector to test your server interactively and see JSON-RPC messages.

  4. Verify paths and permissions

    Ensure all file paths are absolute and the server binary/script has execute permissions.

What's Next?

The next lesson explores popular community MCP servers you can install and use right away.

← Previous Tools & Resources