Skip to content

Latest commit

 

History

History

Folders and files

NameName
Last commit message
Last commit date

parent directory

..
 
 
 
 

README.md

Lab 04: 바이브 코딩 — 처음부터 앱 만들기

캡스톤 실습 | 60분 | 팀 과제 (2~3인)

코드를 한 줄도 직접 작성하지 않고, 프롬프트만으로 동작하는 앱을 완성한다. 오늘 배운 에이전틱 코딩의 모든 기법을 총동원하라.


타임라인

시간 활동
0:00 ~ 0:10 I DO — 실제 바이브 코딩 세션 분석 (10분)
0:10 ~ 0:15 팀 구성 + 시나리오 선택
0:15 ~ 0:55 바이브 코딩 (핵심 40분)
0:55 ~ 1:00 팀별 결과 공유

I DO — 실제 바이브 코딩 세션 (10분)

아래는 OpenCode에게 포모도로 타이머를 만들어달라고 한 실제 세션 기록이다. 에이전트가 빈 디렉토리에서 시작해 동작하는 앱을 완성하기까지의 과정을 단계별로 분석한다.

실행한 프롬프트 (단 1개)

Python CLI 포모도로 타이머를 만들어줘.
기능: start <minutes>, status, history.
JSON 파일에 기록 저장.
테스트도 작성해줘.
Python 표준 라이브러리만 사용.

세션 요약

항목
세션 ID ses_2fe1e7557ffe1Xle0PifzNgc0T
모델 openai/gpt-5.4
소요 시간 2분 35초
토큰 사용량 199,440
도구 호출 8회 (todowrite 4, glob 1, bash 2, apply_patch 1)
생성된 파일 2개 (pomodoro.py 200줄, test_pomodoro.py 146줄)
총 코드량 346줄
테스트 결과 6개 모두 통과

에이전트 행동 타임라인

[0:00] 사용자 → "Python CLI 포모도로 타이머를 만들어줘..."
    │
[0:01] 에이전트: 추론 시작 — 파일 구조, 테스트 전략 계획
    │  "pomodoro.py + test_pomodoro.py 구조로 가자"
    │  "POMODORO_STATE_FILE 환경변수로 테스트 주입 허용"
    │
[0:02] todowrite → TODO 리스트 생성
    │  [ ] 작업공간 탐색 및 프로젝트 구조 결정
    │  [ ] start/status/history 명령 구현
    │  [ ] JSON 기반 영속성 추가
    │  [ ] unittest 테스트 작성
    │
[0:02] glob * → "No files found" (빈 디렉토리 확인)
    │
[0:02] bash "python3 --version" → Python 3.14.2 확인
    │
[0:03] todowrite → "작업공간 탐색" 완료 처리
    │
[0:03] apply_patch → pomodoro.py + test_pomodoro.py 동시 생성
    │  (45.3초 소요 — 346줄 코드 생성)
    │
[2:28] todowrite → 구현 및 테스트 완료 처리
    │
[2:33] bash "python3 -m unittest -v"
    │  test_history_lists_completed_sessions ... ok
    │  test_start_creates_active_timer ... ok
    │  test_start_rejects_when_timer_is_running ... ok
    │  test_start_validates_minutes ... ok
    │  test_status_finalizes_completed_timer ... ok
    │  test_status_reports_remaining_time ... ok
    │  → 6개 테스트 전부 OK
    │
[2:35] todowrite → 전체 완료
[2:35] 완료 답변 출력

관찰 포인트

1. 에이전트가 먼저 계획을 세웠다

[ ] Inspect workspace and choose project structure
[ ] Implement CLI commands using only standard library
[ ] Add JSON-backed persistence for active timer and session history
[ ] Write unittest tests for all commands

코드를 바로 쓰지 않고, 먼저 TODO 리스트로 계획을 세운 뒤 순서대로 체크했다. Lab 00에서 본 "계획 → 실행 → 검증" 패턴이 여기서도 그대로 나타난다.

2. 빈 디렉토리를 먼저 확인했다

glob * 으로 기존 파일이 있는지 확인했다. 없으면 처음부터, 있으면 기존 코드를 파악하고 시작하는 패턴이다.

3. 테스트 가능하도록 설계했다

에이전트가 추론 단계에서 스스로 판단했다:

"POMODORO_STATE_FILE 환경변수 override도 지원합니다. 구현 위치는 pomodoro.py."

