KIMKYUTAE.COM · ©
document.getElementById('current-year').textContent = new Date().getFullYear();VS Code 설치부터 Codex·Claude Code까지 한 번에 설정하기
2026년 10월 공식 문서 확인 기준. 설치 화면과 로그인 조건은 이후 바뀔 수 있다.
VS Code에서 Codex와 Claude Code를 사용하려면 무엇부터 설치해야 할까. 편집기와 확장 프로그램, 터미널용 CLI가 따로 있다 보니 처음에는 어디까지 설치해야 하는지 헷갈릴 수 있다.
VS Code에 코딩 에이전트를 연결하면 기존 코드를 읽고 설명하는 일부터 파일 수정과 테스트 실행까지 맡길 수 있다. 다만 테스트나 프로그램 실행에 필요한 개발 도구는 컴퓨터에 별도로 준비되어 있어야 한다.
나처럼 Mac과 Windows를 번갈아 사용하는 경우도 있는데, VS Code 자체의 사용법은 거의 같다. 다만 설치 방법과 터미널에서 사용하는 일부 명령은 운영체제에 따라 차이가 있다.
이 글은 Mac과 Windows에서 VS Code를 설치하고 AI 코딩 도구를 연결하는 과정을 다룬다. 처음에는 확장 프로그램 하나로 시작하고, 터미널에서 직접 실행할 필요가 생기면 CLI를 추가해도 된다.
- VS Code 설치
- VS Code 기본 사용법
- Codex 설치와 로그인
- Claude Code 설치와 로그인
- Codex·Claude Code CLI 설치
- 테스트 프로젝트에서 실제 동작 확인
프로그래밍 언어나 프레임워크 설치는 다루지 않는다. 우선 VS Code에서 Codex와 Claude Code를 사용할 수 있는 환경을 만드는 데까지만 진행한다.
준비할 것
컴퓨터 외에 특별히 필요한 것은 많지 않다.
- 인터넷 연결
- ChatGPT 계정
- Claude 계정
- Mac 또는 Windows PC
Codex는 ChatGPT 계정으로 로그인한다. 사용 가능한 기능과 사용량은 사용하는 ChatGPT 플랜에 따라 달라질 수 있다.
Claude Code는 유료 Claude 구독 또는 Claude Console 계정 등 사용 권한이 필요하다. 무료 Claude 계정만으로는 사용할 수 없다. Console이나 API 키를 사용하는 방식은 구독 로그인과 과금 경로가 다르므로 로그인할 때 어떤 계정을 선택하는지도 확인한다.
Git은 처음부터 꼭 설치할 필요는 없지만, 실제 개발을 시작한다면 나중에는 설치하는 것을 권한다. Codex나 Claude Code가 여러 파일을 직접 수정할 수 있기 때문에 Git으로 변경 전 상태를 남겨두면 문제가 생겼을 때 되돌리기가 훨씬 쉽다.
VS Code 설치
먼저 Visual Studio Code, 보통 VS Code라고 부르는 편집기를 설치한다.
VS Code는 Microsoft에서 제공하는 무료 코드 편집기이다. 일반 메모장처럼 파일을 열어 수정할 수도 있지만 터미널, Git, 디버거, 확장 프로그램 같은 개발 기능이 함께 들어 있다.
Mac
VS Code 공식 다운로드 페이지에서 macOS 버전을 내려받는다. Apple Silicon Mac은 Arm64, Intel Mac은 x64를 선택하거나 Universal 버전을 사용한다.
내려받은 ZIP 파일을 압축 해제한 뒤 Visual Studio Code 앱을 Applications 폴더로 옮긴다. 이후 Finder의 응용 프로그램이나 Spotlight에서 Visual Studio Code를 검색해 실행하면 된다.
Mac에서는 한 가지 작업을 추가로 해두는 것이 좋다. VS Code를 실행한 뒤 다음 단축키를 누른다.
Command + Shift + P
화면 위쪽에 명령 팔레트가 나타나면 다음 항목을 검색해 실행한다.
Shell Command: Install 'code' command in PATH
이 설정을 해두면 터미널에서 현재 폴더를 VS Code로 바로 열 수 있다.
code .
설치가 제대로 되었는지는 터미널을 새로 열고 다음 명령으로 확인한다.
code --version
버전 정보가 나오면 정상이다.
Windows
Windows에서도 공식 다운로드 페이지에서 Windows용 설치 파일을 받는다. 처음 설치한다면 보통 User Installer를 선택하면 된다.
설치 과정은 기본값으로 진행해도 무방하다. Windows용 설치 프로그램은 일반적으로 터미널에서 code 명령을 사용할 수 있도록 PATH 설정도 같이 처리한다.
설치가 끝났다면 기존에 열려 있던 PowerShell이나 명령 프롬프트를 닫고 새로 실행한다.
code --version
버전 번호가 표시되면 정상적으로 설치된 것이다.
기본 화면
처음 VS Code를 실행하면 버튼과 아이콘이 많아서 조금 복잡해 보일 수 있다. 처음에는 세 부분만 알면 된다.
- 왼쪽 Explorer: 프로젝트의 파일과 폴더를 보는 곳
- 가운데 편집기: 실제 파일 내용을 보는 곳
- 아래 Terminal: 명령어를 실행하는 곳
프로젝트를 시작할 때는 파일 하나를 따로 여는 것보다 프로젝트 폴더 전체를 여는 편이 좋다.
File → Open Folder
작업할 폴더를 선택하면 VS Code는 그 폴더를 하나의 작업공간으로 사용한다. Codex와 Claude Code도 현재 열려 있는 폴더를 기준으로 파일을 읽고 수정하기 때문에 프로젝트 단위로 폴더를 여는 습관을 들이는 것이 좋다.
처음 폴더를 열면 Workspace Trust 관련 질문이 나타날 수 있다. 내가 만든 폴더라면 신뢰해도 되지만, 인터넷에서 받은 프로젝트나 출처를 모르는 파일이라면 바로 신뢰하지 않는 편이 좋다.

