거창하게 바이브 코딩까지는 아니더라도 클로드 코드로 이것저것 만들어 보신 분들은 느끼셨을 겁니다. 프로젝트의 코드가 늘어나고 기능을 덧붙일수록 점점 오류의 늪에서 LLM 이 허덕이고, 토큰 사용량 제한이 목구멍까지 차오르는 경험을…

저도 소프트웨어 업계에서 밥 빌어먹고 사는 처지긴 하지만 바이브 코딩, CLI 기반 AI 에이전트들에 대한 깊이있는 경험은 없어서 이런 문제에 대한 뽀족한 해결책이 있는건 아닙니다. 하지만 클로드 코드 가지고 놀다보니 얘가 코드를 다루는 방식이 마음에 안듭니다. 예를 들어 git 작업하다 코드 충돌이 발생해서 "<<<<<<< HEAD" 마커가 생겼을 때, 클로드는 이걸 소스 전체에서 찾아서 해결하는게 아니라 (빌드 - 빌드에러 - 수정) 프로세스를 반복하더라구요.

당연히 사람이라면 소스 전체에서 "<<<<<<< HEAD" 키워드 검색해서 문제 위치를 확인하고 수정했을 겁니다. 짧은 생각으론 클로드가 소스 전체를 직접 뒤지기는 (프롬프트 제한으로) 어려우니 비효율적인 방법으로 해결하는 것이 아닌가 싶습니다. 위와 같은 상황은 여러가지 비효율적인 코드 처리의 사례 중 하나일 뿐, VS Code 같은 IDE 를 직접 다루는 사람의 입장에서 보면 맘에 안드는 AI 작업방식이 많습니다. LLM 이 코딩을 잘하는 것은 맞지만 기계적이고 정적인 작업은 VS Code 같은 IDE 를 도구처럼 사용하는 것이 좋겠다는 것이 제 결론이었습니다.

그래서 클로드 코드의 토큰을 탈탈 털어 [클로드 코드 <-> VS Code]를 연동하는 앱을 만들었습니다.

먼저 VS Code 에는 IDE Adapter 라는 extension 을 제작해서 설치했습니다.

- https://github.com/godstale/IDE-Adapter

- VS Code > Extension 패널에서 IDE Adapter 검색

- 또는 code --install-extension godstale.ide-adapter 커맨드 실행

IDE Adapter는 VS Code 가 시작될 때 웹 소켓을 생성하고 외부에서 요청이 들어오기를 기다립니다. 그리고 요청이 들어오면 아래와 같은 작업들을 처리합니다.

/app/vscode/edit/find        키워드 검색 결과 조회 
/app/vscode/edit/replace    검색 후 변경 
/app/vscode/nav/definition    symbol definition 위치 확인 
/app/vscode/nav/references    symbol 호출 코드 위치 확인 
/app/vscode/diag/list        지정한 파일 리스트 진단 결과 조회 (errors / warnings) 
/app/vscode/nav/symbols        파일에 포함된 symbol 리스트 조회 
/app/vscode/history/list    지정한 파일의 commit history 
/app/vscode/history/diff    두 개의 git commits 사이의 코드 변경점 조회 
/app/vscode/history/rollback    특정 commit 으로 롤백 
/app/vscode/fs/findFiles        프로젝트 전체에서 파일 찾기 
/app/vscode/localhistory/list    VS Code 자체의 local save history 조회 (timeline) 
/app/vscode/localhistory/diff    local history 사이의 변경점 조회 
/app/vscode/localhistory/rollback    local history 롤백

IDE Adapter Extension 설치가 완료되면 VS Code 에서 작업중인 프로젝트(폴더)를 불러옵니다.

그리고 같은 프로젝트 폴더에서 클로드 코드(CLI)도 실행합니다. 클로드 코드에서는 스킬을 이용해 VS Code 기능을 사용합니다. 이를 위해 IDE Adapter Skill 을 만들어 두었습니다.

- https://github.com/godstale/IDE-Adapter-Skill

아래 커맨드를 이용하면 간편하게 설치할 수 있습니다.

- npx skills add godstale/IDE-Adapter-Skill

이제 작업할 프로젝트 root 에서 (늘 하던 방식대로) 클로드 코드를 실행합니다.

스킬이 설치되어 있으므로 클로드 코드에서 VS Code 연동해서 동작할만한 (IDE Adapter 기능 리스트 참고) 프롬프트를 입력해 보세요. 그럼 클로드 코드는 .vscode/settings.json 파일에서 접속 정보를 읽어와서 VS Code 연결 설정을 합니다. 스킬을 사용하면 LLM 이 직접 파일과 코드를 뒤져서 찾는게 아니라 VS Code 를 이용해서 작업을 수행합니다.

- 특정 파일의 수정내역을 요청한 예시

- 프로젝트 전체에서 문자열을 검색한 예시

- 클로드 코드에서 위 예제가 동작할 때 VS Code Extension 로그 (IDE Adapter 로그)

체감상 프로젝트의 사이즈가 커지면 커질수록 클로드 코드의 토큰 사용량은 급증하는 것 같습니다.

이럴때일수록 VS Code 와 클로드가 긴밀히 연동되면 코드 분석과 작성, Lint, 토큰 사용량 감소에 효과가 더욱 커질거라 예상합니다.

뭐 대단한 앱을 만든건 아니지만 일주일치 Pro 사용량과 몇 일간의 노력이 들어갔습니다.

다운로드 받으셔서 사용해보시고, 필요하시면 github 에서 소스코드를 받아 자신만의 앱으로 DIY 해보시기 바랍니다.