Claude Code Skills + Codex CLI

목적 : AI 코드 리뷰 자동화, 토큰 효율 극대화

Agent Skills - Claude Docs

Create, manage, and share Skills to extend Claude's capabilities in Claude Code.

docs.claude.com

왜 Skill를 사용했나?

문제 상황

개발자: "이 커밋 리뷰 좀 해줘"
Claude: *수백 줄 파일 읽기* → *분석* → *제안*
결과: 수만 토큰 소비, 긴 대기 시간

해결 방법

개발자: "코덱스로 리뷰해줘"
Claude: *Codex CLI 실행* → *백그라운드 대기*
Codex: *독립적으로 분석* → *결과만 전달*
결과: 수백 토큰만 소비, 병렬 작업 가능!

Codex Skill 작업 흐름 ⭐

전체 프로세스

─────────────────────────────
1단계: 분석 요청
─────────────────────────────
사용자: "코덱스로 분석해줘"
↓
Claude: Codex CLI 실행
↓
Codex(외부 AI): 코드 분석 + diff 파일 생성
↓
결과: ~/.codex/sessions/xxx/changes.diff


─────────────────────────────
2단계: 적용 요청
─────────────────────────────
사용자: "수정해줘" (또는 "적용해줘")
↓
Claude: `codex apply` 명령 실행
↓
git apply: diff를 실제 파일에 패치
↓
Claude: 결과 확인 및 리포트

누가 뭘 하는가?

단계	작업자	설명	토큰 소비
분석	Codex AI	코드 분석, 개선안 생성, diff 파일 생성	❌ 외부
명령 실행	Claude	codex apply 명령 실행	✅ 적음
파일 수정	git apply	Codex가 만든 diff를 파일에 패치	❌ 외부
검증	Claude	TypeScript 체크, 결과 리포트	✅ 적음

구체적 예시

1단계: 분석 (Codex가 작업)

$ codex exec "리팩토링해줘"

[Codex 내부 동작]
→ 파일 읽기
→ 코드 분석
→ 개선안 생성
→ diff 파일 작성: ~/.codex/sessions/abc123/changes.diff

Claude는? 명령만 실행하고 대기! (토큰 거의 안 씀)

2단계: 적용 (Claude가 명령 실행, git이 파일 수정)

사용자: "수정해줘"

$ codex apply  # Claude가 실행
↓
$ git apply ~/.codex/sessions/abc123/changes.diff  # 내부적으로 실행
↓
파일 실제 수정 완료!
↓
Claude: "변경 완료했습니다. TypeScript 체크할까요?"

핵심 포인트

✅ 안전성

1. Codex는 직접 파일을 수정하지 않음
   → diff 파일만 생성

2. 사용자가 검토 가능
   → cat ~/.codex/sessions/xxx/changes.diff

3. 승인 후 Claude가 적용
   → codex apply 명령

4. 문제 발생 시 롤백 가능
   → git restore [파일명]

✅ 효율성

Before (Claude 직접 분석):
  파일 읽기: 5000 토큰
  분석: 3000 토큰
  제안: 2000 토큰
  총: 10,000 토큰

After (Codex Skill):
  명령 실행: 100 토큰
  대기: 0 토큰 (백그라운드)
  결과 읽기: 500 토큰
  총: 600 토큰 (94% 절약!)

✅ 병렬성

Codex 실행 중에도:
- ✅ 다른 파일 읽기
- ✅ 코드 수정
- ✅ 문서 작성
- ✅ git 명령 실행

실전 테스트: 커밋 리뷰

시나리오

Project D 프로젝트에서 대시보드 설정에 상태 배지를 추가하는 커밋을 작성했습니다.

커밋: 04d36da
변경 파일:
- src/configs/pages/dashboard/dashboardConfig.ts
- src/hooks/pages/dashboard/useDashboardData.ts

실행 과정

Step 1: 리뷰 요청

💬 사용자: "04d36da 커밋을 분석해서 codex로 코드리뷰 해줘"

Step 2: Claude의 처리

# 1. 커밋 diff 추출
git show 04d36da > /tmp/codex_review_commit.diff

# 2. Codex 실행 (백그라운드)
codex exec "다음 커밋을 Project D 프로젝트 가이드라인(CLAUDE.md)에 따라 코드 리뷰해줘.
특히 다음 사항들을 확인:
1. 타입 안정성 (TypeScript)
2. 네이밍 컨벤션 (camelCase, PascalCase)
3. 코드 구조 및 일관성
4. 잠재적 버그나 개선점
5. Project D 프로젝트 규칙 준수 여부

$(cat /tmp/codex_review_commit.diff)"