터미널 열기
Codex나 Claude Code를 사용하다 보면 터미널을 자주 사용하게 된다. VS Code 상단 메뉴에서 다음을 선택한다.
Terminal → New Terminal
Mac에서는 기본적으로 zsh가 사용되는 경우가 많고 Windows에서는 PowerShell이 열리는 경우가 많다. 운영체제에 따라 터미널 종류는 다르지만 앞으로 사용할 기본 명령은 대부분 비슷하다.
Codex 설치
Codex는 OpenAI의 코딩 에이전트이다. 단순히 코드를 한두 줄 추천하는 방식보다는 현재 프로젝트의 파일을 읽고, 코드를 수정하고, 필요한 명령을 실행하면서 하나의 작업을 처리하는 쪽에 가깝다.
처음 사용한다면 VS Code의 공식 Codex 확장 프로그램을 설치하는 것이 가장 간단하다.
Codex 확장 프로그램
VS Code 왼쪽의 Extensions 아이콘을 누른다. 단축키를 사용해도 된다.
Mac
Command + Shift + X
Windows
Ctrl + Shift + X
검색창에 Codex를 입력하고 게시자가 OpenAI인 공식 확장 프로그램을 설치한다.
Codex – OpenAI's coding agent
비슷한 이름의 비공식 확장 프로그램도 있을 수 있으므로 이름만 보고 설치하지 말고 게시자를 확인하는 것이 좋다.
설치가 끝나면 VS Code에 Codex 아이콘이 나타난다. 아이콘이 보이지 않는다면 명령 팔레트를 열어 다음 명령을 검색한다.
Codex: Open Codex Sidebar
Codex 화면이 열리면 ChatGPT 계정으로 로그인한다. 일반적인 ChatGPT 계정 로그인 방식으로 사용할 수 있으며 별도의 API Key를 직접 입력하는 방식과는 구분해서 생각하면 된다.
로그인이 끝났다면 프로젝트 폴더를 연 상태에서 간단하게 확인해본다.
현재 프로젝트의 파일 구조를 확인하고 어떤 프로젝트인지 설명해줘.
아직 아무 파일도 없다면 파일이 없다고 답해도 정상이다.
Claude Code 설치
Claude Code도 VS Code 확장 프로그램으로 설치할 수 있다.
VS Code의 Extensions 화면에서 Claude Code를 검색하고 게시자가 Anthropic인 공식 확장 프로그램을 설치한다.
Claude Code
설치 후 화면에 Claude Code 아이콘이 나타난다. 보이지 않는다면 명령 팔레트를 열고 Claude Code를 검색하면 된다.
처음 실행하면 Claude 계정 로그인이 진행된다. 브라우저가 열리면 로그인을 완료한 뒤 다시 VS Code로 돌아오면 된다.
여기까지 했다면 VS Code 안에서 Codex와 Claude Code를 모두 사용할 수 있다.
프로젝트 코드와 요청 내용은 AI 서비스에서 처리될 수 있다. 회사 코드나 로그를 사용할 때는 조직에서 허용한 계정과 데이터 처리 정책을 확인하고, 비밀번호·API 키 같은 인증 정보를 프롬프트에 넣지 않는다.
확장과 CLI
VS Code 확장 프로그램만 사용해도 개발은 가능하다. 다만 조금 사용하다 보면 터미널에서 직접 Codex나 Claude Code를 실행하고 싶은 경우가 생긴다.
codex
또는
claude
확장은 VS Code 안의 대화 패널을 사용하는 방식이고, CLI는 터미널에서 실행하는 방식이다. 확장을 설치했다고 터미널의 codex·claude 명령까지 자동으로 준비되는 것은 아니다. 특히 Claude Code 확장은 자체 실행 파일을 포함하지만, 터미널에서 claude를 쓰려면 별도 CLI 설치가 필요하다.
Codex CLI
Codex CLI 설치에는 npm을 사용할 수 있다. npm은 Node.js를 설치하면 같이 설치된다.
Node.js 확인
먼저 터미널에서 다음 명령을 입력한다.
node --version
npm --version
두 명령 모두 버전 번호가 나온다면 Node.js가 이미 설치되어 있는 것이다.
명령을 찾을 수 없다는 오류가 나온다면 Node.js 공식 사이트에서 LTS 버전을 설치한다. 설치가 끝나면 VS Code와 터미널을 모두 닫았다가 다시 실행한다.
node --version
npm --version
Codex 설치
Mac과 Windows 모두 같은 명령으로 설치할 수 있다.
npm install -g @openai/codex@latest
-g는 현재 프로젝트가 아닌 npm의 전역 설치 위치에 설치한다는 뜻이다. 해당 위치가 PATH에 등록되어 있으면 다른 폴더에서도 codex 명령을 실행할 수 있다. @latest는 최신 배포 버전을 지정한다.
설치 후 확인한다.
codex --version
버전 번호가 나오면 설치가 완료된 것이다.
실행은 간단하다.
codex
처음 실행하면 로그인 과정이 진행될 수 있다. 안내에 따라 ChatGPT 계정으로 로그인하면 된다.
Mac에서 Homebrew 사용
Mac에 Homebrew가 이미 설치되어 있다면 npm 대신 Homebrew를 사용할 수도 있다.
brew install --cask codex
이미 Homebrew를 사용하던 환경이라면 이 방법도 편하다. 그렇지 않다면 Codex 하나 때문에 Homebrew부터 설치할 필요는 없다.
Claude Code CLI
Claude Code는 네이티브 설치 프로그램을 제공하므로 Claude Code만 설치하려고 Node.js부터 설치할 필요는 없다. Mac과 Windows의 설치 명령이 다르다.
Mac
다음은 공식 설치 스크립트를 내려받아 바로 실행하는 명령이다. URL이 공식 주소인지 확인한 뒤 일반 사용자 터미널에서 실행한다.
curl -fsSL https://claude.ai/install.sh | bash
설치가 끝나면 터미널을 새로 열고 확인한다.
claude --version
Windows
Windows에서는 일반 사용자 PowerShell을 열고 다음 명령을 입력한다. 이 명령 역시 공식 설치 스크립트를 내려받아 즉시 실행한다.
irm https://claude.ai/install.ps1 | iex
설치가 완료되면 PowerShell이나 VS Code 터미널을 닫았다가 다시 연다.
Windows에서 Git for Windows는 필수는 아니지만 Git Bash 기반 명령을 사용할 때 도움이 된다. Linux 도구가 필요한 프로젝트라면 WSL 환경도 선택할 수 있다. 이 글의 Windows 명령은 WSL이 아닌 PowerShell 기준이다.
claude --version
WinGet을 사용하는 방법도 있다.
winget install Anthropic.ClaudeCode
Claude Code 로그인
Mac과 Windows 모두 프로젝트 폴더에서 다음 명령을 실행한다.
claude
처음 실행하면 로그인 안내가 나타난다. 브라우저를 열어 Claude 계정으로 로그인하고 인증을 완료하면 된다.
테스트 프로젝트 만들기
설정이 끝났다면 실제로 폴더 하나를 만들어 확인해보자. Mac과 Windows 모두 VS Code 터미널에서 다음 명령을 사용할 수 있다.
mkdir ai-dev-test
cd ai-dev-test
code .
mkdir은 폴더를 만드는 명령이고 cd는 해당 폴더로 이동하는 명령이다. 마지막의 code .은 현재 폴더를 VS Code로 열라는 뜻이다.
새 VS Code 창이 열리면 왼쪽 Explorer에 ai-dev-test 폴더가 표시된다.
이제 Codex를 열고 다음 정도의 작업을 시켜본다.
이 폴더에 간단한 index.html을 만들어줘.
화면 가운데 Hello World가 나오도록 해줘.
권한 설정에 따라 파일 변경이나 명령 실행 승인이 나타날 수 있다. 요청이 나타나면 대상 파일과 실행 내용을 확인한 뒤 허용한다. 작업이 끝나면 Explorer에 index.html 파일이 생겼는지 확인한다.
이번에는 Claude Code를 열어 이렇게 요청할 수 있다.
현재 index.html을 확인하고 배경색과 글자 크기를 조금 수정해줘.
변경하기 전에 어떻게 수정할지 먼저 설명해줘.
변경 내용을 확인하고 적용한 뒤 index.html을 브라우저로 열어 결과를 확인한다. 두 에이전트가 같은 파일을 동시에 수정하도록 실행하지 않고, 한쪽 작업이 끝난 뒤 다른 쪽에 넘기는 편이 변경 내용을 추적하기 쉽다.
터미널에서도 확인하기
VS Code 아래쪽에서 새 터미널을 열고 현재 위치가 테스트 프로젝트 폴더인지 확인한다.
Codex를 실행한다.
codex
종료한 뒤 Claude Code도 실행한다.
claude
두 명령 모두 현재 프로젝트를 인식하고 실행된다면 CLI 설정도 정상이다.
VS Code 확장 프로그램을 사용할 때와 터미널 CLI를 사용할 때 화면은 다르지만 기본적으로 같은 프로젝트 파일을 대상으로 작업한다.
파일 수정 권한
Codex와 Claude Code를 처음 사용하면 가장 낯선 부분이 권한 요청이다.
일반적인 AI 채팅은 답변만 보여주지만 코딩 에이전트는 실제 파일을 수정하거나 터미널 명령을 실행할 수 있다.
- 파일 생성
- 파일 수정
- 파일 삭제
- 패키지 설치
- 테스트 실행
- Git 명령 실행
- Shell 또는 PowerShell 명령 실행
그래서 처음부터 모든 작업을 자동 승인하도록 설정하는 것은 권하지 않는다. 특히 다음 종류의 명령이 나온다면 내용을 확인하는 것이 좋다.
rm
del
git reset
git clean
sudo
Remove-Item
파일을 지우거나 기존 상태를 되돌리거나 관리자 권한을 사용하는 명령들이다. AI가 작성한 명령이라고 해서 무조건 안전한 것은 아니다.
처음 사용할 때는 어떤 파일을 변경하는지, 어떤 명령을 실행하려는지 확인하면서 승인하는 편이 좋다.
Git으로 기록하기
실제 프로젝트를 Codex나 Claude Code와 같이 수정하기 시작한다면 Git을 같이 쓰는 것을 권한다.
예를 들어 AI에게 프로젝트 전체 구조를 정리해달라고 요청하면 생각보다 많은 파일이 한 번에 변경될 수 있다. 작업 전에 Git에 현재 상태를 저장해두면 문제가 생겨도 쉽게 원래 상태로 돌아갈 수 있다.
Git을 설치했고 앞의 예제에서 index.html을 만든 상태라면 다음처럼 첫 기록을 남길 수 있다. 이름과 이메일은 자신의 값으로 바꾼다. 아래 설정은 현재 저장소에만 적용된다.
git init
git config user.name "Your Name"
git config user.email "you@example.com"
git add index.html
git commit -m "Initial commit"
아무 파일도 없는 폴더에서는 기록할 내용이 없어 첫 커밋이 만들어지지 않는다. 예제는 index.html만 기록하며, 실제 프로젝트에서는 .env나 API 키 파일을 포함하지 않도록 .gitignore를 먼저 준비한다.
자주 생기는 문제
code 실행 오류
Mac에서는 VS Code에서 다시 명령 팔레트를 열고 다음 항목을 실행한다.
Shell Command: Install 'code' command in PATH
실행한 뒤 터미널을 완전히 닫았다가 다시 연다.
Windows에서는 VS Code 설치 전에 열어둔 PowerShell에서는 PATH 변경이 반영되지 않을 수 있다. 새 PowerShell을 실행해 다시 확인한다.
codex 실행 오류
먼저 Node.js와 npm이 정상적으로 설치되어 있는지 확인한다.
node --version
npm --version
npm으로 설치했다면 npm 전역 설치 위치가 PATH에 등록되어 있는지 확인한다. 설치가 누락됐을 때만 아래 명령으로 설치한 뒤 터미널을 재시작한다. Homebrew 등 다른 방식으로 설치했다면 그 방식의 설치 상태부터 확인한다.
npm install -g @openai/codex@latest
codex --version
claude 실행 오류
우선 터미널을 닫았다가 다시 연다. 그래도 안 된다면 Claude Code의 설치 위치가 PATH에 등록되었는지 확인한다.
Mac에서는 일반적으로 다음 경로를 확인할 수 있다.
~/.local/bin/claude
Windows 네이티브 설치에서는 다음 폴더가 사용자 PATH에 들어 있는지 확인한다. 아래 표기는 탐색기 주소창에서 사용할 수 있다. PowerShell에서는 $env:USERPROFILE이 사용자 홈 경로이다.
%USERPROFILE%\.local\bin
Windows에서 PowerShell 설치가 정상적으로 동작하지 않는다면 WinGet 방식으로 다시 설치해볼 수도 있다.
winget install Anthropic.ClaudeCode
최종 확인
여기까지 완료했다면 다음 명령들이 정상적으로 동작하는지 확인하면 된다.
code --version
codex --version
claude --version
그리고 테스트 프로젝트 안에서 다음 명령을 실행한다.
code .
VS Code가 열리고, Codex와 Claude Code 확장 프로그램에서 각각 로그인이 되어 있다면 기본 개발환경은 완성된 것이다.
처음에는 Codex와 Claude Code 중 하나만 사용해도 충분하다. 둘 다 설치해두면 같은 문제를 서로 다른 방식으로 검토하거나, 한쪽이 만든 코드를 다른 쪽에 리뷰시키는 식으로 사용할 수도 있다.
설치가 끝난 뒤에는 작은 작업부터 맡기고 변경 내용을 직접 확인하는 것이 좋다. 나는 작업 단위를 작게 나누고, 동작을 확인한 시점에 Git으로 기록을 남기는 방식이 편했다.
VS Code를 중심으로 프로젝트 폴더를 관리하고, Git으로 변경 이력을 남기고, Codex와 Claude Code에게 필요한 작업을 맡기는 형태가 익숙해지면 개발 경험이 많지 않아도 생각보다 많은 일을 직접 해볼 수 있다.
참고 문서
VS Code macOS 설치 · Codex IDE 확장 · Codex CLI · Claude Code VS Code 확장 · Claude Code 설치






