Claude TypeScript MCP Servers

A collection of Model Context Protocol (MCP) servers aimed at software developers who use LLMs for development assistance. While many developers prefer Cline for its direct VSCode integration, it uses a pay-per-use API that becomes costly with heavy usage. This project leverages the flat-rate Claude Pro subscription by connecting Claude Desktop application with custom MCP servers, providing comparable development assistance capabilities without the variable costs.

日本語による解説記事: Cline任せでコード書いてたらAPIクレジットが爆散したのでClaude Desktop + MCPをいい感じにしてサブスクだけで無双する

Overview

This project implements several MCP servers that can be used with Claude Desktop to enhance its capabilities for software development:

• Brave Search: Provides web search and local search functionality using the Brave Search API
• Filesystem: Enables file system operations with security restrictions
• Git: Provides Git functionality for managing repositories
• GitHub: Enables interaction with GitHub repositories, issues, pull requests, and more
• Shell: Allows execution of shell commands in a controlled environment
• Puppeteer: Enables browser automation and web interaction through Puppeteer
• Fetch: Retrieves content from URLs and converts HTML to Markdown for improved readability

Requirements

• Node.js (v18+)
• Bun as the JavaScript/TypeScript runtime
• Claude Desktop application

Installation

1. Clone the repository:

   git clone https://github.com/yourusername/claude-ts-mcps.git
   cd claude-ts-mcps
   

2. Install dependencies:

   bun install
   

Configuration

To use these MCP servers with Claude Desktop, you need to create a configuration file that tells Claude how to connect to them. Here's an example configuration:

{
    "mcpServers": {
        "brave-search": {
            "command": "/Users/username/.bun/bin/bun",
            "args": [
                "run",
                "/Users/username/Documents/claude-ts-mcps/src/brave-search.ts"
            ],
            "env": {
                "BRAVE_API_KEY": "YOUR_BRAVE_API_KEY"
            }
        },
        "filesystem": {
            "command": "/Users/username/.bun/bin/bun",
            "args": [
                "run",
                "/Users/username/Documents/claude-ts-mcps/src/filesystem.ts",
                "/Users/username"
            ]
        },
        "git": {
            "command": "/Users/username/.bun/bin/bun",
            "args": [
                "run",
                "/Users/username/Documents/claude-ts-mcps/src/git.ts"
            ]
        },
        "github": {
            "command": "/Users/username/.bun/bin/bun",
            "args": [
                "run",
                "/Users/username/Documents/claude-ts-mcps/src/github.ts"
            ],
            "env": {
                "GITHUB_PERSONAL_ACCESS_TOKEN": "YOUR_DEFAULT_TOKEN",
                "GITHUB_TOKEN_WORK": "YOUR_WORK_ACCOUNT_TOKEN",
                "GITHUB_TOKEN_PERSONAL": "YOUR_PERSONAL_ACCOUNT_TOKEN"
            }
        },
        "shell": {
            "command": "/Users/username/.bun/bin/bun",
            "args": [
                "run",
                "/Users/username/Documents/claude-ts-mcps/src/shell.ts"
            ]
        },
        "puppeteer": {
            "command": "/Users/username/.bun/bin/bun",
            "args": [
                "run",
                "/Users/username/Documents/claude-ts-mcps/src/puppeteer.ts"
            ]
        },
        "fetch": {
            "command": "/Users/username/.bun/bin/bun",
            "args": [
                "run",
                "/Users/username/Documents/claude-ts-mcps/src/fetch.ts"
            ],
            "env": {
                "CUSTOM_USER_AGENT": "YOUR_CUSTOM_USER_AGENT", // Optional
                "IGNORE_ROBOTS_TXT": "false"                   // Optional, set to true to ignore robots.txt
            }
        }
    }
}

Save this configuration as claude_desktop_config.json and configure Claude Desktop to use it.

Multiple GitHub Account Support

The GitHub MCP server supports switching between multiple GitHub accounts. You can set up multiple account profiles by configuring environment variables:

"env": {
    "GITHUB_PERSONAL_ACCESS_TOKEN": "YOUR_DEFAULT_TOKEN",  // Default account (backward compatible)
    "GITHUB_TOKEN_WORK": "YOUR_WORK_ACCOUNT_TOKEN",       // Work account profile
    "GITHUB_TOKEN_PERSONAL": "YOUR_PERSONAL_ACCOUNT_TOKEN" // Personal account profile
}

To use a specific account profile in your requests, add the account_profile parameter to any GitHub API call:

{
    "owner": "username",
    "repo": "repo-name",
    "path": "path/to/file.txt",
    "account_profile": "work"  // Will use the GITHUB_TOKEN_WORK environment variable
}

If no account_profile is specified, the default GITHUB_PERSONAL_ACCESS_TOKEN will be used.

Fetch Server Configuration

The Fetch MCP server provides customization options through environment variables:

"env": {
    "CUSTOM_USER_AGENT": "YOUR_CUSTOM_USER_AGENT", // Optional: Specify a custom User-Agent header
    "IGNORE_ROBOTS_TXT": "false"                   // Optional: Set to "true" to bypass robots.txt rules
}

• CUSTOM_USER_AGENT: Allows you to define a specific User-Agent string for HTTP requests, which can be useful when certain websites restrict access based on the client identification.
• IGNORE_ROBOTS_TXT: By default (false), the fetch server respects robots.txt rules that websites set to control web crawlers. Setting this to "true" disables this restriction, but should be used responsibly.

Usage

1. Start Claude Desktop
2. Load the configuration file
3. Claude will now have access to the additional tools provided by these MCP servers

Development

Each MCP server is implemented as a standalone TypeScript file in the src directory:

• src/brave-search.ts: Brave Search API integration
• src/filesystem.ts: File system operations
• src/git.ts: Git operations
• src/github.ts: GitHub API integration for repository management, issues, PRs, etc.
• src/shell.ts: Shell command execution
• src/puppeteer.ts: Browser automation and web interaction
• src/fetch.ts: URL content retrieval and HTML-to-Markdown conversion

The GitHub MCP server has a modular structure:

• src/github/common/: Common utilities, interfaces, and types
• src/github/operations/: Implementation of various GitHub API operations
• src/github/tools/: Tool definitions for the MCP server

To add new functionality:

1. Create a new TypeScript file in the src directory
2. Implement the MCP server using the @modelcontextprotocol/sdk
3. Add the new server to your Claude Desktop configuration

Security Considerations

• The filesystem and shell servers include security measures to prevent unauthorized access
• Always validate user input before executing commands
• Be cautious when configuring allowed directories for filesystem access
• Use the command allowlist for the shell server to restrict executable commands
• The fetch server respects robots.txt directives by default to prevent scraping restricted sites
• Store your GitHub personal access tokens securely and use appropriate token permissions

References

• Model Context Protocol
• MCP Server Quickstart
• Anthropic Claude

License

MIT License