실제 파일 없이 테스트할 수 있도록, 저장 경로를 환경변수로 주입 가능하게 설계했다. 이것은 에이전트가 테스트 가능성을 스스로 고려한 결정이다.

4. 346줄을 apply_patch 1회로 생성했다

2개 파일, 346줄을 단 1번의 apply_patch 호출로 생성했다. 파일 단위로 나눠서 호출하지 않고 한 번에 묶어서 처리했다.

5. 마지막에 직접 테스트를 실행했다

생성 후 python3 -m unittest -v 를 직접 실행해서 6개 테스트가 모두 통과하는 것을 확인했다. "에이전트가 작성했으니 맞겠지"가 아니라, 실행으로 검증했다.

에이전트가 생성한 코드 구조

# pomodoro.py — 에이전트가 선택한 설계
class StateStore:          # JSON 파일 읽기/쓰기
class TimerState:          # active 타이머 + history 리스트

def command_start(...)     # start <minutes> — 타이머 시작
def command_status(...)    # status — 남은 시간 표시
def command_history(...)   # history — 완료 목록

def finalize_if_complete() # 만료된 타이머를 history로 이동 (백그라운드 프로세스 없이 동작)

토론 포인트: 에이전트는 finalize_if_complete() 라는 함수를 추가했다. 왜 이 함수가 필요했을까? 백그라운드 프로세스 없이 타이머를 "완료" 상태로 만들려면?


바이브 코딩 규칙

반드시 지켜야 할 것

  1. 코드를 직접 타이핑하지 않는다 — 모든 코드는 에이전트가 작성
  2. AGENTS.md는 직접 작성해도 된다 — 에이전트에게 주는 지시문이므로 예외
  3. 에러 메시지는 복사해서 에이전트에게 전달 — 직접 수정하지 않는다
  4. Claude Code(또는 동급 AI 코딩 에이전트)를 사용 — 일반 ChatGPT 제외

권장 사항

  • 팀원 한 명이 드라이버(타이핑), 나머지는 프롬프트 전략가로 역할 분담
  • 프롬프트를 보내기 전에 팀원과 먼저 합의
  • artifacts/prompt-strategy.md를 참고해 체계적으로 진행
  • 막히면 artifacts/example-pomodoro/prompts-used.md 참고

시나리오 선택

6개 시나리오 중 하나를 선택한다. 팀별로 중복 불가.

# 시나리오 난이도 파일
1 CLI 포모도로 타이머 ★☆☆ scenarios/scenario-01-pomodoro.md
2 터미널 습관 트래커 ★★☆ scenarios/scenario-02-habit-tracker.md
3 Markdown → HTML 변환기 ★★☆ scenarios/scenario-03-md-converter.md
4 팀 회고 보드 ★★★ scenarios/scenario-04-retro-board.md
5 코드 스니펫 매니저 ★★☆ scenarios/scenario-05-snippet-manager.md
6 자유 주제 자유 scenarios/scenario-06-free-topic.md

초보자 팀 추천: 시나리오 1 (포모도로) — 완성 예시 포함


시작하기

1단계: AGENTS.md 작성 (5분)

# 새 프로젝트 폴더 생성 후 AGENTS.md 작성
mkdir my-vibe-project
cd my-vibe-project
# AGENTS.md 직접 작성 (템플릿: artifacts/agents-md-template.md 참고)

2단계: Claude Code 열기

claude

3단계: 첫 번째 프롬프트

artifacts/prompt-strategy.md의 Step 1(프로젝트 구조)부터 시작한다.


발표 포맷 (팀당 3분)

  1. 시나리오 소개 — 어떤 앱을 만들었나
  2. AGENTS.md 설명 — 에이전트에게 어떤 규칙을 줬나
  3. 동작 시연 — 실제 앱 실행
  4. 핵심 프롬프트 공유 — 가장 효과적이었던 프롬프트 1~2개
  5. 배운 점 — 잘 된 것, 안 된 것

평가 기준

자세한 루브릭: artifacts/rubric.md

항목 배점
동작 여부 30점
코드 품질 20점
프롬프트 전략 20점
발표/시연 15점
도전 정신 15점

합계: 100점


참고 자료

  • artifacts/prompt-strategy.md — 바이브 코딩 전략 가이드
  • artifacts/agents-md-template.md — AGENTS.md 템플릿
  • artifacts/rubric.md — 평가 루브릭
  • artifacts/example-pomodoro/ — 완성 예시 (시나리오 1)