서브 에이전트 사용법을 잘못 알고 있었습니다…20시간 테스트 후 얻은 노하우

채널 아이콘
AI Jason 구독자 167,000명

요약

Cloud Code의 서브 에이전트 기능은 문맥 최적화와 토큰 절약을 위해 도입됐지만, 많은 사용자가 느린 속도와 결과 미흡으로 부정적인 경험을 했습니다. 실제로 서브 에이전트를 구현 작업까지 맡기면 각각의 에이전트와 부모 에이전트가 문맥을 공유하지 못해 잦은 대화 압축(compaction)과 정보 단절이 발생합니다. 20시간 이상의 테스트 끝에 서브 에이전트는 ‘연구자’처럼 정보 조사와 요약에만 집중시키고, 파일 시스템을 통한 컨텍스트 관리로 문맥을 유지하는 방식이 가장 효과적이라는 걸 깨달았습니다. 이를 바탕으로 서비스별 전문 서브 에이전트를 설계하고, 공통의 MD 파일로 프로젝트 전반 문맥을 주고받아 일관된 성능과 재현성을 확보했습니다.

주요 키워드

서브 에이전트(sub-agent) 컨텍스트 최적화 Cloud Code MCP 도구 대화 압축(compaction) 전문화 에이전트 파일 시스템 컨텍스트 관리 컨텍스트 엔지니어링 오케스트레이션 AI Builder Club

하이라이트

  • 🔑 서브 에이전트는 문맥 최적화와 토큰 절약을 위해 도입됐다. 단순 구현보다는 정보 조사·요약에 집중시켜야 성능 개선이 가능하다.
  • ⚡️ 기존 방식은 부모 에이전트가 대화 이력을 전부 처리해 토큰 사용량이 급증하고, 대화 압축 시 성능이 크게 떨어졌다.
  • 🌟 서브 에이전트를 ‘연구자’로 정의해 정보 수집과 요약보고만 맡기면, 부모 에이전트가 핵심 결과를 바탕으로 구현을 일괄 처리할 수 있다.
  • 📌 파일 시스템에 컨텍스트를 MD 파일 형태로 저장·관리하면 서로 다른 에이전트 간 문맥 공유가 쉬워진다.
  • 🚀 서비스별 전문 서브 에이전트(예: Chassis UI, Vercel AI SDK, Stripe 등)를 만들면 해당 도구·문서에 특화된 조사와 계획 수립이 가능하다.
  • 🔍 Manus 팀이 제안한 ‘파일 시스템을 활용한 컨텍스트 관리’ 아이디어를 차용해, 각 단계별 결과를 로컬 파일로 기록·재사용했다.
  • 💡 부모 에이전트는 MD 파일을 참조해 전체 프로젝트 플랜을 유지하고, 각 서브 에이전트는 작업 전후에 해당 파일을 읽고 업데이트한다.
  • ✅ 이 구조를 적용하자 Cloud Code 워크플로우의 성공률과 일관된 결과물이 눈에 띄게 향상됐다.
  • 🎯 서브 에이전트 설계 시 목표(goal), 도구(tool), 출력 포맷(output format)을 명확히 지정해 혼선을 방지해야 한다.
  • 📢 AI Builder Club을 통해 템플릿·데모·최신 팁을 공유하니, 관심 있으면 함께해보자!

용어 설명

서브 에이전트(sub-agent)

부모 에이전트가 특정 조사나 요약 같은 보조 업무만 위임하는 에이전트

부모 에이전트(parent agent)

전체 워크플로우를 총괄하며 구현 작업과 의사결정을 담당하는 에이전트

대화 압축(conversation compaction)

토큰 사용량을 줄이기 위해 이전 대화를 요약·축약하는 과정. 과도하면 문맥 손실이 발생한다.

MCP 도구

코드베이스나 문서를 필요한 부분만 검색·추출해 주는 마이크로 컨텍스트 프로바이더(Micro Context Provider) 도구

컨텍스트 엔지니어링(context engineering)

AI 에이전트가 사용할 문맥을 설계·관리해 모델 성능을 최적화하는 기법

파일 시스템 기반 컨텍스트 관리

대화 기록 대신 파일(MD 등)에 결과를 저장해 필요할 때 불러와 사용하는 방법

전문화 에이전트(expert agent)

특정 라이브러리나 서비스(Chassis, Vercel AI SDK 등)에 대한 지식·도구를 갖춘 서브 에이전트

[00:00:02] 기능 도입과 초기 경험

Cloud Code가 서브 에이전트 기능을 공개한 후, 많은 사용자는 느린 속도와 높은 토큰 사용량, 결과 미흡으로 부정적 평가를 내렸다. 발표자는 이 문제를 몸소 겪었으나, 최적 사용법을 학습하며 상황이 완전히 달라졌다고 설명한다.

Claude가 몇 주 전에 서브 에이전트 기능을 출시했지만, 많은 사용자들이 느리고 토큰 소비가 많으며 결과가 좋지 않다는 부정적인 경험을 했다고 설명합니다.
최근 서브 에이전트 모범 사례를 배우면서 Claude의 성능이 크게 향상되었으며, 이 경험을 바탕으로 서브 에이전트 시스템 설계 방법을 공유하겠다고 말합니다.
[00:00:31] 서브 에이전트 개념 배경

