AI

클로드 사용법(VS Code): Claude Code 확장 설치부터 @멘션/인라인 diff 실전 워크플로우까지

zumsim 2026. 1. 16. 19:50
728x90
반응형

VS Code에서 Claude(클로드)를 제대로 쓰려면 Claude Code for VS Code 확장을 사용하는 방식이 가장 깔끔합니다. IDE 안에서 대화, 파일 @멘션, 인라인 diff, 변경 승인까지 한 번에 처리할 수 있어요.

1) 준비물(필수 조건)

  • VS Code 1.98.0 이상 권장
  • Anthropic 계정 (확장 첫 실행 시 로그인)
  • Claude Code CLI는 필수는 아님 (일부 기능은 CLI가 필요할 수 있음)

2) Claude Code 확장 설치

  1. 확장(Extensions) 열기: Ctrl+Shift+X
  2. Claude Code 검색
  3. Anthropic의 Claude Code for VS Code 설치
  4. 재시작 또는 Developer: Reload Window

3) 기본 사용법: 패널 열기 → 질문 → 변경 승인

  • 패널 열기: 에디터 오른쪽 상단 Spark 아이콘 또는 명령 팔레트(Ctrl+Shift+P)에서 Claude Code 검색
  • 프롬프트: “버그 원인 분석”, “리팩토링”, “테스트 추가”, “쿼리 최적화” 등
  • 변경 승인: Claude가 수정 제안 시 diff를 보여주고 승인(accept)해야 반영

4) 핵심 기능: @멘션(라인 범위 포함)으로 맥락 전달

답이 정확해지려면 코드 맥락을 넣는 게 핵심입니다. 선택 영역을 기준으로 파일 경로/라인 범위를 @멘션으로 넣을 수 있어요.

텍스트 선택 → Alt+K → @멘션 자동 삽입(파일 + 라인 범위)

5) 실전 워크플로우 예시

버그 수정

  1. 에러 로그/스택트레이스 붙여넣기
  2. 관련 파일/라인을 @멘션
  3. “재현 → 원인 → 최소 수정안 → 리그레션 체크” 요청

리팩토링

  1. 목표(성능/가독성/중복 제거) 명시
  2. “작은 단위로 커밋 가능한 계획(Plan) 먼저 제시” 요청
  3. diff 검토 후 단계별 승인

테스트 추가

  • 프레임워크(JUnit/Jest 등) 지정
  • 행복 경로 + 엣지 케이스 범위 명확히

6) 보안 체크(중요)

  • API 키/비밀번호/개인정보가 코드에 포함되지 않게 주의
  • 자동 수정 옵션 사용 시에도 diff 검토 습관화
  • 중요 리포지토리는 브랜치 분리 + PR 리뷰 권장

한 줄 요약

클로드 VSCode 핵심은 Claude Code 확장 설치 → @멘션으로 맥락 전달 → diff 검토 후 승인입니다.


 

728x90
반응형