Ch10. IDE 통합
Claude Code를 VS Code·JetBrains에 통합해 사이드바 채팅·@멘션 컨텍스트·인라인 diff·체크포인트·Remote Control·Desktop 앱을 사용하는 방법
핵심 요약
- VS Code 확장은 마켓플레이스(또는 Open VSX)에서 설치하며 Cursor·Windsurf·Kiro 등 포크에서도 동일하게 동작하고 CLI를 함께 포함합니다.
- 두 IDE 모두
@멘션·선택 영역으로 컨텍스트를 제어하고, 변경사항을 diff로 확인한 뒤 수락/거부/수정할 수 있습니다. - VS Code의 파일 참조 단축키는
Option+K, JetBrains는Cmd+Option+K로@app.ts#5-10형태 참조를 삽입합니다. - 확장 활성화 시 내장
ideMCP 서버가 실행되어mcp__ide__getDiagnostics·mcp__ide__executeCode도구를 노출합니다. /remote-control(VS Code) 브릿지·Dispatch·Computer Use로 모바일·원격 작업까지 확장할 수 있습니다.
Claude Code는 CLI 도구이지만, VS Code와 JetBrains IDE에 통합하면 코드를 더 매끄럽게 탐색하고 수정할 수 있습니다.
VS Code 확장
설치
VS Code Extensions 마켓플레이스에서 Claude Code 확장을 설치합니다(Cmd+Shift+X / Ctrl+Shift+X로 확장 뷰를 연 뒤 "Claude Code" 검색).
Cursor, Windsurf, Kiro 등 VS Code 포크에서도 같은 방식으로 설치되며, 마켓플레이스가 막혀 있으면 Open VSX 레지스트리에서 설치할 수 있습니다.
요구 사항
VS Code 1.98.0 이상과 Anthropic 계정이 필요합니다(첫 실행 시 로그인). Amazon Bedrock, Google Vertex AI, Microsoft Foundry 같은 서드파티 프로바이더를 쓰는 경우 별도 설정이 필요합니다. 확장에는 CLI도 함께 포함되어, VS Code 통합 터미널에서 claude를 바로 실행할 수 있습니다.
주요 기능
- 네이티브 사이드바 채팅 (또는 새 탭/새 창으로 다중 대화)
- 파일/선택 영역을 컨텍스트로 추가 (
@멘션, 자동 선택 감지) - 에디터에서 변경사항(diff) 확인 및 적용 (수락/거부/수정)
- IDE에서 시작한 작업을 CLI로 이어서 진행 (대화 히스토리 공유)
- 체크포인트(rewind): 메시지 단위로 코드/대화를 이전 상태로 되돌리기
사용 팁
- 필요한 파일을
@멘션하거나 UI로 선택해 컨텍스트를 제어하세요. 에디터에서 텍스트를 선택하면 Claude가 자동으로 인식하며,Option+K(Mac) /Alt+K(Windows·Linux)로@app.ts#5-10형태의 파일 참조를 입력 창에 삽입할 수 있습니다. - 변경사항은 diff로 확인 후 적용하는 습관이 안정적입니다. diff 뷰에서 제안 내용을 직접 수정한 뒤 수락하면, Claude는 사용자가 수정했다는 사실을 전달받습니다.
- 폴더는 끝에 슬래시를 붙여
@src/components/처럼 멘션합니다. 퍼지 매칭을 지원하므로 부분 이름만으로도 찾을 수 있습니다.
JetBrains 플러그인
설치
JetBrains Marketplace에서 Claude Code [Beta] 플러그인을 설치하고 IDE를 완전히 재시작합니다. IntelliJ IDEA, PyCharm, WebStorm, PhpStorm, GoLand, Android Studio 등 대부분의 JetBrains IDE를 지원합니다.
주요 기능
- 빠른 실행:
Cmd+Esc(Mac) /Ctrl+Esc(Windows·Linux)로 에디터에서 바로 Claude Code를 열거나, UI의 Claude Code 버튼을 클릭 - 에디터의 현재 선택 영역 또는 탭을 컨텍스트로 즉시 추가 (
Readdeny 규칙으로 특정 파일 공유 차단 가능) - 파일 참조 단축키:
Cmd+Option+K(Mac) /Alt+Ctrl+K(Windows·Linux)로@src/auth.ts#L1-99형태의 참조 삽입 - 변경사항 diff 확인 후 적용/되돌리기 (IDE diff 뷰어에 표시)
- 진단(diagnostic) 공유: 린트·문법 오류가 작업 중 자동으로 Claude에 전달됨
설정
플러그인은 Settings → Tools → Claude Code [Beta] 에서 구성합니다(Claude 명령 경로, 자동 업데이트 등).
diff를 IDE에 표시할지는 Claude Code 안에서 /config 명령으로 diff 도구를 auto(IDE) 또는 terminal로 설정해 제어합니다.
외부 터미널에서 연결
IDE 통합 터미널에서 claude를 실행하면 모든 통합 기능이 활성화됩니다. 외부 터미널에서 시작했다면 /ide 명령으로 실행 중인 JetBrains IDE에 연결할 수 있습니다. 원격 개발(Remote Development) 환경에서는 플러그인을 원격 호스트(Settings → Plugin (Host))에 설치해야 합니다.
VS Code 고급 기능
스파크 아이콘 세션 목록
Activity Bar의 스파크 아이콘으로 모든 Claude Code 세션을 목록으로 확인할 수 있습니다(v2.1.70). 세션을 클릭하면 전체 에디터 탭으로 열립니다. 이 Activity Bar 아이콘은 항상 표시되며, 파일을 연 상태에서는 에디터 툴바(우상단)와 상태 표시줄(우하단)에서도 스파크 아이콘으로 Claude Code를 열 수 있습니다.
MCP 서버 관리 다이얼로그
채팅 패널에서 /mcp 명령으로 네이티브 MCP 서버 관리 다이얼로그를 열 수 있습니다(v2.1.70).
서버 활성화/비활성화/재연결/OAuth 인증을 UI에서 직접 처리합니다.
새 서버 추가는 통합 터미널에서 claude mcp add로 하고, 추가된 서버를 /mcp로 관리하는 흐름입니다.
내장 IDE MCP 서버
확장이 활성화되면 CLI가 자동으로 연결하는 로컬 MCP 서버(ide)가 실행됩니다. 이 서버로 CLI가 VS Code 네이티브 diff 뷰어를 열고, @멘션용 선택 영역을 읽고, Jupyter 노트북 셀 실행을 요청합니다. 설정할 것이 없어 /mcp 목록에는 숨겨져 있지만, PreToolUse 훅으로 MCP 도구를 허용 목록에 넣는다면 모델에 노출되는 mcp__ide__getDiagnostics와 mcp__ide__executeCode를 알아두어야 합니다.
플랜 마크다운 뷰
플랜 모드에서 플랜 전체를 마크다운 문서 뷰로 확인할 수 있으며, 인라인 코멘트로 피드백을 줄 수 있습니다(v2.1.70). 플랜 프리뷰 탭 제목이 플랜 헤딩을 사용하도록 개선되었습니다(v2.1.77).
Remote Control 브릿지 (v2.1.79)
VS Code에서 /remote-control(또는 /rc) 명령으로 현재 세션을 claude.ai/code(또는 Claude 모바일 앱)에 브릿지할 수 있습니다.
별도 터미널에서 claude remote-control을 실행할 필요 없이, 채팅 입력 창 위 배너에서 연결 상태를 확인하고 Open in browser로 바로 이동합니다.
다시 /remote-control을 실행하거나 배너의 닫기 아이콘을 누르면 연결이 해제됩니다.
Remote Control 개요
Remote Control은 연구 프리뷰로 모든 플랜에서 사용 가능합니다(Team·Enterprise는 관리자가 토글을 켜야 함). 세션은 항상 로컬 머신에서 실행되며, 웹·모바일은 로컬 세션을 들여다보는 창 역할만 합니다. CLI에서는 claude remote-control(서버 모드), claude --remote-control(인터랙티브), /remote-control(기존 세션 이어가기)을 지원하고, VS Code 명령은 v2.1.79 이상이 필요합니다. CLI Remote Control 자체는 v2.1.51 이상에서 동작합니다. 단, VS Code의 /remote-control은 이름 인자나 QR 코드를 지원하지 않으며, 세션 제목은 대화 히스토리나 첫 프롬프트에서 자동 생성됩니다.
세션 탭 AI 자동 제목 (v2.1.79)
VS Code의 세션 탭에 AI가 생성한 제목이 첫 번째 메시지를 기반으로 자동 표시됩니다.
Compaction 카드
compaction을 접을 수 있는 "Compacted chat" 카드로 표시하여 대화 흐름을 깔끔하게 유지합니다(v2.1.69).
퍼미션 모드 피커
입력 창 하단의 퍼미션 모드 피커로 normal / plan / auto-accept 모드를 전환할 수 있으며, managed settings의 disableBypassPermissionsMode 설정을 존중합니다(v2.1.69). 새 대화의 기본 모드는 VS Code 설정의 claudeCode.initialPermissionMode로 지정합니다.
Effort 레벨 인디케이터
입력 테두리에 effort 레벨 인디케이터가 표시되어 현재 추론 강도를 한눈에 확인할 수 있습니다(v2.1.72).
URI 핸들러
vscode://anthropic.claude-code/open URI 핸들러로 프로그래매틱하게 탭을 열 수 있습니다(v2.1.72). 셸 별칭, 북마클릿, 스크립트 등 URL을 열 수 있는 곳이면 어디서든 호출할 수 있으며, 두 가지 선택적 쿼리 파라미터를 받습니다.
| 파라미터 | 설명 |
|---|---|
prompt | 입력 창에 미리 채울 텍스트(URL 인코딩 필요). 자동 전송되지는 않음 |
session | 새 대화 대신 이어갈 세션 ID. 현재 워크스페이스에 속한 세션이어야 하며, 없으면 새 대화로 시작 |
open "vscode://anthropic.claude-code/open?prompt=review%20my%20changes"세션 관리
세션 히스토리에서 키워드 검색·시간대별 탐색이 가능하며, 세션 이름 변경 및 삭제 기능이 추가되었습니다(v2.1.63). 가장 최근에 닫은 세션 탭은 Cmd+Shift+T / Ctrl+Shift+T로 다시 열 수 있습니다(claudeCode.enableReopenClosedSessionShortcut로 제어).
/keybindings 커스터마이즈
/keybindings 명령으로 VS Code 내 Claude Code 단축키를 커스터마이즈할 수 있습니다(v2.1.18).
트랜스크립트 검색 (v2.1.83)
Ctrl+O로 트랜스크립트 모드에 진입한 뒤, / 키로 대화 내용을 검색할 수 있습니다. n/N 키로 다음/이전 결과를 탐색합니다.
외부 에디터 단축키 (v2.1.83)
Ctrl+X Ctrl+E 단축키로 현재 입력을 외부 에디터(예: vim, nano)에서 편집할 수 있습니다. 기존 Ctrl+E의 별칭입니다.
딥링크 개선
VS Code 탭을 여는 vscode://anthropic.claude-code/open과 별개로, 터미널 세션을 여는 claude-cli://open 딥링크도 있습니다(딥링크 전반은 v2.1.91 이상 필요). 후자는 OS에 등록된 핸들러를 통해 새 터미널 창에서 Claude Code를 열며, q(프롬프트), cwd(작업 디렉터리), repo(GitHub owner/name 슬러그) 파라미터를 받습니다.
- 딥링크가 선호 터미널에서 열립니다. macOS는 가장 최근 인터랙티브 세션의 터미널을 기억해 재사용하고(iTerm2·Ghostty·kitty·Alacritty·WezTerm·Terminal.app), Linux는
$TERMINAL을, Windows는 Windows Terminal → PowerShell → cmd.exe 순으로 선택합니다. (v2.1.84) q딥링크 쿼리가 최대 5,000자까지 지원됩니다. (v2.1.85)claude-cli://open?q=딥링크가 멀티라인 프롬프트(%0A)를 지원합니다. IDE/브라우저에서 긴 템플릿 프롬프트를 전달하기 쉬워집니다. (v2.1.91)
GitHub 렌더링 주의
GitHub은 README·이슈·PR·위키에서 http/https 외의 URL 스킴(claude-cli://)을 제거합니다. 이런 곳에서는 딥링크를 코드 블록에 넣어 사용자가 직접 복사해 쓰도록 안내하세요.
Dispatch — 모바일 원격 작업 (2026-03-17)
Claude Dispatch로 iPhone에서 작업을 전송하고, 완료된 결과를 확인할 수 있습니다. 데스크탑에서 Claude Code가 실행 중이지 않아도 작업이 큐에 대기하다가 처리됩니다.
- 모든 플랜(Pro, Max, Team, Enterprise)에서 사용 가능
- Claude 모바일 앱과 Desktop 앱을 페어링한 뒤, 모바일 앱에서 작업 전송 → 데스크탑에서 자동 실행 → 완료 알림 수신
Computer Use — 화면 제어 (2026-03-24, 연구 프리뷰)
Claude가 macOS 화면을 보고, 마우스를 움직이고, 클릭하고, 타이핑할 수 있습니다. Dispatch와 결합하면 iPhone에서 원격으로 데스크탑 앱을 제어할 수 있습니다.
연구 프리뷰
Pro/Max 플랜만 지원되며 macOS 전용입니다. Desktop 앱 설정에서 활성화합니다.
Desktop 앱
Claude Code의 그래픽 인터페이스 버전입니다(macOS, Windows). CLI와 동일한 엔진을 사용하며, 비주얼 diff 리뷰, 파일 첨부, 세션 관리 사이드바, Computer Use 통합을 제공합니다.
최신 릴리스에서는 이미지 첨부 UX가 개선되어, 프롬프트에 이미지를 drag-and-drop 하거나 클립보드에서 바로 붙여넣는 흐름이 강화되었습니다. (v2.1.105)
Windows 호환성 개선
- Git Bash 사용 시 Bash 도구의 PATH 상속 문제가 수정되었습니다. (v2.1.81)
- WSL 포함 Windows Terminal에서 줄단위 응답 스트리밍이 비활성화되었습니다. (v2.1.81)
CLI와 IDE 전환
CLI(외부 터미널)에서 작업하다 실행 중인 IDE에 연결하려면 /ide 명령을 사용합니다.
/ide반대로 IDE 확장 대화를 CLI에서 이어가려면 터미널에서 claude --resume을 실행해 대화를 선택하면 됩니다. 확장과 CLI는 대화 히스토리를 공유합니다.
참고 문서
- IDE 통합 개요: https://code.claude.com/docs/en/ide-integrations
- VS Code 통합: https://code.claude.com/docs/en/vs-code
- JetBrains 통합: https://code.claude.com/docs/en/jetbrains
- Remote Control: https://code.claude.com/docs/en/remote-control
- 딥링크로 세션 열기: https://code.claude.com/docs/en/deep-links