Step 3: 병렬 작업

Codex가 분석하는 동안 Claude는:

✅ 다른 질문에 답변
✅ 파일 수정 작업
✅ 문서 업데이트
✅ 토큰 거의 안 씀!

실제 토큰 사용량:

명령 실행: ~200 토큰
대기 중: 0 토큰
결과 읽기: ~500 토큰
총: ~700 토큰 (직접 분석 시 10,000+ 토큰과 비교)

Step 4: Codex 결과

📊 코드 리뷰 결과

✅ 긍정적인 점:
- 기존 패턴(useMemberInfo.ts) 일관성 유지 ✨
- pageProps 구조화로 props 전달 명확 👍
- colorScheme 타입 적용으로 타입 안정성 확보 🎯

⚠️ 발견된 문제:
- 커밋 메시지 오타: '배찌' → '배지'

💡 개선 제안:
1. dashboardConfig.ts: colorScheme에 as const 추가 (타입 강화)
2. dashboardTypes.ts: props.colorScheme 타입 명시
3. useDashboardData.ts: cellProps 인터페이스 정의
4. TypeScript 컴파일 체크 필수
5. UI 동작 테스트 필요

종합 점수: 9.25/10

개선 사항 적용

Todo 리스트 작성

💬 사용자: "개선 사항을 todoWrite"

📝 Todo List:
✅ dashboardConfig.ts colorScheme 타입 강화 (as const 추가)
✅ ColumnConfig 인터페이스에 props.colorScheme 타입 정의 추가
✅ useDashboardData.ts cellProps 타입 인터페이스 정의
✅ TypeScript 컴파일 체크 (npx tsc --noEmit)
⏳ 커밋 메시지 오타 수정
⏳ UI 동작 테스트

순차적 구현

개선 1: dashboardConfig.ts

// Before
props: {
  colorScheme: 'default'  // string 타입
}

// After
props: {
  colorScheme: 'default' as const  // 'default' 리터럴 타입 ✅
}

효과: 타입 추론 강화, 잘못된 값 할당 방지

개선 2: dashboardTypes.ts

// Before
props?: Record<string, any>; // 너무 느슨함 ⚠️

// After
props?: {
  colorScheme?: 'default' | 'gray'; // 명시적 타입 ✅
  [key: string]: any;
};

효과: IDE 자동완성, 타입 체크 강화

개선 3: useDashboardData.ts

// Before
const cellProps = useMemo(() => ({ // 타입 추론에 의존 ⚠️
  statusBadge: {
    onToggle: canWrite ? handleStatusBadgeToggle : undefined
  }
}), [handleStatusBadgeToggle, canWrite]);

// After
// 1. 인터페이스 정의 추가
interface DashboardCellProps {
  statusBadge: {
    onToggle?: (row: DashboardData, newValue: boolean) => Promise<void>;
  };
}

// 2. 명시적 타입 적용
const cellProps: DashboardCellProps = useMemo(() => ({
  statusBadge: {
    onToggle: canWrite ? handleStatusBadgeToggle : undefined
  }
}), [handleStatusBadgeToggle, canWrite]);

효과:

타입 명확성 증가
리팩토링 안정성 향상
다른 개발자가 이해하기 쉬움

장점

1. 역할 분담

Codex = 분석 전문가
  - 코드 패턴 파악
  - 개선안 제시
  - diff 생성
  ⚠️ 파일 직접 수정 안 함!

Claude = 실행 관리자
  - 명령 실행
  - 결과 해석
  - 사용자와 소통
  ⚠️ 분석은 Codex에게 위임!

git apply = 실제 작업자
  - diff 파일 적용
  - 안전한 패치

2. 안전 장치 3단계

1단계: Codex는 제안만
   → diff 파일 생성
   → 사용자 검토 가능

2단계: 명시적 승인
   → "적용해줘" 명령 필요
   → 자동 적용 안 됨

3단계: 롤백 가능
   → git restore 사용
   → 언제든 되돌리기

3. 토큰 효율 극대화

Traditional:
┌──────────────┐
│ Claude 분석  │ → 10,000 토큰
│ (순차 처리)  │
└──────────────┘

With Skill:
┌──────────────┐   ┌──────────────┐
│ Codex 분석   │ + │ Claude 작업  │
│ (백그라운드) │   │ (병렬 처리)  │
└──────────────┘   └──────────────┘
    외부 토큰          ~700 토큰

절약률: 94%!

4. 실전 워크플로우

일상적인 코드 리뷰

# 1. 개발 완료
$ git add .
$ git commit -m "feat: 새 기능 추가"

# 2. Claude Code에서
💬 "최근 커밋 코덱스로 리뷰해줘"