Cloud Code 에이전트는 파일 읽기·검색 같은 도구들을 장착한 AI로, 모든 작업을 처리하면 컨텍스트 창이 금세 포화된다. 대화 압축(compaction) 후 성능 저하를 해결하기 위해 ‘task’ 툴을 통해 작업을 분산하도록 서브 에이전트를 도입했다.

Claude 에이전트가 파일 읽기, 나열, 편집 등의 다양한 도구를 가지고 작동하며, 특히 읽기 도구는 전체 파일 내용을 대화에 포함시켜 많은 토큰을 소비한다고 설명합니다.
서브 에이전트 기능 이전에는 모든 작업을 Claude 에이전트 혼자 수행했는데, 이로 인해 구현 전에 컨텍스트 윈도우의 80%를 사용하게 되어 대화 압축이 필요했습니다.
[00:01:16] 토큰 절감 메커니즘

부모 에이전트는 조사 과정을 대화 이력에 포함시키지 않고, 서브 에이전트가 요약 보고만 반환하도록 설정해 대폭 토큰을 아낀다. 대량 토큰 소비 업무는 수백 토큰 요약으로 대체돼 효율이 높아진다.

대화 압축은 이전 작업에 대한 컨텍스트를 잃어 성능이 극적으로 떨어지는 문제를 야기했기 때문에, Claude는 태스크 도구를 도입하여 다른 에이전트에게 작업을 할당할 수 있게 했습니다.
서브 에이전트는 토큰 절약을 위해 설계되었는데, 상위 에이전트는 서브 에이전트의 중간 작업 과정을 대화 기록에 포함시키지 않고 오직 요약 결과만 받아서 다음 행동을 결정합니다.
[00:02:12] 잘못된 활용 사례

서브 에이전트에 직접 구현까지 맡기면, 각 에이전트가 이전 작업 문맥을 공유하지 못해 디버깅과 수정이 어려워진다. 부모 에이전트 역시 단순 태스크 배정·완료 상태만 파악해 전체 흐름을 이해하지 못한다.

이 방식을 통해 파일 읽기와 검색으로 인한 대량의 토큰 소비를 몇 백 개의 토큰 요약으로 줄이면서도 다음 행동 안내에 필요한 중요한 정보는 모두 유지할 수 있습니다.
프론트엔드와 백엔드 개발 에이전트를 분리하고 부모 에이전트가 작업을 조율하는 아이디어를 설명합니다. 처음에는 좋아 보였지만 실제로는 각 에이전트가 제한적인 정보만 가지고 있어 문제가 발생했습니다.
서브 에이전트의 구현이 완벽하지 않을 때 수정이 어려운 이유를 설명합니다. 각 에이전트는 자신의 작업에 대한 정보만 알고 있어 전체 맥락을 파악하기 어렵습니다.
프론트엔드 버그 수정 시나리오를 예로 들어 문제점을 설명합니다. 에이전트들이 이전 세션의 정보를 공유하지 못해 매번 새로운 대화를 시작해야 하는 상황을 보여줍니다.
[00:03:18] 최적 활용법 제안

서브 에이전트를 ‘리서처’로 규정해 조사·계획 단계에만 투입하고, 구현은 부모 에이전트가 전담해야 한다. Adam Wolf도 정보 수집·요약에 집중시킬 때 성과가 제일 좋다고 피드백했다.

부모 클라우드 코드 에이전트도 서브 에이전트의 상세한 작업 내용을 알지 못해 버그 수정에 한계가 있음을 설명합니다. 에이전트 간 맥락 공유의 필요성을 언급합니다.
현재 상황에서의 최선의 접근법을 제시합니다. 서브 에이전트를 연구자로 간주하고 기획과 연구 단계를 통해 AI 코딩 워크플로우를 개선하는 방향을 제안합니다.
[00:04:09] 서비스별 전문화 전략

Vercel AI SDK, Supabase, Tailwind 등 각 서비스마다 최신 문서와 도구를 갖춘 전문 서브 에이전트를 만든다. 이들은 코드베이스를 스캔해 맞춤형 구현 계획을 수립해 준다.

새로운 아이디어를 소개합니다. Vercel AI SDK, Supabase, Tailwind 등 각 서비스 제공업체별로 전문 에이전트를 만들어 최신 문서와 모범 사례를 바탕으로 구현 계획을 수립하는 방법을 제안하고 실제 구현 과정을 시작했다고 설명합니다.
화자는 최신 SDK v5와 Stripe 문서가 로드된 전문 에이전트들과 Context 7 같은 도구를 통해 복잡한 사용량 기반 가격 설정을 쉽게 구현할 수 있다고 설명합니다.
서로 다른 에이전트 간 컨텍스트 공유 최적화에 대해 언급하며, 매그너스 팀의 블로그에서 배운 컨텍스트 엔지니어링 기법을 소개합니다.
파일 시스템을 궁극적인 컨텍스트 관리 시스템으로 활용하는 방법을 강조하며, 대화 히스토리에 직접 저장하는 대신 로컬 파일에 저장하여 나중에 검색할 수 있게 하는 방식을 설명합니다.
구체적인 구현 방식을 설명하며, 문서 클라우드 폴더 내 작업 폴더에 각 기능의 컨텍스트를 저장하고, 서브 에이전트들이 연구 보고서와 구현 계획을 MD 파일로 생성하는 과정을 상세히 설명합니다.
[00:06:24] 파일 기반 컨텍스트 관리

