VS Code에서 클로드 코드 쓰기 — 확장과 터미널, 두 가지 방법

시작하기 전에 준비할 것

클로드 코드가 무엇인지는 앞 글에서 봤으니, 이번에는 직접 설치해서 써 보겠습니다. 처음이라면 익숙한 IDE(코드를 작성하는 편집 프로그램)에서 시작하는 게 가장 좋습니다. 저는 VS Code로 설명하도록 하겠습니다.

준비물은 세 가지입니다.

  • VS Code: 없다면 code.visualstudio.com에서 무료로 받을 수 있습니다. 이미 깔려 있다면 1.94 버전 이상인지 확인하세요(메뉴의 도움말 → 정보).
  • Claude 유료 요금제 계정: Pro 이상이면 됩니다. 따로 API 키를 발급받을 필요는 없습니다.
  • 연습용 폴더: 바탕화면 같은 곳에 빈 폴더를 하나 만들어 두세요. 처음부터 중요한 파일이 있는 폴더에서 시작하면, 클로드가 뭔가 고칠 때마다 조마조마합니다.

Windows라면 앞 글에서 말한 Git for Windows도 함께 설치해 두면 좋습니다.

VS Code를 열었으면 “파일 → 폴더 열기”로 연습용 폴더를 엽니다. 어느 방법으로 쓰든 클로드 코드는 지금 열려 있는 폴더 안에서 일합니다.

VS Code에서 쓰는 두 가지 방법

VS Code 안에서 클로드 코드를 쓰는 방법은 두 가지입니다.

하나는 확장 프로그램입니다. 확장은 VS Code에 기능을 덧붙이는 추가 프로그램인데, 설치하면 편집기 옆에 채팅처럼 생긴 대화 창이 생깁니다. 버튼을 눌러 가며 쓸 수 있어서 처음 쓰기에 편합니다.

다른 하나는 터미널입니다. VS Code 아래쪽에는 명령어를 입력하는 터미널 창이 있는데, 여기에 claude라고 입력해서 실행하는 방식입니다. 클로드 코드의 원래 모습이 이쪽입니다.

저는 주로 터미널로 씁니다. 일하면서 SSH로 다른 서버에 접속할 일이 많은데(SSH는 멀리 있는 컴퓨터에 접속해서 명령어로 다루는 방법입니다), 접속한 서버에서는 결국 터미널로 작업하게 됩니다. 막상 클로드 코드를 터미널로 써 보니 크게 불편한 점도 없었습니다.

터미널로 배워 두면 어디서든 쓰는 법이 같다는 점도 컸습니다. 내 컴퓨터든 접속한 서버든 터미널에서 클로드 코드를 다루는 방법은 달라지지 않습니다. 그래서 처음 배울 때부터 아예 터미널로 익히자고 마음먹었습니다.

둘을 비교하면 이렇습니다.

구분 확장 프로그램 터미널
설치 VS Code에서 확장만 설치 클로드 코드를 따로 설치
화면 채팅 앱 같은 대화 창, 마우스로 조작 글자로만 된 화면, 키보드로 조작
바뀐 내용 보기 편집기에 비교 화면으로 표시 VS Code 터미널에서 실행하면 똑같이 편집기에 표시
쓸 수 있는 명령 일부 전부
VS Code 밖에서 쓸 수 없음 다른 터미널에서도 똑같이 사용
익숙해지기 금방 단축키 몇 개는 외워야 함

확장의 장점은 쉽다는 것입니다. 무엇을 눌러야 할지 화면에 다 보이고, 코드 줄을 드래그해서 바로 질문하거나 되돌리기 버튼을 누르는 것도 마우스로 됩니다. 대신 클로드 코드의 명령 중 일부만 들어 있어서, 쓰다 보면 “이 기능은 터미널에서만 된다”는 안내를 만나게 됩니다.

터미널은 반대입니다. 처음엔 글자뿐인 화면이 낯설지만 모든 기능을 쓸 수 있고, 손을 키보드에서 떼지 않고 빠르게 주고받을 수 있습니다. VS Code가 아닌 다른 터미널에서도 쓰는 법이 똑같다는 것도 장점입니다.

두 방법은 대화 기록을 공유해서, 확장에서 하던 대화를 터미널에서 이어갈 수도 있습니다. 저는 처음부터 터미널로 익혔지만, 글자뿐인 화면이 부담스럽다면 확장으로 시작했다가 익숙해진 뒤에 터미널로 넘어와도 됩니다.

