[Claude] 워크플로우 기초부터 실전까지(2)

JAMEe_·2026년 3월 16일

AI툴

목록 보기
2/2

여러가지 MCP 서버 설치하기

// context7
// 최신 라이브러리 참고할 수 있도록 도움
claude mcp add --scope user --transport http context7 https://mcp.context7.com/mcp

// Sequential thinking mcp server
// 복잡한 문제해결을 단계별로 분석하고 추론할 수 있도록 도움
"sequential-thinking": {
  "command": "npx",
  "args": [
    "-y",
    "@modelcontextprotocol/server-sequential-thinking"
  ]
}

// shadcn/ui mcp
// 문서나 예제를 빠르게 가져오는데 도움

AI 작업 관리 도구

랜딩페이지나 투두리스트앱은 AI 를 활용하여 간단히 만들 수 있는데, 쇼핑몰과 같은 복잡한앱은 어떻게 체계적으로 관리하고 개발을 할 수 있을까?
핵심은 복잡한 프로젝트를 작은 작업들로 나눠서 순차적으로 완료

TASKMASTER AI

사용자와 AI 가 협력해서 체계적으로 개발
분석할까요? 이 작업은 복잡하니 나눌까요? 최신 기술스택을 조사할까요? 처럼 협력해서 진행
Main Model: 메인으로 사용할 AI Model
Research Model: 최신 정보 검색이나 기술 동향 조사
Fallback Model: 메인 Model 실패 시 자동 전환되는 Model

// 실행 순서

// docs 폴더에 작성된 PRD 파싱
// 작업이 완료되면 tasks 폴더에 task 생성됨
task-master parse-prd

// 모든 task 목록 보기
// 여기서 복잡한 task 는 서브 task 들로 나눠주기
task-master list

// 현재 각 task 들에 대한 서브 task 들을 생성
task-master expand --all

// 서브 task 까지 보기
task-master list --with-subtasks

// Status 변경하여 취소하거나 스킵할거 수정작업

// 작업 시작
task-master next

Shrimp Task Manager

AI 가 개발자가 되어 주도적으로 개발
시니어 개발자 고용한 느낌
스스로 기술 스택 조사, 프로젝트 규칙 정하고, 작업 계획 세운 후에 구현까지

// 실행 순서

// shrimpt-task-manager 설치
git clone https://github.com/...
cd mcp-shrimp-task-manager
npm install
npm run build

// 프로젝트내에서 사용하기위한 mcp 세팅
args: 빌드로 생성된 파일을 사용하기위해 경로 뒷부분에는 /dist/index.js
DATA_DIR: 태스크 관리했던 다양한 데이터 저장

// 현재 프로젝트 구조 스캔
// 개발 표준과 규칙을 자동 설정
// 어떤 기술스택, 구조를 가져갈 지 초기화
init_project_rules

// 큰 요청을 단계별 실행 가능한 계획으로 나눠줌 
plan_task: [ROADMAP.md 에 생성된 task 제목]
@docs/ROADMAP.md

// 위 내용이 요청되면 태스크가 서브 태스크로 나눠질 수 있음

// 현재 생성된 task 들 확인
list_tasks

// 프로젝트 완성을 위해 하나씩 수행
execute_task

// 중간에 수정해야할 부분이 있다거나 추가할 부분이 있다면 
// plan task 로 생성하고 차례대로 다시 실행

// 어떠한 작업을 수행했고, 어떠한 작업이 남았는지 확인
list_tasks

// 연속 모드 사용하면 모든 작업 알아서 순차적 수행

// 모든 작업 완료한 후 클로드 init

개발 오류 줄이기

AI 에게 개발을 진행시킨 결과물의 오류 줄이는 방법

테스트 코드

비즈니스 로직이나 API 연동과 같은 코드를 구현한 다음에는
playwright mcp 를 활용해서 통합 테스트하는 프롬프트 추가

린트 및 타입 체크

스스로 검사 및 빌드