Manus 팀 블로그에서 영감을 받아, 조사 결과와 계획을 MD 파일로 저장·관리하는 구조를 채택했다. 부모·서브 에이전트는 작업 전후로 이 파일을 읽고 업데이트해 문맥 일관성을 유지한다.

이러한 설정이 클라우드 코드의 성공률과 결과를 극적으로 향상시켰다고 강조하며, 유용한 서브 에이전트 타입에 대한 아이디어를 제공하겠다고 약속합니다.
첫 창업자들을 위한 조언으로 전환하며, 제품 개발 외에도 사용자 확보, 가격 책정, 고객 가치 증명의 중요성을 언급하고, 디미트리 샤피어의 '돈을 버는 AI 에이전트' 무료 자료를 추천합니다.
HubSpot에서 제공한 AI 제품 개발 가이드를 소개하며, 워크플로우부터 가격 책정까지 포괄적인 내용과 실제 성공 사례들을 다루고 있다고 설명합니다.
서브 에이전트 구축을 시작하면서, 중요한 문서들을 시스템 프롬프트에 직접 포함시키고 컨텍스트 검색을 위한 도구들을 제공하는 일반적인 규칙을 설명합니다.
Shadcn 전문가 예시에서 사용하는 MCP 도구들을 소개합니다. Shadcn 컴포넌트 MCP와 Twinx의 UI 디자인 검색 MCP에 대해 설명합니다.
실제 설정 과정을 보여주며, 터미널을 통해 글로벌 설정을 열고 MCP 서버에 도구들을 연결하는 방법을 설명합니다.
새 에이전트 생성 과정을 설명하며, 프로젝트별 또는 개인 레벨 에이전트 선택과 Claude를 통한 자동 생성 기능에 대해 다룹니다.
에이전트 설정의 마지막 단계로, 생성된 예시를 확인하고 시스템 프롬프트에 문서나 MCP 도구를 첨부하는 과정을 설명합니다.
MCP 도구 설계에 대한 설명으로, 모든 컴포넌트를 나열하고 적절한 컴포넌트를 선택하며 예제 코드를 통해 사용법을 익히는 과정을 포함한다.
[00:09:58] 서브 에이전트 생성 워크플로우

CLI 설정과 `claw.json`·`cloud code` 설정을 통해 에이전트를 생성한다. 시스템 프롬프트에 문서·도구·목표·출력 포맷을 명시하고, 필요한 MCP 도구를 할당하는 방법을 단계별로 소개한다.

각 서브 에이전트마다 명확한 목표를 설정하는데, 상세한 구현 계획을 설계하되 실제 구현은 하지 않고 디자인 파일을 저장하는 것이 핵심이다.
서브 에이전트가 자기 자신을 호출하려는 이상한 행동을 방지하기 위한 규칙들을 추가하고, 모든 서브 에이전트가 유사한 구조를 갖도록 설계했다.
Vercel AI SDK 전문가 에이전트의 예시를 보여주며, 최신 문서와 마이그레이션 가이드를 포함하여 각 서비스별로 전문화된 서브 에이전트를 설정하는 방법을 설명한다.
실제 데모를 위해 shadcn과 함께 Next.js 프로젝트를 설정하고, 클라우드 코드 초기화 과정을 거쳐 서브 에이전트를 위한 특별한 규칙들이 포함된 cloud.md 파일을 생성한다.
[00:12:00] 실전 데모: Next.js 채팅 복제

Chassis UI 서브 에이전트로 UI 설계를 맡기고, Vercel AI SDK 서브 에이전트로 서비스 통합 플랜을 수립한다. 부모 에이전트가 모든 계획을 종합해 구현을 완료하고, 최종 애플리케이션이 고품질 인터페이스와 AI 응답을 제공하는 과정을 시연한다.

서브 에이전트 시스템의 핵심 규칙을 설명합니다. 각 서브 에이전트는 작업 완료 후 MD 파일을 업데이트해야 하고, 작업 시작 전에는 기존 문서를 먼저 읽어야 합니다.
ChatGPT 복제본 구축 데모를 시작합니다. ShadCN을 프론트엔드로, Vercel AI SDK를 백엔드로 사용하여 서브 에이전트가 협업하는 방식을 보여줍니다.
ShadCN 전문가 에이전트가 작업을 수행하는 과정을 상세히 설명합니다. 컨텍스트 파일을 읽고, MCP 도구를 활용해 UI 컴포넌트 정보를 수집하여 설계 계획을 수립합니다.
부모 에이전트가 서브 에이전트의 계획을 바탕으로 실제 구현을 완료하는 과정을 설명합니다. 고품질의 UI가 완성되었지만 일부 오류가 발생했습니다.
새로운 서브 에이전트 구조의 장점을 강조합니다. 부모 에이전트가 전체 컨텍스트를 유지하면서 문제를 효과적으로 해결할 수 있어 오류 수정도 원활하게 처리됩니다.
[00:14:17] 마무리 및 커뮤니티 초대