방법 1: 확장 프로그램으로 쓰기

설치하고 로그인하기

  1. Ctrl+Shift+X(Mac은 Cmd+Shift+X)를 누르면 확장 목록이 나옵니다.
  2. 검색창에 “Claude Code”를 입력합니다.
  3. 게시자가 Anthropic인 항목을 골라 설치합니다. 이름이 비슷한 다른 확장도 섞여 나오니 게시자 이름을 꼭 확인하세요.
  4. 설치했는데 아무 변화가 없으면 Ctrl+Shift+P를 누르고 “Reload Window”를 입력해 Developer: Reload Window를 실행합니다. VS Code 창을 새로 고치는 명령입니다.

설치하면 VS Code 곳곳에 불꽃 모양 아이콘이 생깁니다. 편집기 오른쪽 위의 불꽃 아이콘을 누르면 대화 창이 열립니다. 이 아이콘은 파일을 하나라도 열어 둬야 보이니, 안 보이면 아무 파일이나 열어 보세요. 왼쪽 세로 아이콘 줄에 있는 불꽃 아이콘은 항상 보입니다.

대화 창을 처음 열면 로그인 화면이 나옵니다. “Sign in”을 누르면 브라우저가 열리는데, 평소 쓰는 Claude 계정으로 승인하면 끝입니다.

첫 요청해 보기

입력창에 평소 말하듯 쓰면 됩니다. 빈 연습용 폴더라면 이런 요청으로 시작해 보세요.

index.html 파일 하나로 간단한 할 일 목록 페이지를 만들어 줘.
할 일을 입력하고 추가 버튼을 누르면 목록에 쌓이게.

클로드가 파일을 만들겠다고 하면 허락해 주고, 만들어진 index.html을 브라우저로 열어 보세요(파일 탐색기에서 더블클릭하면 됩니다). 그다음 조금씩 바꿔 달라고 하면 됩니다.

완료한 항목을 클릭하면 줄이 그어지게 해 줘.

이렇게 작은 요청을 여러 번 주고받는 쪽이 한 번에 크게 부탁하는 것보다 결과를 확인하기 쉽습니다.

파일이 여러 개가 되면 @를 치고 파일 이름을 입력해 어느 파일 이야기인지 알려줄 수 있습니다. 이름 일부만 쳐도 비슷한 파일을 찾아 줍니다. 편집기에서 코드를 드래그해 선택해 둬도 됩니다. 클로드는 선택한 부분을 보면서 답하니까 “이 부분이 무슨 뜻이야?“처럼 묻기 좋습니다. 에러 화면처럼 말로 설명하기 어려운 건 캡처해서 입력창에 그대로 붙여 넣으면 됩니다.

입력창에서 Enter를 누르면 바로 전송됩니다. 여러 줄로 쓰고 싶을 때는 Shift+Enter를 누르세요.

클로드가 파일을 고칠 때

클로드가 파일을 고치려 할 때 무엇이 보이는지는 권한 모드에 따라 다릅니다. 모드는 입력창 아래에 있는 모드 이름을 클릭해 바꿉니다. 1편에서 말한 대로 요금제에 따라 Auto 모드로 시작하기도 하니, 처음에는 Manual로 바꿔 두세요.

Manual 모드에서는 클로드가 파일을 고치기 전에 원래 코드와 바뀔 코드를 나란히 보여주고 물어봅니다. 괜찮으면 수락하고, 아니면 거절하거나 “버튼 말고 제목 색만 바꿔 줘”처럼 다르게 하라고 말하면 됩니다. 보여준 코드를 그 자리에서 직접 고친 다음 수락해도 됩니다.

여러 파일을 한꺼번에 바꾸는 일이라면 Plan 모드가 편합니다. 클로드가 바로 고치지 않고 “이 파일에서 이걸, 저 파일에서 저걸 바꾸겠다”는 계획을 문서로 먼저 보여줍니다. 문서 중간중간에 의견을 달 수 있어서, 고친 뒤에 되돌리는 것보다 훨씬 덜 번거롭습니다.

잘못 고쳤을 때 되돌리기

되돌아가고 싶은 메시지에 마우스를 올리면 되돌리기 버튼이 나타나고, 세 가지 중에 고릅니다.