// CLAUDE.md

## 작업 관료 체크리스트
npm run check-all
npm run build

Claude Agent Skills

Claude 를 위한 업무 메뉴얼
ex)) 엑셀, PPT 가이드라인 제공하여 일관된 수준으로 높은 퀄리티의 결과물을 받을 수 있도록

기본적으로 Claude 에는 몇 가지 스킬이 내장되어있는데,
만약 요청으로 "PPT 제안서를 만들어줘" 라고 한다면, 자동으로 PPTX 스킬문서를 확인하여 전문가수준으로 만들어줌

스킬 폴더는 아래와 같이 구성되어 있음
지침서: 메뉴얼
참고자료: 추가 정보
스크립트: 실제 실행되는 코드 파일

이게 MCP, 서브 에이전트와 무슨 차이가 있을까?

★ MCP 와 서브 에이전트는 사용을 하든 안하든 Context 에 자리를 차지하고 있는 상태인데, 스킬은 차지하고 있는게 아닌 점진적으로 로드된다. 즉, 컨텍스트 공간을 효율적으로 사용

이게 가능한 이유는
1. 클로드가 처음 시작할 때 모든 skill.md 파일들을 훑어보면서 프론트매터 정보인 name, description 만 먼저 읽음
이렇다보니 적은 토큰으로도 많은 스킬 정보들을 파악할 수 있음
2. 실제로 해당 스킬을 사용해야할 때 로드됨 ( 이때 컨텍스트 메모리에 할당 )
3. 리소스 로드. skill.md 파일을 읽다가 참조 링크를 발견하면 필요한 순간에만 열어서 확인. 스크립트 코드의 경우 컨텍스트에 로드하지 않고 직접 실행 후 결과만 컨텍스트에 할당

★ 여러 스킬을 조합하여 함께 사용 가능
예를들어 워드문서에 데이터 차트를 넣어달라 요청하면
문서 스킬과 차트 생성 스킬을 조합하여 복잡한 작업을 완성

추가 2.1.0 :
context: 프론트매터에 context 를 fork 로 설정하면 서브 에이전트처럼 컨텍스트를 별도로 지님
agent: context 가 fork 로 설정되어있을 때 사용할 에이전트 유형. Explore, Plan, general-purpose ...
별도의 컨텍스트를 지닌 상태에서 설정하는거보면 서브 에이전트 느낌?
hooks: 해당 스킬 사용 트리거에 따라 특정 이벤트 실행 가능

대체해야할 작업
커스텀 커맨드 => skills
자주 사용하는 서브 에이전트 => skills
일회성 서브 에이전트 => sub agent
mcp => mcp tool search

플러그인

매번 프로젝트 생성할때마다 이전 프로젝트의 서브에이전트, mcp, 훅, 커스텀커맨드, 스킬... 등을 복붙으로 가져오면 번거로움
플러그인으로 패키징하여 불러올 수 있음
또한, 전세계 사람들이 이미 구현해둔 패키징들을 마켓플레이스에서 가져올 수 있음

MCP 를 필요할때만 불러와 컨텍스트에 할당하여 사용해 효율 측면에서 좋음
MCP 가 컨텍스트 윈도우의 10%를 넘으면 자동으로 활성화

// settings.local.json
"env": {
	// 10% 가 아닌 5% 로 설정
    // true 로 설정 시 항상 활성화
	"ENABLE_TOOL_SEARCH": "auto:5"
}

Agent Teams

기존 서브 에이전트는 독립된 공간에서 독자적으로 실행된 결과를 메인에 넘기는거였다면
Agent Teams 는 하나의 팀을 이루면서 서로 소통하면서 협업하는 방식
각 팀원들은 메인 세션처럼 CLAUDE.md, mcp, skills 이런거는 동일하게 로드됨
공식문서는 팀원 3~5명 권장

Agent Teams 를 사용해서 직장인 점심 도시락 배달 서비스 런칭 기획안을 만들어줘.

