클로드 코드 완벽 가이드
홈
기본과정
고급 확장
GitHub
홈
기본과정
고급 확장
GitHub
  • 기본과정

    • 시작하기

      • Intro
      • Install
      • Login & Logout
    • 기본 사용법

      • First Prompt
      • Prompt History
      • ESC Interrupt
      • Rewind Your Code
      • Prompt In Editor
      • Claude cli
      • XML
    • 개발 환경

      • Claude Directory Structure
      • Settings.json
      • Permission
    • 고급 기능

      • Memory
      • Context
      • MCP
      • Change Mode
      • MultiModal - Image
      • observability
      • Statusline
      • Thinking
    • 기타

      • Output File
      • Keep Up to Date
      • Usage Check

MCP 사용하기

.mcp.json

.mcp.json 파일을 생성하고 아래 형태로 mcp를 추가합니다.

{
  "mcpServers": {
    "chrome-devtools": {
      "command": "npx",
      "args": ["chrome-devtools-mcp@latest"]
    },
    "github": {
      "type": "stdio",
      "args": ["@modelcontextprotocol/server-github"],
      "env": {
         "GITHUB_PERSONAL_ACCESS_TOKEN": "${GITHUB_PAT}"
      }
    }
  }
}

.mcp.json 작성이 완료되었으면 claude를 실행하면 mcp 사용여부를 묻습니다. 승인을 하면 사용할 수 있습니다.

클로드 데스크탑에 있는 설정 가져오기

클로드 데스크탑에 있는 설정을 그대로 가져오려고 하는 경우 사용합니다.

claude mcp add-from-claude-desktop

mcp tool 이름 확인하기

  1. mcp 명령어 실행
/mcp
  1. mcp 선택
 Manage MCP servers                                                                                                                                                                             │
│                                                                                                                                                                                                │
│ ❯ 1. plugin:common-mcp-plugin:chrome-devtools            ✔ connected · Enter to view details
  1. View tools 선택
╭────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────╮
│ Plugin:common-mcp-plugin:chrome-devtools MCP Server                                                                                                                                            │
│                                                                                                                                                                                                │
│ Status: ✔ connected                                                                                                                                                                            │
│ Command: npx                                                                                                                                                                                   │
│ Args: chrome-devtools-mcp@latest                                                                                                                                                               │
│ Config location: Dynamically configured                                                                                                                                                        │
│ Capabilities: tools                                                                                                                                                                            │
│ Tools: 26 tools                                                                                                                                                                                │
│                                                                                                                                                                                                │
│ ❯ 1. View tools                                                                                                                                                                                │
│   2. Reconnect                                                                                                                                                                                 │
│   3. Disable                                                                                                                                                                                   │
╰────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────╯
  1. 도구중에서 원하는 도구 선택
╭────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────╮
│ Tools for plugin:common-mcp-plugin:chrome-devtools (26 tools)                                                                                                                                  │
│                                                                                                                                                                                                │
│ ❯ 1.  click                                                                                                                                                                                    │
│   2.  close_page                                                                                                                                                                               │
│   3.  drag                                                                                                                                                                                     │
│   4.  emulate                                                                                                                                                                                  │
│ ↓ 5.  evaluate_script                                                                                                                                                                          │
╰────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────╯
  1. Full name 확인
╭────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────╮
│ click (plugin:common-mcp-plugin:chrome-devtools)                                                                                                                                               │
│                                                                                                                                                                                                │
│ Tool name: click                                                                                                                                                                               │
│ Full name: mcp__plugin_common-mcp-plugin_chrome-devtools__click                                                                                                                                │
│                                                                                                                                                                                                │
│ Description:                                                                                                                                                                                   │
│ Clicks on the provided element                                                                                                                                                                 │
│                                                                                                                                                                                                │
│ Parameters:                                                                                                                                                                                    │
│   • uid (required): string - The uid of an element on the page from the page content snapshot                                                                                                  │
│   • dblClick: boolean - Set to true for double clicks. Default is false.                                                                                                                       │
╰────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────╯

여기서 Full name을 원하는 permissions에 넣으면 됩니다.

MCP Enable/Disable

  1. @을 하면 mcp 리스트가 나옵니다. 여기에서 Enter 키 입력으로 켜고 끌수 있습니다.
─────────────────────────────────────────────────────────────────────────────────────────
> @
─────────────────────────────────────────────────────────────────────────────────────────
  ✓ [mcp] plugin:common-mcp-plugin:chrome-devtools
      enabled (⏎ to toggle)

  1. mcp 리스트에서 mcp를 선택하여 켜고 끌수 있습니다.
> /mcp
╭───────────────────────────────────────────────────────────────────────────────────────╮
│ Plugin:common-mcp-plugin:chrome-devtools MCP Server                                   │
│                                                                                       │
│ Status: ✔ connected                                                                   │
│ Command: npx                                                                          │
│ Args: chrome-devtools-mcp@latest                                                      │
│ Config location: Dynamically configured                                               │
│ Capabilities: tools                                                                   │
│ Tools: 26 tools                                                                       │
│                                                                                       │
│   1. View tools                                                                       │
│   2. Reconnect                                                                        │
│ ❯ 3. Disable                                                                          │
╰───────────────────────────────────────────────────────────────────────────────────────╯
이 페이지 수정하기
최종 수정: 25. 11. 12. 오후 2:24
Contributors: hello
Prev
Context
Next
Change Mode