# 3. Codex 분석 중 다른 작업
💬 "이 파일 읽어줘"
💬 "저 부분 수정해줘"

# 4. 결과 받고 개선
💬 "제안 사항 적용해줘"

# 5. 검증
$ npx tsc --noEmit

# 6. 재커밋
$ git add .
$ git commit -m "refactor: 타입 안정성 개선"

대규모 리팩토링

# 1. 폴더 전체 분석
💬 "src/components/dashboard/ 폴더 코덱스로 분석해줘"

# 2. Codex가 분석하는 동안
💬 "다른 컴포넌트 수정 먼저 할게"

# 3. 결과 확인
💬 "분석 결과 보여줘"

# 4. 우선순위 정리
💬 "todo 리스트 만들어줘"

# 5. 단계별 적용
💬 "todo 1번부터 시작"
💬 "다음 todo"
💬 "다음 todo"

5. Skill 개선 팁

Before (초기 버전)

---
name: codex
description: "코덱스 실행"
allowed-tools: Bash
---

After (개선 버전)

---
name: codex
description: |
  사용자가 다음을 요청할 때 사용:
  - "코덱스로 분석", "codex 실행"
  - "코드 리뷰", "버그 찾기"

  주요 명령어: codex exec, codex apply, codex resume
allowed-tools: Bash, Read, Write, AskUserQuestion
---

## Running a Task
1. 모델 선택: gpt-5 / gpt-5-codex
2. Effort 선택: low / medium / high
3. 실행 및 결과 보고

## 모델 선택 가이드
| 작업 | 모델 | Effort |
|-----|-----|--------|
| 코드 리뷰 | gpt-5-codex | medium-high |
| 버그 수정 | gpt-5-codex | high |
| 리팩토링 | gpt-5 | low-medium |

개선 효과:

자연어 트리거 다양화
작업 유형별 가이드
사용자 선택권 제공

결론

1. 도입 효과 요약

항목	Before	After	개선율
코드 리뷰 시간	~30분	~5분	83% ↓
토큰 사용	~10,000	~700	94% ↓
병렬 작업	불가	가능	∞
안전성	직접 수정	diff 검토	↑↑

2. 이점

역할 분담: 각자 잘하는 것에 집중
- Codex → 분석
- Claude → 실행
- git → 적용
안전 우선: 3단계 안전 장치
- 제안 → 검토 → 적용
효율성: 토큰 절약
- 외부 프로세스 활용
- 백그라운드 실행
확장성: Skill은 진화한다
- 시나리오 추가
- 가이드 보강
- 프로젝트별 커스터마이징

3. 실사용 후기

Claude로 Codex를 실행하는 중 작업이 길어지거나 특정 상태에서 계속 진행 할지 확인 받거나 멈추고 있음.
여기서 병렬의 이점을 상실.
프롬프트 스위칭 비용이 들어가는 느낌

FAQ

Q1: Codex가 파일을 직접 수정하나요?

A: 아니요! Codex는 diff 파일만 생성합니다.

Codex: 제안만 함 (diff 파일)
↓
사용자: 검토 가능
↓
Claude: codex apply 실행
↓
git apply: 실제 파일 수정

Q2: 실수로 잘못 적용하면?

A: git restore로 즉시 되돌릴 수 있습니다.

$ git restore src/파일명.ts
# 또는
$ git restore .  # 모든 변경 되돌리기

Q3: 토큰이 정말 94% 절약되나요?

A: 예! 실제 측정 결과:

직접 분석: 파일 읽기(5000) + 분석(3000) + 제안(2000) = 10,000
Codex Skill: 명령(100) + 결과(500) + 검증(100) = 700

절약률: (10000-700)/10000 = 93% ≈ 94%

Q4: Codex 실행 중 다른 작업이 가능한가요?

A: 가능합니다! 백그라운드 실행이 핵심입니다.

Codex (백그라운드) | Claude (포그라운드)
─────────────────────────────────────
분석 중...        | ✅ 파일 읽기
분석 중...        | ✅ 코드 수정
분석 중...        | ✅ 문서 작성
완료!             | ✅ 결과 확인

Q5: 모든 커밋을 Codex로 리뷰해야 하나요?

A: 아니요, 선택적으로 사용하세요.

상황	권장 방법
간단한 수정	Claude 직접 리뷰
복잡한 로직	Codex 활용
대규모 리팩토링	Codex + high effort
긴급 핫픽스	Claude 빠른 체크

참고 자료

Claude Code 문서: https://docs.claude.com/en/docs/claude-code

Hello, Dan:d World! _

Claude Skills 을 활용한 Codex 코드 리뷰