Visual Studio Code에서 Codex 사용하는 방법 정리

안녕하세요. 이번 시간에는 ChatGPT 유료 사용자라면 무료로 활용할 수 있는 Codex 사용 방법에 대해서 한 번 알아보겠습니다.
ChatGPT를 사용하다 보면 왼쪽 메뉴에 Codex 아이콘이 보이는데, 이걸 어떻게 활용하면 될지 궁금하셨던 분들도 많으실 거예요.

Codex란 무엇일까?

Codex는 주로 컴퓨터 프로그래밍(코딩) 작업을 도와주는 인공지능 도구예요. 마치 개발자(프로그래머)들이 옆에 두고 사용하는 전문 보조 엔지니어라고 생각하시면 됩니다.

 

1. 코드를 대신 짜줍니다

우리가 말로 설명한 내용을 컴퓨터 언어로 바꿔 주는 역할을 합니다.
예를 들어, “이런 기능을 하는 프로그램을 만들어줘”라고 자연어로 말하면 Codex가 그 말뜻을 이해하고 실제로 작동하는 코드를 작성해 줍니다.

예시) “로그인 화면을 만들고, 비밀번호가 틀리면 ‘오류’ 메시지를 띄우는 코드를 짜줘.” 라고 입력하면 Codex가 해당 기능을 수행하는 코드를 자동으로 생성해 줍니다.

 

2. 코드에서 오류(버그)를 찾아 고쳐줍니다

사람이 직접 작성한 코드에 문제가 있어 프로그램이 제대로 작동하지 않을 때(이걸 보통 ‘버그’라고 하죠),
Codex가 코드를 읽고 어디가 잘못되었는지 분석한 뒤, 수정 방법을 알려주거나 직접 고쳐주기도 합니다.

 

3. 코드를 관리하고 정리(리팩토링)해 줍니다

Codex는 코드의 전체 구조를 파악해서 더 깔끔하고 효율적인 형태로 정리해 줄 수 있습니다.
다른 사람이 짠 복잡한 코드가 있을 때 “이 코드가 무슨 일을 하는지 설명해줘”라고 물어보면, 코드의 역할을 이해하기 쉽게 설명해 주기도 합니다.

Visual Studio Code와 Codex를 연결하면 뭐가 좋을까?

그럼 Visual Studio Code(VS Code)와 Codex를 연결하면 어떤 점이 좋을까요?

• 코드를 입력하는 즉시 실시간 자동 완성을 받을 수 있고,
• 코드의 오류를 빠르게 찾아서 수정할 수 있으며,
• 여러 파일, 여러 문서를 동시에 참고하면서 코드를 작성할 수 있습니다.

비슷한 도구로 커서(Cursor) AI도 있는데, VS Code 스타일의 편집 환경을 제공하면서 다양한 AI 모델을 사용할 수 있다는 장점이 있습니다. Codex의 경우에는 ChatGPT 유료 사용 중이라면 추가 비용 없이 연동해서 쓸 수 있다는 점이 큰 장점입니다.

VS Code에 Codex 연결하기 (설치 순서)

앞으로는 Visual Studio Code를 줄여서 VS Code라고 부르겠습니다.전체 순서는 간단합니다.

1. VS Code 설치
2. VS Code에서 Codex 확장 프로그램 설치
3. ChatGPT 계정으로 로그인하여 Codex 연결

1단계: VS Code 설치하기

 

1. VS Code 다운로드

1. 네이버에서 “VS Code 다운로드”로 검색합니다.
2. 검색 결과 중에서 마이크로소프트 공식 사이트를 선택합니다.

 

2. 운영체제에 맞게 설치

사이트에 접속하면 Windows, macOS, Linux 등 운영체제별 설치 파일이 보입니다.
자신의 환경에 맞는 버전을 선택해서 다운로드 후 설치를 진행합니다.

2단계: VS Code에서 Codex 확장 프로그램 설치

1. VS Code 실행 후 확장(Extensions) 메뉴 열기

1. VS Code를 실행합니다.
2. 왼쪽 사이드바에서 네모 4개가 겹쳐져 있는 아이콘을 클릭합니다.
   이 메뉴가 바로 VS Code에 새로운 기능을 추가할 수 있는 “확장 프로그램 마켓”입니다.

2. Codex 확장 프로그램 검색 및 설치

1. 확장 검색창에 “codex”를 입력합니다.
2. 검색 결과에서 “codex – OpenAI’s coding agent”를 찾습니다.
3. 해당 항목을 선택한 뒤, “설치(Install)” 버튼을 클릭합니다.

 

설치가 완료되면 VS Code 왼쪽 메뉴바에 ChatGPT 또는 Codex 아이콘이 새로 나타납니다.

 

만약 아이콘이 바로 보이지 않는다면, 새 파일을 하나 만들어서 코드 편집 화면을 열어본 뒤 다시 확인해 보세요.

3단계: Codex 로그인 및 연결하기

1. ChatGPT / Codex 패널 열기

1. 왼쪽 메뉴바에서 ChatGPT 또는 Codex 아이콘을 클릭합니다.
2. 오른쪽 또는 왼쪽에 Codex 패널이 열리면서 로그인 화면이 나타납니다.

 

2. ChatGPT 계정으로 로그인

1. ChatGPT에 사용 중인 이메일과 비밀번호를 입력합니다.
2. 2단계 인증을 사용하고 있다면 인증 절차를 완료합니다.
3. 정상적으로 로그인되면 Codex 패널에 대화 입력창이 활성화됩니다.

 

이제 VS Code에서 코드 작성 중에 바로 Codex에게
“이 함수 리팩토링 해줘”, “이 오류 원인 알려줘”, “로그인 기능 코드 만들어줘”처럼 자연어로 요청하면 됩니다.

Codex 창을 오른쪽으로 옮기기

기본 설정에서는 Codex 패널이 왼쪽에 뜨는 경우가 있는데, 코드와 패널을 함께 보려면 오른쪽으로 옮기는 것이 더 편할 수 있습니다.

1. Codex 또는 ChatGPT 아이콘 위에 마우스를 올린 뒤, 오른쪽 클릭합니다.

2. 메뉴에서 “다음으로 이동 → 보조 사이드바”를 선택합니다.

 

3. 이제 Codex 창이 VS Code 오른쪽으로 이동합니다.

 

이렇게 설정해 두면 왼쪽에는 코드, 오른쪽에는 Codex를 두고 마치 옆에 개발 파트너를 두고 작업하듯이 편하게 사용할 수 있습니다.

마무리: ChatGPT 유료 사용자라면 꼭 써볼 만한 도구

정리해보면, Codex는 코드를 대신 짜주고, 오류를 잡아주고, 코드 설명까지 해주는 AI 코딩 도우미입니다.
특히 ChatGPT 유료 사용 중이라면 VS Code와 연동해서 추가 비용 없이 활용할 수 있다는 점이 가장 큰 장점입니다.

앞으로 프로그래밍 공부를 하시거나, 업무에서 코드를 자주 다루신다면
VS Code와 Codex를 한 번 연결해 사용해 보시길 추천드립니다.