선택 하는 일
Fork conversation from here 파일은 그대로 두고, 그 시점부터 대화를 새로 시작
Rewind code to here 대화는 그대로 두고, 파일만 그 시점으로 되돌림
Fork conversation and rewind code 파일도 되돌리고 대화도 그 시점부터 새로 시작

“방금 부탁은 없던 걸로 하고 처음부터 다시”라면 세 번째를 고르면 됩니다.

다만 이 기능으로 모든 게 돌아오지는 않습니다. 클로드가 파일을 편집해서 바꾼 내용은 되돌릴 수 있지만, 명령어를 실행해서 파일을 지우거나 옮긴 경우는 되돌리지 못합니다. 이럴 때를 대비해 저장 지점을 남겨 두는 방법은 초기 세팅 추천에서 설명합니다.

방법 2: 터미널에서 쓰기

설치하기

확장을 설치했더라도 터미널에서 claude를 입력하면 “명령을 찾을 수 없다”는 오류가 납니다. 확장은 자기 대화 창에서 쓸 클로드 코드를 내부에 따로 갖고 있을 뿐, 터미널 명령으로는 등록하지 않기 때문입니다. 터미널에서 쓰려면 따로 설치해야 합니다.

Windows라면 시작 메뉴에서 PowerShell을 열고 아래 명령을 붙여 넣습니다.

irm https://claude.ai/install.ps1 | iex

Mac이라면 터미널 앱을 열고 이 명령을 씁니다.

curl -fsSL https://claude.ai/install.sh | bash

설치가 끝나면 창을 닫았다가 새로 열고 claude --version을 입력해 보세요. 2.1.270 (Claude Code)처럼 버전이 나오면 제대로 설치된 겁니다.

설치할 때 VS Code가 켜져 있었다면 VS Code도 완전히 껐다가 다시 켜 주세요. 그대로 두면 VS Code 안의 터미널이 방금 설치한 클로드 코드를 찾지 못해 여전히 “명령을 찾을 수 없다”고 나올 수 있습니다.

VS Code 터미널에서 실행하기

