VS Code 에이전트 모드를 활용한 로컬 도구 통합을 위한 Model Context Protocol (MCP) 구현
카테고리
프로그래밍/소프트웨어 개발
서브카테고리
개발 툴
대상자
VS Code 사용자 및 AI 에이전트 도구 개발자(중급 이상)
핵심 요약
- Model Context Protocol (MCP)는 AI 모델이 로컬 도구와 실시간으로 상호작용할 수 있는 표준화된 프로토콜로,
@modelcontextprotocol/sdk와Express.js기반 서버 구현 가능 - MCP 서버 구조는 JSON Schema 기반의
toolName,parameters,returns정의를 통해 확장 가능한 아키텍처 제공 - VS Code Agent Mode를 활용한 MCP 서버 연동 시,
createTodo,listTodos,updateTodo,deleteTodo등 4개 주요 도구 함수 구현 가능
섹션별 세부 요약
1. AI-Assisted 개발 진화
- GitHub Copilot의 기존 한계: 로컬 도구 실행, 인트라넷 KB 접근 불가
- Agent Mode 도입으로 터미널 명령 실행, 파일 수정, 프로젝트별 작업 처리 가능
2. Model Context Protocol (MCP) 개요
- MCP 기능
- 로컬 도구 직접 호출, 실시간 환경 상호작용, 표준 프로토콜
- 커스텀 도구 정의, 플러그인 기반 시스템
- Context-aware 지원 및 세션 관리
3. 프로젝트 설정 및 구현
- 필수 사전 조건
- Node.js v22 이상, VS Code, Express.js 기초 지식
- 디렉토리 구조
```bash
mcp-todo-server/
├── src/
│ ├── config/
│ ├── tools/
│ └── server.js
└── package.json
```
- 의존성 설치
```bash
npm install @modelcontextprotocol/sdk express lowdb zod
```
4. MCP 서버 구현
- 도구 정의 예시
```json
{
"name": "createTodo",
"description": "새로운 할 일 생성",
"parameters": {
"title": "string"
},
"returns": {
"id": "string"
}
}
```
- lowdb 활용
- JSON 파일 기반 데이터 저장, CRUD 작업 지원
5. VS Code 연동
- Agent Mode 활성화
- VS Code 설정에서 MCP Server URL(http://localhost:3000) 등록
- 도구 사용 예시
- Create a new todo item called 'Review PR #123' → "Review PR #123" 생성
6. 향후 개선 방향
- 보안 강화: 사용자 인증, 역할 기반 접근 제어
- 기능 확장: 할 일 마감일, 카테고리, 우선순위 추가
- 성능 최적화: 캐싱, 데이터베이스 최적화, 요청 제한
결론
MCP를 통해 VS Code에 로컬 도구를 통합할 경우, @modelcontextprotocol/sdk와 Express.js 기반 서버 구현을 통해 AI 모델과 실시간 상호작용이 가능하다. 초기 설정 시 포트 3000 확인 및 VS Code 설정 파일에 MCP 서버 URL 추가가 필수이며, 향후 인증 시스템 확장과 성능 최적화가 주요 개선 방향이다.