## 문제 상황 (Before)
GPTers 20기 스터디 첫 날이었다.
"Claude Code로 자동화를 배운다"는데, 솔직히 뭘 하는 건지 감이 안 왔다. Sub-Agent? Skill? Vibe Coding? 용어도 낯설고, 코드도 모르는데 따라갈 수 있을지 걱정됐다.
## 사용한 도구
- 도구: Claude Code (VSCode Extension)
- 모델: Claude Opus 4.5
## AI와 협업한 과정
### Step 1: Vibe Coding - 이미지 하나로 웹페이지 만들기
1주차 실습 첫 번째는 "Vibe Coding"이었다.
GPTers LMS 화면 이미지를 보여주고 이렇게 말했다:
```
이 이미지 보고 페이지 만들어줘
```
그랬더니 진짜로 200줄 넘는 HTML/CSS/JS 코드가 나왔다. 브라우저에서 열어보니까 진짜 웹페이지가 있었다.
솔직히 코드가 어떻게 작동하는지는 모르겠다. 근데 결과물이 나왔다. 이게 Vibe Coding인가 보다.
### Step 2: Sub-Agent 만들기
두 번째는 Sub-Agent를 만드는 것이었다.
Sub-Agent는 특정 작업만 전문으로 하는 "미니 Claude"라고 한다. /subagent-creator라는 명령어로 두 개를 만들었다:
- ax-prompt-finder: 프롬프트 패턴 찾는 에이전트
- ax-case-finder: 비슷한 사례 찾는 에이전트
아직 정확히 뭔지는 모르겠지만, .claude/agents/ 폴더에 파일이 생긴 건 확인했다.
### Step 3: AX 사례 분석
세 번째는 다른 사람들의 AX 사례를 분석하는 것이었다.
7개의 사례를 읽었는데, 다들 처음엔 막막했다가 Claude랑 대화하면서 해결한 이야기들이었다. "나도 할 수 있겠다"는 생각이 들었다.
분석 결과로 두 개의 문서가 만들어졌다:
- 효과적인 프롬프트 패턴 5가지
- 공통 문제 상황과 해결법
## 결과 (After)
### Before vs After
| 항목 | Before | After |
|------|--------|-------|
| Claude Code 이해도 | 뭔지 모름 | 일단 따라하면 결과물 나옴 |
| 웹페이지 만들기 | 불가능 | 이미지 보여주면 됨 |
| Sub-Agent | 처음 들어봄 | 만들어봄 (아직 헷갈림) |
### 결과물
- gpters-w1-practice/vibe-lms.html - LMS 스타일 웹페이지
- .claude/agents/ax-prompt-finder.md - 프롬프트 패턴 에이전트
- .claude/agents/ax-case-finder.md - 사례 찾기 에이전트
- gpters-w1-practice/agent-review/ - AX 사례 분석 문서 2개
## 배운 점
### 효과적이었던 것
- 일단 따라하기: 이해 안 돼도 따라하면 결과물이 나온다
- "만들어줘" 한 마디: 코드 몰라도 된다
### 아직 헷갈리는 것
- Sub-Agent, Skill 개념이 정확히 뭔지
- 이걸 실제 내 업무에 어떻게 적용하는지
## 앞으로의 계획
2주차, 3주차 실습 계속 따라하면서 자동화 사례 3개 만들어보고 싶다.
## 재사용 가능한 프롬프트
### Vibe Coding 시작할 때
```
[이미지/참고자료] 보고 [결과물] 만들어줘
```
### Sub-Agent 만들 때
```
/subagent-creator
```
---
GPTers 20기 Claude Code 스터디 1주차 실습 후기