VS Code에서 Ctrl+`(숫자 1 왼쪽 키)를 누르면 아래쪽에 터미널이 열립니다. 연습용 폴더가 열린 상태라면 터미널도 그 폴더에서 시작합니다. 여기에 claude를 입력하고 Enter를 누르면 클로드 코드가 실행됩니다. 아직 로그인하지 않았다면 브라우저가 열리면서 로그인을 요청합니다.

VS Code 안의 터미널에서 실행하면 클로드 코드가 VS Code와 알아서 연결됩니다. 그래서 클로드가 파일을 고칠 때 비교 화면이 확장과 똑같이 편집기에 열립니다. 글자뿐인 터미널에서 바뀐 내용을 읽어야 하나 걱정할 필요는 없습니다.

요청하는 방법은 확장과 같습니다. 앞에서 본 할 일 목록 요청을 그대로 입력해 보세요.

터미널에서 알아둘 키

터미널에는 버튼이 없어서 몇 가지는 키로 합니다. 처음에는 이 정도만 알면 충분합니다.

하고 싶은 일 키
파일 가리키기 @ 입력 후 파일 이름 (목록에서 골라 Tab)
캡처한 이미지 붙여넣기 Alt+V (Mac은 Ctrl+V)
전송하지 않고 줄바꿈 Ctrl+J
권한 모드 바꾸기 Shift+Tab
클로드가 일하는 도중에 멈추기 Esc
되돌리기 메뉴 열기 입력창이 빈 상태에서 Esc 두 번
클로드 코드 끝내기 Ctrl+C 두 번

줄바꿈은 Shift+Enter가 되는 터미널도 있지만, 터미널 종류에 따라 설정이 필요할 수 있습니다. Ctrl+J는 어느 터미널에서나 되니 이쪽을 기억해 두면 편합니다.

Shift+Tab을 누를 때마다 입력창 아래의 모드 이름이 바뀝니다. 확장에서 클릭하던 것과 같은 기능이고, 처음에는 여기서도 Manual로 맞춰 두는 게 좋습니다. 되돌리기 메뉴도 확장의 되돌리기 버튼과 같은 역할이라, 코드와 대화 중 무엇을 되돌릴지 고를 수 있습니다.

팁: 터미널을 편집기 탭으로 올려서 쓰기

터미널로 쓰다 보면 불편한 점이 하나 있습니다. VS Code 터미널은 기본으로 화면 아래쪽 좁은 칸에 열립니다. 클로드와 주고받는 내용이 길어지면 몇 줄 보이지 않고, 칸을 키우면 이번엔 코드가 가려집니다.

이럴 때는 터미널을 파일처럼 위쪽 탭으로 올려서 쓰면 됩니다. index.html을 열었을 때 생기는 탭 옆에 터미널 탭이 하나 더 생기는 식입니다.

먼저 평소처럼 터미널을 엽니다. 이 두 가지 방법이 편합니다.

  • 왼쪽 탐색기에서 작업할 폴더를 마우스 오른쪽 버튼으로 클릭하고 “Open in Integrated Terminal”(한국어 화면에서는 “통합 터미널에서 열기”)을 고릅니다. 그 폴더에서 시작하는 터미널이 열립니다.
  • VS Code 창 맨 아래 상태 표시줄 바로 위 경계선을 마우스로 잡고 위로 끌어올립니다. 숨어 있던 아래쪽 패널이 올라오면 “터미널” 탭을 누릅니다.

그다음 이 터미널을 위로 옮깁니다. 아래쪽 터미널을 한 번 클릭해 둔 상태에서 Ctrl+Shift+P를 누르고 “Terminal: Move Terminal into Editor Area”를 입력해 실행하면 터미널이 탭으로 올라갑니다. 클로드 코드를 실행하던 중이었다면 하던 대화도 그대로 유지됩니다.

이 명령은 자주 쓰게 되니 단축키를 붙여 두면 편합니다. 명령을 찾는 창에서 바로 설정할 수 있습니다.

  1. Ctrl+Shift+P를 누르고 “Move Terminal into Editor Area”를 입력합니다.
  2. 목록에 나온 “Terminal: Move Terminal into Editor Area” 줄에 마우스를 올리면 오른쪽 끝에 톱니바퀴 아이콘이 나타납니다. 이 아이콘을 누릅니다.
  3. 단축키 설정 화면이 이 명령만 검색된 상태로 열립니다. 그 줄을 더블클릭합니다.
  4. 원하는 키 조합을 누르고 Enter를 누릅니다.

누른 키가 이미 다른 기능에 쓰이고 있으면 화면에 알려주니, 그럴 땐 다른 조합을 고르세요. 이제 터미널을 연 뒤 정한 키만 누르면 바로 위쪽 탭으로 올라갑니다.

탭으로 올린 터미널은 일반 파일 탭과 똑같이 다룰 수 있습니다. 순서를 바꾸거나, 탭을 끌어서 화면 오른쪽에 붙여 두 칸으로 나누거나, 필요 없으면 닫으면 됩니다.

저는 보통 클로드 코드 터미널 탭을 다른 파일처럼 화면에 꽉 차게 띄워 놓고 씁니다. 본서버(실제 서비스가 돌아가는 서버)의 파일과 비교하면서 고쳐야 할 때만 화면을 둘로 나눕니다. 한쪽에는 본서버 파일을 열어 두고, 다른 한쪽의 클로드 코드로 고칠 곳을 찾아가며 수정하는 식입니다.

대화 이어가기

확장에서는 대화 창 위쪽의 Session history 버튼을 누르면 지난 대화가 나옵니다.

터미널에서는 실행할 때 옵션을 붙입니다. claude --continue는 이 폴더에서 마지막으로 하던 대화를 바로 이어가고, claude --resume은 지난 대화 목록을 보여줘서 골라 이어갈 수 있습니다. 확장에서 하던 대화도 이 목록에 같이 나옵니다.

하던 일과 전혀 다른 일을 맡길 때는 이어가지 말고 새로 시작하는 게 좋습니다. 대화가 길어지면 앞부분이 자동으로 요약되면서 세세한 내용이 흐려지기 때문입니다.

다음은 설정

여기까지 따라왔다면 두 방법 중 편한 쪽으로 파일을 만들고, 고치고, 되돌리는 것까지 해 봤습니다. 몇 번 쓰다 보면 “매번 한국어로 답해 달라고 말하기 귀찮다”, “이 파일은 건드리지 말았으면” 같은 생각이 들 겁니다. 그런 것들을 한 번에 정해 두는 방법은 클로드 코드 초기 세팅 추천에서 이어집니다.