팀원 4명을 생성해줘.
- 팀원 1: 시장 조사 담당 (시장규모, 타겟 고객, 성장 추이)
- 팀원 2: 경쟁사 분석 담당 (직접/간접 경쟁사, 차별화 전략)
- 팀원 3: 예산안 담당 (초기 투자, 운영비, 손익분기점)
- 팀원 4: 일정표 담당 (5단계 로드맵, 마일스톤)

각 팀원이 작업을 마치면 결과를 하나의 기획안으로 종합해줘.

Agent Teams 활성화

// settings.local.json
"env": {
	"CLAUDE_CODE_EXPERIMENTAL_AGENT_TEAMS": "1"
}

효율적으로 Agent Teams 사용하기

비용은 절반이며, 품질은 2배

  1. 계획 승인 모드
    일반적으로 팀을 생성하면 바로 코딩을 시작하는데, 프롬프트에 다음 내용 추가 
    각 팀원이 변경하기 전에 plan approval 을 받도록 해줘
    위 프롬프트는 팀원이 읽기 전용 모드(plan mode)가 됨
    - 1. 팀 생성
    - 2. 계획 분석 (plan mode)
    - 3. 계획 제출 (리드에게 보고)
    - 4. 승인/거절 (리드가 판단)
    - 5. 구현 시작 (승인 후 실행)
    TeamCreate 로 에이전트 팀 생성해줘 // 서브 에이전트로 진행하는거 방지
에이전트 팀으로 프로젝트 코드를 병렬 리뷰하고 문제를 수정해줘
각 팀원이 변경하기 전에 plan approval 을 받도록 해줘

팀원 1 (보안): API 키 노출, XSS 취약점, 환경변수 안전성
팀원 2 (성능): 'use cache' 패턴, 리렌더링, 이미지 최적화
팀원 3 (아키텍처): 의존성 방향 (app->features->shared->ui), cn() import 경로
  2. 모델믹싱
    Agent Teams 의 토큰 사용량은 활성 팀의 수에 비례해서 증가
    즉, 적절한 모델을 각 팀원에 맞게 분배하는게 중요
    리드: 조율, 추론, 계획 검토, 작업 분해, 품질 판단 / Opus 추천
    팀원: 코드 생성, 파일 편집, 구현 작업 / Sonnet 추천
    현재 세션 모델이 opus 라면 리드는 자동으로 Opus
    팀원은 모두 Sonnet 사용해
  3. 여러 측면에서 생각
    • 팀원들끼리 소통이 필요한가? 서브 에이전트로도 충분하지 않은가
    • 작업이 끝난 팀원은 즉시 종료. 팀원 세션이 살아있으면 계속 토큰 소모
    • CLAUDE.md 에 완료 후 즉시 종료, 반복 3회 제한 등 규칙 생성

Hooks 이벤트 자동화

팀원 에이전트는 맡은 작업을 다 끝내거나 지시를 기다릴때 idle 상태가 됨
Claude 의 Hooks 로 이런 상태변환을 감지할 수 있음

  1. TeammateIdle
    팀원 단위로 발동되며, 팀원이 모든 일을 마치고 idle 상태에 들어가려할 때 발동되는 훅

    작업이 끝나면 요약 보고서를 작성해라

    조금전에 처리한 업무와 관련된 일을 시킬 수 있음

  2. TaskCompleted
    태스크 단위로 발동되며, 팀원이 해당 작업을 다 완료한 상태에 발동되는 훅

하나의 팀원이 3개의 Task 를 진행한다고 가정했을때 TaskCompleted 훅은 3번, TeammateIdle 훅은 1번 발동
그래서 TaskCompleted 훅은 해당 Task 에 대한 검증을 수행하는데 사용되고,
TeammateIdle 훅은 팀원 전체 작업을 검증하는데 사용

profile
JAMEe_
안녕하세요
이전 포스트

[Claude] 워크플로우 기초부터 실전까지(1)

0개의 댓글