VS 코드 에이전트 모드에 대해 들어보셨나요?
비주얼 스튜디오 코드(VS 코드)를 사용하고 있다면, 이 기능이 당신의 새로운 친구가 될 것입니다. 코드를 제안할 뿐만 아니라 실제로 작업을 수행하는 AI 사이드킥을 상상해보세요. 파일을 편집하고, 명령어를 실행하고, 오류를 수정하며, 당신이 커피를 마시고 승인하는 고개를 끄덕이는 동안 모든 것을 처리해 주죠.
이게 바로 에이전트 모드의 핵심이며, 오늘은 재미있고 초보자 친화적인 분위기에서 사용하는 방법을 단계별로 안내해 드리겠습니다. VS 코드 에이전트 모드의 세계에 뛰어들어 어떻게 코딩을 더욱 가속화할 수 있는지 살펴봅시다!
VS 코드 에이전트 모드란 무엇인가? 간단한 소개
자, 이 VS 코드 에이전트 모드는 무엇인가요? 깃허브 코파일럿—VS 코드의 AI 지원 도우미—가 "유용한 제안자"에서 "자율적인 코더"로 발전합니다. 에이전트 모드에서 코파일럿은 단순히 당신이 타이핑하기를 기다리지 않고, 스스로 책임을 집니다. "자바스크립트로 투두 앱을 만들어 줘"와 같은 고수준의 작업을 제공하면, 파일을 수정하고 코드를 작성하며 명령을 실행하고, 오류를 스스로 수정합니다. 잠을 자지 않는 로봇과 함께 페어 프로그래밍을 하는 것과 같습니다!
2025년 4월 10일 기준 에이전트 모드는 활성 개발 중이며, 외부 도구 및 데이터에 접근할 수 있는 모델 컨텍스트 프로토콜(MCP) 지원과 같은 다양한 기능이 포함되어 있습니다. 당신이 초보자든 전문가든, 이는 게임 체인저입니다. 사용해 볼 준비가 되셨나요? 설정해 봅시다!
왜 VS 코드 에이전트 모드를 사용하는 것이 좋을까요?
실습을 시작하기 전에, VS 코드 에이전트 모드가 훌륭한 이유를 이야기해 보겠습니다:
- 핸즈오프 코딩: 원하는 것을 말하면 그것을 처리합니다—다단계 작업에 완벽합니다.
- 스마트 수정: 오류를 잡아내고(구문 오류나 실패한 테스트 등) 이를 수정하기 위해서 다시 시도합니다.
- 도구의 힘: 기본 수정 이상의 작업을 위해 내장 도구, MCP 서버 및 확장 기능을 사용합니다.
- 당신이 장악: 모든 변경 사항을 승인하므로, AI의 재앙은 없습니다.
개인 코딩 어시스턴트로 여겨주세요. 항상 한 단계 앞서 있습니다. 자, 이제 작동시켜 봅시다!
VS 코드 에이전트 모드 설정 방법: 단계별 안내
VS 코드 에이전트 모드를 시작하는 것은 매우 쉽습니다. 다음은 스위치를 켜고 마법을 풀어내는 방법입니다:
1단계: VS 코드 업데이트
첫 번째로, 당신의 VS 코드가 에이전트 모드를 지원하는 최신 버전인지 확인하세요. code.visualstudio.com에 접속하여 안정적인 버전을 다운로드하거나 Insider 버전으로 최신 기능을 사용하세요.
2단계: 에이전트 모드 활성화
에이전트 모드는 버전 및 롤아웃 상태에 따라 기본적으로 활성화되어 있지 않을 수 있습니다. 이제 어떻게 활성화할 수 있는지 확인해 보겠습니다:
VS 코드를 엽니다.
Ctrl + , (Mac에서는 Cmd + ,)를 눌러 설정을 엽니다.
chat.agent.enabled를 검색하여 체크되어 있는지 확인합니다.
보이지 않을 경우 업데이트 후 VS 코드를 새로 고치세요—빌드에서 사용할 수 있다면 나타날 수 있습니다. 도움말 > 업데이트 확인를 통해 업데이트를 확인하세요.
전문가 팁: 이 단계는 에이전트 모드가 더 널리 보급됨에 따라 불필요해질 수 있습니다. 현재로서는 이 토글(있을 경우)이 이를 조기에 쓸 수 있게 합니다!
3단계: GitHub에 로그인
VS 코드 에이전트 모드는 GitHub Copilot에서 운영되므로 활성 구독이 필요합니다.
VS 코드에서 사이드바의 코파일럿 아이콘을 클릭하거나 관련 단축키(예: Ctrl+Shift+I / Cmd+Shift+I)를 사용하여 코파일럿 패널을 엽니다.
GitHub 자격 증명으로 로그인하세요. 코파일럿 구독이 없으면 GitHub를 통해 가입해야 할 수 있습니다.
4단계: 채팅 보기 열기 및 에이전트 모드 선택
이제 즐거운 부분으로 넘어가 보겠습니다:
코파일럿 채팅 보기를 엽니다 (Ctrl+Shift+I / Cmd+Shift+I).
채팅 입력 창 하단의 모드 드롭다운을 찾습니다. "질문하기", "편집하기" 또는 "에이전트"라고 표시될 수 있습니다.
에이전트를 선택합니다. 짠—당신은 VS 코드 에이전트 모드에 들어왔습니다!
VS 코드 에이전트 모드 사용 방법: 함께 만들어 보아요!
자, 설정은 완료되었습니다—이제 에이전트 모드가 작동하는 모습을 볼 차례입니다! 함께 간단한 리액트 투두 앱을 만들어 봅시다. 빈 VS 코드 작업 공간을 준비하고 따라 해 보세요.
1단계: 작업을 부여하세요
에이전트 모드가 선택된 상태의 채팅 보기에 명확하고 고수준의 작업을 입력하세요. 예를 들어:
>> 간단한 리액트 투두 애플리케이션을 만듭니다. 작업을 추가할 입력 필드 및 작업 목록을 표시해야 합니다.
Enter를 누릅니다. 파일을 지정할 필요는 없습니다—에이전트 모드가 그것을 알아서 처리합니다!
2단계: 계획이 전개되는 모습을 지켜보세요
코파일럿이 응답을 시작하고 사고 과정을 스트리밍하기 시작합니다. 이렇게 말할 수 있습니다:
"좋아요, 도와줄 수 있어요. 계획은 다음과 같습니다:
- 기본 리액트 프로젝트 구조 설정(필요한 경우).
- 상태 관리를 담당할
App.js메인 컴포넌트 생성. - 입력 필드를 위한
TodoForm.js컴포넌트 생성. - 작업을 표시할
TodoList.js컴포넌트 생성. 필요한 파일을 생성하는 것부터 시작할게요..."
마치 친구가 실시간으로 코딩하는 모습을 지켜보는 것과 같습니다! 또한 프레시는 npm init react-app과 같은 터미널 명령어도 제안할 것입니다.
3단계: 도구 승인하기
에이전트 모드는 도구를 사용해야 할 수 있습니다. npm install을 실행하거나 내장 파일 작업을 사용해야 할 수도 있습니다. 다음과 같은 프롬프트를 보게 될 것입니다:
"실행하세요
npm install react react-dom
#터미널
#파일 시스템
src/App.js
"계속"을 클릭하여 승인합니다(또는 먼저 명령어를 수정할 수 있습니다). 세션에 대해 도구를 자동으로 승인할 수 있는 드롭다운도 있을 수 있습니다—편리하지만 현명하게 사용하세요!
4단계: 편집 내용 검토하기
에이전트 모드가 작업하는 동안 코드가 편집기에 스트리밍되며 변경 사항을 보여주는 오버레이가 표시됩니다(차이 보기). 우리의 투두 앱의 경우 다음과 같은 업데이트가 있을 수 있습니다:
App.js가 작업을 위한 상태 관리(useState)와 함께 업데이트됩니다.
양식 및 입력 요소가 포함된 새로운 파일 src/TodoForm.js.
작업 항목을 렌더링하는 새로운 파일 src/TodoList.js.
오버레이 또는 차이 뷰어에서 위/아래 화살표를 사용하여 편집 항목을 탐색한 다음 "승인"을 클릭하여 변경 사항을 유지하거나 "버리기"를 클릭하여 거부합니다. 채팅 보기에는 일반적으로 변경된 파일 목록이 표시되어 쉽게 추적할 수 있습니다.
5단계: 반복 및 개선하기
완벽하지 않은가요? 에이전트 모드에게 무엇을 수정하거나 추가할지 알려주세요:
>> Now, 클릭하면 작업을 완료로 표시하고 할 일 목록에 추가된 작업의 글꼴 색상을 검정색으로 변경하세요.
에이전트 모드는 다시 돌아와 요청을 분석하고 변경 사항을 제안하며(구성된 경우 tasks.json에서) 코드를 업데이트합니다. 원하는 대로 수정할 때까지 계속됩니다—또는 당신이 일시 중지할 때까지요.
VS 코드 에이전트 모드 마스터하기: 팁과 요령
기본 사항을 배웠으니, 이제 VS 코드 에이전트 모드 기술을 향상시켜 보겠습니다!
- 구체적인 프롬프트 사용: "앱 만들기"와 같은 모호한 작업은 효과적이지 않을 수 있습니다. 집중된 목표를 시도해 보세요: "Context API를 사용하여 리액트 앱에 다크 모드 토글 추가하기." 또는 "이 파이썬 스크립트
utils.py를 더 나은 조직을 위해 클래스를 사용하도록 리팩토링하기." 명확한 목표 = 더 나은 결과! - # (또는 다른 구문)와 함께 도구 활용: 에이전트 모드가 특정 기능을 사용하도록 하려면 지정된 구문(예:
#)을 사용하세요. #터미널로 명령어를 실행합니다.#코드베이스로 프로젝트에서 관련 정보를 검색합니다.#fetch로 URL에서 데이터를 가져옵니다. 채팅 입력 영역에 있는 아이콘이나 명령으로 사용 가능한 도구를 확인하세요.
- 필요할 때 일시 중지 또는 취소: 에이전트 모드가 잘못된 방향으로 가고 있다면(예: 잘못된 파일을 편집하거나 문제가 발생하는 경우) "일시 중지"를 눌러 프롬프트를 수정하거나 "취소"를 눌러 현재 작업을 중단할 수 있습니다. 지금까지 이루어진 유용한 변경 사항을 여전히 승인할 수 있습니다.
- 전문가처럼 실행 취소: 변경 사항 수용 중 실수를 하셨나요? "마지막 편집 실행 취소"를 사용하여 롤백합니다(또는 채팅 입력/제목 표시줄 근처에서 자주 찾을 수 있는 유사한 명령). 마음이 바뀌셨나요? "마지막 편집 다시 실행"이 돌아올 수 있습니다. AI를 위한 Ctrl+Z/Cmd+Z와 같습니다!
- 설정 수정(가능한 경우): 설정(
Ctrl + ,)로 이동하고 관련 에이전트 모드 또는 코파일럿 채팅 설정을 검색하세요. 다음과 같은 옵션을 찾을 수 있습니다: chat.agent.maxRequests: 몇 단계/반복을 제한할 것인지.github.copilot.chat.agent.runTasks: 작업 공간 작업의 자동 실행 전환(예:tasks.json에 정의된 빌드/테스트)을 전환합니다.
에이전트 모드 vs. 편집 모드: 언제 무엇을 사용해야 하나요?
코파일럿 채팅에서 에이전트 모드와 편집 모드의 차이가 헷갈리시나요? 다음과 같이 설명합니다:
- 에이전트 모드: AI가 계획을 세우고 파일을 관리하며 자율적으로 수정할 수 있는 크고 다단계 작업에 가장 적합합니다(예: "기능 구축하기", "이 모듈 리팩토링하기"). 더욱 자율적입니다.
- 편집 모드(또는 인라인 채팅): 현재 파일이나 선택된 영역 내에서 빠르고 범위가 제한된 변경에 적합합니다(예: "이 기능 수정하기", "이 변수 이름 바꾸기", "여기에서 오류 처리 추가하기"). 더 직접적인 통제력이 있습니다.
어떤 파일이 변경이 필요한지 정확히 모르거나 더 큰 작업을 어떻게 접근해야 할지 모르겠다면 에이전트 모드에게 리드하게 하세요. 특정 위치에서 정밀 수정이 필요하다면 편집이 더 빠를 수 있습니다.
결론: 당신의 AI 페어 프로그래머가 도착했습니다
VS 코드 에이전트 모드는 AI 지원 개발을 향한 중대한 진전을 나타냅니다. 복잡하고 다단계 코딩 작업을 깃허브 코파일럿에 위임함으로써, 더 높은 수준의 설계, 문제 해결 및 생성된 코드를 검토하는 데 더 집중할 수 있습니다. 어떻게 설정하고 간단한 애플리케이션을 만드는 방법을 안내했으며 결과를 세밀하게 조정하는지도 보았습니다. 명확한 지침과 세심한 검토가 필요하지만, 에이전트 모드는 개발 워크플로를 급격히 가속화하고 코딩 문제를 더 효율적으로 처리할 수 있는 잠재력을 가지고 있습니다.
당신의 새로운 AI 페어 프로그래머를 사용해 볼 준비가 되셨나요? VS 코드를 실행하고, 코파일럿가 설정되어 있는지 확인하고, 에이전트 모드로 전환하고, 현재 프로젝트에서 실제 작업을 부여하세요. 무엇을 먼저 구축하거나 리팩토링 하시겠습니까?