최적화된 서브 에이전트 구조를 적용해 큰 성과를 거뒀음을 요약하고, AI Builder Club 가입을 권장한다. 무료 템플릿과 최신 팁을 공유하며, 주간 세션에서 함께 학습할 것을 제안한다.

Vercel AI SDK 통합 과정을 시연합니다. 또 다른 서브 에이전트가 전체 코드베이스를 분석하고 최적의 구현 방안을 제시한 후, 부모 에이전트가 이를 실행합니다.
[음악]
Claude가 몇 주 전에 서브 에이전트 기능을 출시했는데
정말 흥미로운 개념이었죠.
하지만 시도해본 사람들은
종종 부정적인 경험을 했습니다.
서브 에이전트가 느리고
토큰을 훨씬 많이 소비하고
무엇보다 더 나은 결과를
가져다주지 않는다고 느꼈거든요.
저도 그런 사람 중 하나였는데
최근에 서브 에이전트를 사용하는
모범 사례를 배우기 시작했고
그것이 완전히 게임을 바꿔놨고
Claude가 더 나은 성능을
일관되게 낼 수 있게 해줬습니다.
그래서 오늘은 제가 서브 에이전트
시스템을 어떻게 생각하고 설계하는지
공유하고 싶습니다. 먼저
Claude가 처음에 왜 서브 에이전트
개념을 도입했는지 이해해야 하는데
Claude 에이전트가 내부적으로
어떻게 작동하는지 모른다면
기본적으로 파일 읽기, 모든 파일
나열하기, 파일 편집 등의
다양한 도구들을 갖춘 에이전트입니다.
일부 도구는 읽기 도구처럼
많은 토큰을 소비할 수 있는데
파일의 전체 내용을 대화 기록에
포함시키기 때문입니다.
Claude에 서브 에이전트 기능이
있기 전에는 모든 작업이
Claude 에이전트 자체에 의해
수행되었는데, 이는 구현을 시작하기 전에
이미 컨텍스트 윈도우의 80%를
사용했을 수도 있다는 뜻입니다.
왜냐하면 그런 파일들은 대량의
컨텍스트를 포함하고 있어서
진행하기 전에 전체 대화를
요약하는 대화 압축 명령을
발생시킬 가능성이 높기 때문이죠.
그리고 아시다시피 대화를
압축할 때마다 성능이
극적으로 떨어집니다. 왜냐하면
이전에 수행한 작업에 대한 컨텍스트를
잃기 시작하기 때문입니다. 그래서
나중에 Claude 에이전트를 위한
태스크 도구를 도입했습니다.
이를 통해 Claude가 다른 에이전트에게
작업을 할당할 수 있게 되었고
이 에이전트는 파일 읽기,
파일 검색을 포함한
정확히 동일한 도구 세트를 가지고
있습니다. 따라서 이 에이전트가
실제로 전체 코드베이스를 스캔하고
변경해야 할 모든 관련 파일이
무엇인지 이해하고
그 정보를 바탕으로 실제
구현을 수행하도록 할 수 있습니다.
이렇게 토큰을 절약하는 방법은
상위 에이전트 관점에서 서브
에이전트가 중간에 수행하는 모든
단계가 상위 에이전트의
대화 기록의 일부가 되지 않기
때문입니다. 서브 에이전트에게
작업을 할당했고 서브 에이전트가
연구 보고서 요약을 가지고
돌아왔다는 것만 볼 수 있고
이것이 다음 최선의 행동을
안내하는 데 사용될 수 있습니다.
이렇게 함으로써 파일 읽기,
파일 검색 작업으로부터 나오는
대량의 토큰 소비를
몇 백 개의 토큰 요약으로
바꿀 수 있지만
여전히 다음 행동을 안내할
가장 중요한 정보는 포함하고 있습니다.
프론트엔드 개발 에이전트가 특별한 규칙과
워크플로우로 프론트엔드 구현만 담당하고
백엔드 구현에 특화된
백엔드 개발 에이전트가 있다면 어떨까 생각했습니다.
그러면 부모 에이전트는
전체 대화를 조율하고
다른 에이전트에게 작업을 위임하기만 하면 됩니다.
처음에는 정말 좋은 아이디어처럼 보였지만
서브 에이전트가 구현한 것이 100% 정확하지 않아서
에이전트가 수정해야 하는 순간이 오면
문제가 시작됩니다. 각 에이전트는
무슨 일이 일어나고 있는지에 대한
매우 제한적인 정보만 가지고 있기 때문입니다.
프론트엔드 개발 에이전트는 자신이 취한 액션과
그 특정 작업에서 생성한
최종 메시지만 알고 있습니다.
백엔드 개발 에이전트도 마찬가지입니다.
클라우드 코드 에이전트에게 프론트엔드 버그가 있다고 하면
프론트엔드 개발자에게 다시 할당하더라도
이것은 단지 새로운 대화를 시작할 뿐입니다.
프론트엔드 개발 에이전트는
이전 프론트엔드 세션에서 무슨 일이 일어났는지
알지 못하고
백엔드 개발자가 이전에 무엇을 했는지에 대한
맥락도 전혀 모릅니다.
따라서 각 작업은 매우 독립적인 세션입니다.
한편, 부모 클라우드 코드 에이전트도
다시 말하지만 매우 제한적인 정보만 가지고 있습니다.
서브 에이전트가 취한 모든 액션을
보지 못하기 때문입니다. 즉,
특정 파일이 생성되었는지,
그 파일에 실제로 무엇이 들어있는지
알 수 없습니다.
부모 에이전트가 보는 것은
프론트엔드 개발자에게 작업을 할당했고
프론트엔드 개발자가 작업 완료했다고 응답하는 것,
백엔드도 마찬가지입니다.
따라서 클라우드 코드 에이전트가
버그를 직접 수정하게 하려면
문제의 원인에 대한
매우 제한적인 정보만 가지게 됩니다.
이 문제는 아마 나중에 해결될 것입니다.
서로 다른 에이전트 간에 맥락을 공유하는
좋은 방법을 찾아서
각각이 항상 무엇이 완료되었는지에 대해
같은 정보를 공유하도록 할 것입니다.
하지만 지금으로서는
각 서브 에이전트를 거의 연구자처럼 간주하고
어떤 종류의 기획과 연구 단계가
현재 AI 코딩 워크플로우를
극적으로 개선할 수 있을지 생각해보는 것이
최선의 방법일 것입니다.
클라우드 코드 팀의 핵심 엔지니어 중 한 명인
Adam Wolf로부터도 비슷한 피드백을 받았는데
서브 에이전트는 정보를 찾고
메인 대화 스레드에
소량의 요약을 제공할 때
가장 잘 작동한다고 했습니다.
이를 통해 아이디어를 얻었습니다.
Vercel AI SDK, Supabase,
Tailwind 같은 각 서비스 제공업체가
최신 문서, 모범 사례,
디자인 지식으로 무장한
에이전트 하나씩을 가지고
이 에이전트가 내 기존 코드베이스를 살펴보고
구현 계획을 파악할 수 있다면 어떨까요?
이것이 바로 제가 시도한 것입니다.
shadcn부터 시작해서
각 서비스를 위한 다양한 전문가 서브 에이전트를
만들기 시작했습니다. shadcn의 경우
관련 컴포넌트를 검색할 수 있는
특별한 MCP 도구에 접근할 수 있고
정말 좋은 프론트엔드 작업이나
Vercel AI를 위한 동일한 디자인을 수행합니다
최신 버전인 SDK v5 문서가 로드된 SDK 전문가나
몇 주 전에 출시된 새 버전이기 때문에
또는 최신 Stripe 문서가 로드된
Stripe 전문가와 더불어
Context 7과 같은 도구들을 사용해서
사용량 기반 가격 책정과 같은 복잡한 설정을
매우 쉽게 할 수 있습니다.
한편, 서로 다른 에이전트 간의
컨텍스트 공유에 대한 최적화도
진행했습니다. 이는
매그너스 팀의 블로그에서
컨텍스트 엔지니어링에 대해 배운 것으로
매그너스가 장기 실행 작업을
어떻게 수행하게 만드는지에 대한
모든 노하우와 팁을 다루고 있습니다.
거기에 많은 좋은 내용들이 있지만
가장 영감을 준 부분은
파일 시스템을 궁극적인 컨텍스트
관리 시스템으로 활용하는 방법이었습니다.
모든 도구 결과를 대화 히스토리에
직접 저장하는 대신
결과를 나중에 검색할 수 있는
로컬 파일에 저장합니다.
그들의 경우, 에이전트가 웹 스크래핑 도구를
실행할 때 전체 콘텐츠 스크립트를
대화 히스토리에 직접 포함시키는 대신
1만 토큰 이상이 될 수도 있는
스크립트 콘텐츠를 로컬 MD 파일에 저장해서
나중에 대화의 어느 시점에서든
검색할 수 있도록 합니다.
그리고 이것이 바로 제가 여기서
설계한 것과 똑같습니다. 문서 클라우드
폴더 안에는 팀이 구현하고자 하는
각 기능의 컨텍스트가 포함된
작업 폴더가 있을 것입니다.
한편, 각 서브 에이전트는
특정 연구 보고서와
구현 계획에 대한 MD 파일을
생성하기 시작할 수 있어서
상위 에이전트가 항상
실행하려는 특정 프로젝트에 대한
모든 정보가 포함된 컨텍스트 파일을
만들 것입니다. 그리고 모든
서브 에이전트는 작업을 시작하기 전에
먼저 이 컨텍스트 파일을 읽어서
전체 프로젝트 계획과 현재 상황을
이해합니다. 그리고
작업을 완료한 후에는
어떤 핵심 단계들을 수행했는지
표시하고 연구 보고서를
문서의 MD 파일로 저장하기 위해
컨텍스트 파일을 업데이트합니다.
그래서 상위 에이전트나 다른 모든 에이전트가
나중에 이 대화를 읽고
더 많은 컨텍스트를 얻을 수 있습니다.
그리고 이 설정은
제 클라우드 코드의 성공률과
결과를 극적으로 향상시켰습니다.
그리고 이것이 오늘 여러분께
빠르게 보여드리고 싶은 내용입니다.
그래서 어떤 타입의 서브 에이전트를
만들 수 있는지에 대한 아이디어를
얻으실 수 있기를 바랍니다.
하지만 본격적으로 들어가기 전에
여러분 중 많은 분들이 처음 창업하시는
분들이라는 것을 알고 있습니다.
제품을 만드는 것은 퍼즐의 한 부분일 뿐입니다.
사용자를 확보하는 방법, 가격을 책정하는 방법,
그리고 고객에게 가치를 증명하는 방법도
배워야 합니다. 그래서
돈을 버는 AI 에이전트라는
무료 자료를 소개하고 싶습니다.
이는 가장 빠르게 성장하는
AI 스타트업 중 하나인
M Studio의 창립자이자 CEO인 디미트리 샤피어가 만든 것으로, 그는 실제 문제를 찾는 것부터 가격 책정과 거래 성사까지 모든 실용적인 과정을 포함한 자신의 전체 여정과 경험을 공유했습니다.
그리고 필수 워크플로우, 도구, 그리고
프로세스들을 다루고 있어요. 심지어
고객들에게 데모를 어떻게 하는지에 대한
구체적인 스크립트와 AI 제품을
구축하고 런칭하는 사람들의 많은 실제 사례들이
포함되어 있는데, 연간 반복 수익이
6자리에서 7자리까지 달성한
케이스들이죠. 그리고 제가 가장 좋아하는 부분은
AI 제품과 서비스의 가격 책정을
어떻게 생각할지에 대한 부분이에요. 기업과 중소기업을
대상으로 하는 다양한 프레임워크와
고객 관점에서 가치를
어떻게 추정할지에 대해 다룹니다. 1시간 이상의
실용적인 가이드와 무료로
사용할 수 있는 가이드들도 포함되어 있어요.
아래 설명란의 링크를 클릭하시면
이 자료를 받을 수 있고, 이런 훌륭한 자료를
제공해준 HubSpot에 감사드립니다. 이제
Claude 코드 서브 에이전트를
구축하기 시작해봅시다. 이런 서브 에이전트를 구축할 때
제가 가지고 있는 일반적인 규칙은
중요한 문서들을 시스템 프롬프트에
직접 포함시켜서 최신 관행을
따를 것이라는 확신을 가질 수 있도록 하고
동시에 중요한 컨텍스트를
검색할 수 있는 랜덤 도구들도 제공합니다.
이 Shadcn 전문가 예시에서, 앞서 언급한 대로
특정 패키지에서 정보 검색을 위해
특별히 설계된 MCP 도구가 있습니다.
하나는 이
Shadcn 컴포넌트 MCP입니다. 이 도구는
컴포넌트, 각 컴포넌트의 예시 코드,
그리고 관련 블록들을 검색할 수 있게 해줍니다.
따라서 전체 컨텍스트를 가질 수 있고
Shadcn을 위한 디자인을 검색하는
또 다른 MCP도 있습니다. 이 MCP는
UI 디자인에 특화된 웹사이트인
Twinx에서 가져온 것이고
이 MCP는 참고용으로 사용할 수 있는
잘 디자인된 UI를
검색해줍니다. 보통 저는
터미널을 열어서
code ~/.claude.json을 실행합니다.
이렇게 하면 글로벌 설정이 열리고
여기에 MCP 서버라는 키가 있는데, 이곳에
Shadcn 컴포넌트와 Shadcn UI 도구를
전달합니다. 그러면 서브 에이전트가
액세스할 수 있게 되고, 어떤 도구에
에이전트가 액세스할지 선택할 수 있습니다.
모델과 컬러를 설정하면 새로운
에이전트가 생성된 것을 볼 수 있어요.
원한다면 에이전트를 추가할 수 있지만
제가 보통 하는 방법은 터미널을 열어서
code ~/.claude를 실행하는 것입니다. 이렇게 하면
모든 프로젝트에 적용되는 Claude 코드의
개인 설정이 열립니다.
그러면 새 에이전트를 생성할 수 있고
프로젝트 특정 에이전트나
모든 프로젝트에서 사용될
개인 레벨 에이전트를 생성할 수 있습니다.
이 예시에서는 개인 레벨을 사용하겠고
Claude를 생성할 수 있어요. 그러면
간단한 설명을 바탕으로 제목, 설명,
그리고 이 서브 에이전트를 위한
시스템 프롬프트를 생성하려고 시도합니다.
여기서 제가 제공한 설명은
세련된 프론트엔드 UI를 설계하는 데 도움을 줄 수 있는
Shadcn 프론트엔드 전문가라는 것입니다.
앞서 언급한 대로 관련 Shadcn MCP가 있어요.
여기에 제가 사용한 특별한 MCP 도구들이 있습니다.
여기에서 생성된 예시를 볼 수 있어요.
보통 이 시점에서 제가 하는 일은
문서를 시스템 프롬프트에 붙여넣거나
특별한 MCP 도구와 이 도구를 사용하는 방법에 대한
규칙들을 첨부하는 것입니다.
MCP 도구에 대한 것입니다. 최종 버전에서는
모든 과정에 대한 규칙들을 포함하도록 설계했습니다.
따라야 할 프로세스에 대한 규칙들 말이죠.
전체적인 계획은 다음과 같습니다.
모든 컴포넌트를 나열하고, 적절한
컴포넌트를 선택하고, 사용법을 알기 위해
예제 코드를 가져오는 것입니다. 그리고
다양한 UI 패턴들을
어떻게 조합하는지에 대한 참고 자료도
블록을 사용해서 관련 시임들을 가져오고
어디에 어떤 컴포넌트 파일을
놓을지에 대한 규칙들도 포함됩니다.
보통 제가 하는 것은 각 서브 에이전트마다
목표를 먼저 추가하는 것입니다.
목표는 상세한 구현 계획을 설계하고
제안하는 것이며, 실제 구현은
절대 하지 않는 것입니다.
작업을 완료하면 디자인 파일을
doc/cloud/doc 파일에 저장하고
마지막에 이 출력 형식을
포함해서 최종 메시지가
다음과 같이 보이도록 지시합니다.
'이 파일에 계획을 생성했으니
진행하기 전에 먼저 읽어보세요.'
이 메시지는 클라우드 코드
부모 에이전트에게 다시 전송되어
모든 사람이 이 파일을 확인해야
한다는 것을 알 수 있습니다.
그리고 실제 구현을 하지 말라는
다양한 규칙들의 목록과 함께
작업하기 전에 컨텍스트 파일을
먼저 확인하여 전체 컨텍스트를
파악하라고 지시합니다.
작업 완료 후에는 이 컨텍스트 파일을 업데이트해야 합니다.
그리고 이것도 제가 관찰한 이상한 행동 중 하나인데
때때로 서브 에이전트가 클라우드 MCP 클라이언트를
실행해서 자기 자신을 호출하려고 합니다.
의심스러운 것은 서브 에이전트가 실제로
우리가 가진 cloud.md 파일을 상속받기 때문입니다.
그래서 혼란을 방지하기 위해 여기에
이 규칙을 추가했습니다.
이 출력 형식과 규칙들, 그리고 목표들은
제가 만든 모든 서브 에이전트에서 거의 동일합니다.
예를 들어, 이 Vercel AI SDK 전문가의 경우에도
출력 형식과 규칙에 대해서는
동일한 구조를 가지고 있습니다.
여기서 유일한 차이점은
최신 Vercel AI SDK 문서에 대한
더 자세한 문서를 추가한다는 것입니다.
이것은 제가 그들의 웹사이트에서
직접 가져온 것입니다. 복사해서
Vercel AI SDK v5에 대한 기본적이고
중요한 페이지들을 시스템 프롬프트에
넣었고, 마이그레이션 가이드도 추가해서
4.0과 5.0의 차이점을 명확히
구분할 수 있도록 했습니다. 이것도 그들 문서에서 가져온 것입니다.
이것이 사용하려는 각 서비스에 대해
전문화된 서브 에이전트를 설정하는
방법의 예시입니다.
이제 시도해보겠습니다.
먼저 Next.js 프로젝트를
shadcn과 함께 설정하고, cd my-app과
claw를 실행합니다. 이렇게 하면
초기 프로젝트가 설정됩니다. 코드베이스를
초기화하고 기본 클라우드 코드 규칙을
생성하기 위해 init을 실행합니다.
그리고 이제 이 cloud.md 파일을
생성하겠습니다. 하지만 cloud.md에서
더 잘 작동하도록 하기 위해
서브 에이전트에 대한 특별한 규칙들을
추가하고 싶습니다. 첫째로, 부모 에이전트가
항상 프로젝트 계획을 doc/task/
컨택트 세션에 유지하길 원합니다.
이 파일을 선택의 소스로 사용하여 유지할 수 있도록
컨텍스트를 유지하고, 작업이 완료된 후에는
반드시 이 MD 파일을 업데이트해야 합니다. 그리고
서브 에이전트에 대한 몇 가지 규칙도 제공하려고 합니다.
이제 서브 에이전트가 두 개 있어서 위임이 가능하고
서브 에이전트에게 작업을 전달할 때
반드시 이 MD 파일명을 함께 전달해야 합니다.
그리고 각 서브 에이전트가 작업을 완료한 후에는
작업을 실행하기 전에 자신이 생성한
문서를 먼저 읽어야 합니다. 이렇게 설정하면
한 번 시도해볼 수 있습니다.
이제 프롬프트를 주겠습니다. ShadCN을 프론트엔드로 하고
Vercel AI SDK를 AI 서비스로 사용해서
ChatGPT 복제본을 만들어 달라고 했습니다.
먼저 UI를 구축하되 서브 에이전트와 상의하여
진행하고, 먼저 컨텍스트 세션 MD 파일을 생성하여
현재 실행 중인 프로젝트에 대한
컨텍스트를 문서화합니다. 그런 다음
ShadCN 에이전트를 트리거합니다.
Ctrl+R로 세부 내용을 열어보면
이 ShadCN 전문가 에이전트에게 매우 구체적인 작업을
제공하는 것을 볼 수 있습니다.
읽어야 할 컨텍스트 파일과
구체적인 작업들을 포함해서 말입니다.
이 서브 에이전트가 가장 먼저 하는 일은
이 컨텍스트 파일을 읽으려고 시도하는 것입니다.
그런 다음 ShadCN 컴포넌트라는
MCP 도구를 실행하기 시작합니다.
이것이 우리가 연결한 특별한 MCP 도구입니다.
다시 에이전트로 돌아가면
관련 도구들을 지속적으로 사용해서
올바른 컴포넌트로 UI를 설계하는 데
도움이 될 수 있는 정보를 검색합니다.
그리고 각 컴포넌트에 대해
사용 방법의 예제 코드도 얻을 수 있습니다.
결국 이 ShadCN 에이전트는 작업을 완료하고
이 UI 설계, 전체 레이아웃, 그리고
사용할 계획된 컴포넌트들에 대한
문서 파일을 매우 자세한 구조로 생성합니다.
이를 바탕으로 부모 에이전트가 이 계획을 읽고
실제 구현을 세분화하기 시작합니다.
잠시 후 한 번에 전체를 완료하고
또한 이 컨텍스트 세션 파일을 업데이트해서
어떤 작업들이 완료되었는지와
전체 아키텍처가 무엇인지를 표시하고
이 애플리케이션을 실행할 수 있습니다.
그런데 Claude Code가 방금 백그라운드 세션을 도입했는데
계속 실행되면서 결과를 모니터링할 수 있어서
정말 유용합니다.
이 UI를 열어보면
모든 세부 상호작용이 고려된
매우 높은 충실도를 보여주며
ChatGPT의 첫 번째 버전과 거의 동일하게 보이고
몇 가지 오류가 있는데
이를 붙여넣고 수정을 시작할 수 있습니다.
이것이 새로운 서브 에이전트 구조가 훌륭한 이유입니다.
모든 실행은 이 부모 에이전트에 의해 수행되므로
완전한 컨텍스트를 가질 수 있습니다.
문제를 해결하는 최선의 방법이 무엇일까요? 좋습니다.
이제 오류가 없고 메시지를 입력하면
좋은 상호작용과 애니메이션도
처리되었습니다. 다음으로
Vercel SDK에 연결하도록 요청할 수 있습니다.
그래서 Vercel SDK 통합을 진행하고
반드시 서브 에이전트와 상의하라고 요청했습니다.
이렇게 하면 Vercel AI SDK 구현 계획자가
트리거됩니다.
이 에이전트 내부에서 다시 먼저 이 컨텍스트 파일을 읽으려고 시도합니다.
그런 다음 전체 코드베이스를 살펴보며
이를 구현하는 최선의 방법이 무엇인지 확인하고
완료 후 Vercel AI SDK에 대한
구현 계획에 대한 문서를 생성하고
또한 이 컨텍스트 세션 MD 파일을 업데이트해서
완료된 작업을 문서화합니다.
그러면 이 부모 에이전트가 전체 구현 계획을 읽고
구체적인 구현 단계를 수립합니다.
완료 후 다시 주목할 점은 완료되었고
이 컨텍스트 파일을 지속적으로 업데이트한다는 것입니다.
이제 이 애플리케이션이 실행됩니다.
그냥 'Hi I'm Jason'이라고 입력하면
이 에이전트가 실제로 대형 언어 모델에 연결되어
한 번에 결과를 반환해주는데
정말 놀라운 부분입니다.
여기서는 서브 에이전트 사용에 대한
모범 사례로 제가 배운 간단한 예시입니다.
더 자세히 알고 싶다면 AI Builder Club에서
방금 보여드린 서브 에이전트들을 생성하는
모든 프롬프트 과정을 붙여넣겠습니다.
또한 우리가 관리하고 있는 Cloud Code 템플릿이 있는데
실제로 테스트했고 프로덕션 환경에서
정말 유용한 훅, 명령어, 에이전트 목록이
포함되어 있습니다.
관심이 있으시다면
아래 링크를 클릭해서 AI Builder Club에 가입하세요.
매주 세션을 통해 매주 배운
모범 사례를 논의하는 시간도 있습니다.
이 비디오를 즐겁게 보셨기를 바랍니다.
감사하고 다음에 뵙겠습니다.