"상품 검색 기능 추가해달라고 했을 뿐인데, AI가 기존 코드를 다 망쳐버렸어요."
분명 잘 돌아가고 있었어요. 근데 기능 하나 추가하려고 했더니 갑자기 전체가 안 돌아가고, 고치려고 하면 할수록 더 망가지고.
왜 이렇게 되는 걸까요?
AI가 멍청해서가 아니에요. 지시가 너무 막연해서 그래요.
AI는 유능한 신입사원이라고 했죠. 신입한테 "알아서 잘 해줘"라고만 하면 안 되는 것처럼, AI한테도 구체적으로, 기술적으로 말할 수 있어야 해요.
오늘은 바이브 코더가 목표로 해야 할 수준을 구체적으로 보여드릴게요.
목표: 기술적 지시가 가능한 매니저
3편에서 "기술적 지시가 가능한 매니저"라는 표현을 썼어요. 이게 정확히 어떤 수준일까요?
🎯 할 수 있는 것
1. AI한테 여러 선택지를 물어볼 수 있다
"이 기능 만들려면 어떤 방법들이 있어?"
2. 선택지를 듣고 판단할 수 있다
"우리 상황에는 1번이 더 맞겠다"
3. 판단한 방향으로 구체적으로 지시할 수 있다
"1번 방법으로 가자. 역할별로 폴더 나눠서 만들어줘"
4. AI가 만든 걸 보고 맞는지 확인할 수 있다
"어, 한 파일에 다 섞여있는데? 화면이랑 데이터 처리 분리해줘"
❌ 하지 않는 것
- 코드를 직접 타이핑하지 않음
- 알고리즘을 직접 짜지 않음
- 버그를 직접 수정하지 않음 (AI한테 시킴) 핵심은 "대화"예요.
단방향으로 "만들어줘"가 아니라, 양방향으로 "어떻게 할까?" → 판단 → "이렇게 해줘" → 확인 → "여기 고쳐줘"
이런 대화가 가능한 수준이 목표예요.
일방적 지시가 아닌, 토론하고 결정하고 지시하는 대화
수준별 비교: 막연 → 구체 → 기술적
같은 기능을 만들어도, 지시 수준에 따라 결과가 완전히 달라요. 쇼핑몰의 상품 검색/필터링 기능을 예시로 비교해볼게요.
수준 1: 막연한 지시
나: "상품 검색 기능 만들어줘"
AI: "네, 검색 기능 만들었습니다."
[AI가 뭔가 만듦]
나: (확인해보니 검색창만 있고 필터가 없음)
"아니 이게 아니라... 카테고리 필터도 있어야지"
[AI가 필터 추가 → 근데 기존 검색이 망가짐]
나: "검색이 왜 갑자기 안 돼?"
→ 복권 긁기. 뭐가 문제인지도 모름 수준 2: 구체적 지시
나: "상품 검색 기능 만들어줘.
- 검색창에 입력하면 상품명으로 검색
- 카테고리 필터 (의류, 전자기기, 식품)
- 가격대 필터 (1만원 이하, 1~5만원, 5만원 이상)"
AI: "네, 검색과 필터 기능 만들었습니다."
[AI가 만듦]
나: "잘 되네. 근데 상품 1000개 넘으면 엄청 느려지는데?"
AI: "아, 페이지네이션 추가하겠습니다."
→ 기능 명세는 명확. 근데 "어떻게 만들지"는 AI가 알아서 결정
→ 성능 문제나 구조적 문제가 터지면 대응이 어려움 수준 3: 기술적 지시 (목표 수준)
나: "상품 검색/필터 기능 만들 건데, 방식 먼저 정하자.
상품이 많아질 수 있어서 성능도 고려해야 해."
AI: "두 가지 방식이 있어요:
1. 프론트에서 필터링 - 상품 적으면 빠름, 많으면 느림
2. 백엔드 API로 필터링 - 상품 많아도 빠름, 설정 복잡"
나: "일단 상품 100개 정도니까 1번으로 가고,
나중에 2번으로 바꾸기 쉽게 구조 잡아줘."
AI: "네, 필터 로직을 별도 파일로 분리해서 만들게요.
- SearchFilter 컴포넌트 (검색창 + 필터 UI)
- filterService (필터링 로직만 담당)
- ProductList 컴포넌트 (결과 표시)"
[AI가 만듦]
나: (확인해보니 필터는 되는데 URL이 안 바뀜)
"필터 선택하면 URL에 반영해줘. 링크 공유되게."
AI: "URL 파라미터로 필터 상태 관리하게 수정할게요."
→ 방식의 장단점을 듣고 내가 판단
→ 구조를 이해하고 있어서, 문제 생기면 어디를 고칠지 앎
⚠️ 근데 이 수준에 도달하는 게 쉽지는 않아요
→ 개념을 알아야 하고, 대화 경험이 쌓여야 해요
→ 이 시리즈가 그 과정을 돕는 거예요 차이가 보이시나요?
수준 3은:
- 기술 스택을 먼저 정해요
- AI한테 선택지를 물어보고, 듣고 판단해요
- 구체적인 방향을 지시해요
- AI가 뭘 만들었는지 이해하고 확인해요
이게 "기술적 지시가 가능한 매니저"예요.
막연한 바램에서 기술적 지시로 성장하는 단계
실제 대화 흐름 예시
좀 더 실감나게, 프로젝트 처음부터 끝까지 대화 흐름을 보여드릴게요.
예시: 간단한 할일 관리 웹앱
나: "할일 관리 웹앱 만들 건데,
아키텍처 추천해줘. 사용자 많지 않고 간단해야 해."
AI: "세 가지 방법이 있어요:
1. 프론트만 (localStorage) - 서버 없이 빠름
2. 프론트+백엔드 분리 - 확장성 좋음
3. 풀스택 프레임워크 (Next.js) - 설정 편함"
나: "1번으로 가자. React로 만들고,
나중에 백엔드 추가하기 쉽게 구조만 잡아둬."
2단계: 프로젝트 구조 결정
AI: "프로젝트 구조 제안합니다:
/components - 화면에 보이는 부분들
/services - 데이터 저장/불러오기 담당"
나: "좋아. 폴더 나눠서 역할 분리하는 거지?"
AI: "네, 화면 그리는 코드랑 데이터 처리 코드를 분리하는 거예요.
나중에 수정할 때 어디를 고쳐야 할지 찾기 쉬워요."
나: "오케이, 그렇게 해줘."
3단계: 구현 및 확인
AI: "기본 구조 만들었어요. 확인해보세요."
[기능 단위로 직접 확인]
- 할일 추가 버튼 눌러보기 → 잘 됨
- 삭제 버튼 눌러보기 → 잘 됨
- 새로고침 후 데이터 남아있는지 확인 → OK
[코드 구조도 확인]
나: "어, 한 파일에 코드가 너무 많은데?
화면 그리는 거랑 데이터 처리는 분리해줘."
AI: "네, 데이터 처리 부분을 services 폴더로 분리할게요."
[수정 후]
나: "이제 역할별로 나뉘어 있네. 좋아." 이게 기술적 대화예요.
"만들어줘"가 아니라:
- "아키텍처 추천해봐"
- "폴더 나눠서 역할 분리하는 거지?"
- "한 파일에 너무 많은데, 분리해줘"
이런 대화를 할 수 있으려면 뭘 알아야 할까요?
이 수준에 도달하려면 뭘 알아야 하나요?
위 대화에서 쓰인 개념들만 봐도:
- 프론트엔드 vs 백엔드
- 아키텍처 (프로젝트를 어떤 방식으로 만들지)
- 프로젝트 구조 (폴더를 어떻게 나눌지)
- 역할 분리 (화면 vs 데이터 처리)
이런 개념들을 알아야 해요.
"프론트엔드가 정확히 뭐지?"를 외우는 게 아니라, "프론트엔드랑 백엔드가 다르구나" 정도만 알면 돼요. 그럼 AI한테 "프론트만 할 거야"라고 말할 수 있어요. 세부 내용은 이 시리즈에서 차근차근 배울 거예요.
수준별 성장 경로
바이브 코더로서 성장하는 경로를 단계별로 보여드릴게요.
1단계: 기능 요청 수준 (시작점)
"○○ 기능 만들어줘"
→ 뭔가 나오긴 하는데, 내가 원한 건지 모름
2단계: 명세 제공 수준
"△△ 기능 만들어줘. ××하면 ◇◇되게."
→ 기능은 원하는 대로 나옴. 근데 구조는 몰라서 나중에 막힘
3단계: 구조 이해 수준
"프론트/백 분리해줘", "컴포넌트 나눠줘"
→ 프로젝트 구조는 이해함. 설계는 여전히 AI가 알아서
4단계: 설계 대화 수준 (목표!)
"아키텍처 추천해봐" → 판단 → "1번으로 가자"
→ AI랑 설계 대화 가능. 방향 내가 정함
5단계: 고도화 (추가 성장)
성능, 보안, 확장성까지 고려한 지시
→ 실제 서비스 운영 가능 이 시리즈의 목표는 4단계예요.
1~3단계를 거쳐서, 4단계에 도달하는 것. 5단계는 그 이후에 각자 필요에 따라 성장하면 돼요.
"기술적"이라는 게 어렵게 들리는데...
"기술적 지시"라고 하니까 너무 어렵게 느껴질 수 있어요.
근데 어렵게 생각하지 않아도 돼요. 한 번에 하나씩 배우면 돼요.
"기술적으로 말한다" = 개념을 정확한 이름으로 부른다 예시: ❌ "이거 눈에 보이는 부분만 만들어줘" ✅ "프론트엔드만 만들어줘" ❌ "데이터 어딘가에 저장해줘" ✅ "localStorage에 저장해줘" ❌ "화면 나누고 싶어" ✅ "컴포넌트로 분리해줘" → 정확한 용어를 쓰는 것뿐이에요
용어를 알면, AI가 정확히 이해해요. 그럼 원하는 대로 나올 확률이 훨씬 높아져요.
코드를 봐야 하나요?
"기술적으로 지시한다"고 해서 코드를 줄줄 읽어야 하는 건 아니에요.
AI한테 지시할 때는 코드를 안 봐도 돼요. 근데 AI가 만든 후에는 확인해봐야 해요. 확인하는 것: ✅ "어, 이 파일에 다 때려박았네? 분리해야겠다" ✅ "폴더 구조가 이상한데? 역할별로 나눠야지" ✅ "이 파일이 너무 길어. 쪼개야겠다" 이 정도만 보면 돼요. 코드 한 줄 한 줄 다 이해할 필요는 없어요.
전체 구조만 파악하면 돼요.
"어디에 뭐가 있는지", "파일이 어떻게 나뉘어 있는지" 정도만요.
오늘의 핵심 정리
→ "만들어줘"가 아니라 "추천해봐" → 판단 → "이렇게 해줘"
✅ 대화가 핵심
→ 단방향 지시 X, 양방향 대화 O
→ AI한테 물어보고, 듣고, 판단하고, 지시하기
✅ 이 수준에 필요한 것
→ 프로그램 구조, 폴더 나누는 법, 역할 분리 같은 개념들
→ 이 시리즈에서 차근차근 배움
✅ 성장 경로
→ 기능 요청 → 명세 제공 → 구조 이해 → 설계 대화 (목표!)
✅ AI한테 기술적으로 지시할 때:
"○○ 만들어줘. 방식 먼저 정하자.
장단점 알려줘 → [듣고 판단] → 1번 방식으로 가고,
나중에 바꾸기 쉽게 구조 잡아줘."셀프체크
오늘 배운 내용, 제대로 이해했는지 확인해볼까요?
□ 이 시리즈가 끝나면 무엇을 할 수 있게 되나요?
□ AI가 여러 선택지를 주면 어떻게 해야 하나요?
(정답: AI에게 기술적으로 지시하고 결과를 판단할 수 있다 / 장단점을 파악하고 나의 상황에 맞는 것을 선택한다)
다음 글 예고
PART 1 마인드셋 정리해볼게요.
- AI는 유능한 신입사원이다 (1편)
- 바이브 코딩은 코드가 아니라 명확한 지침이다 (2편)
- 문법이 아니라 개념을 배운다 (3편)
- 기술적 지시가 가능한 매니저가 목표다 (4편, 지금)
다음 글부터는 PART 2: 큰 그림이에요.
프로그램의 종류부터 시작할게요.
- 웹이랑 앱이 어떻게 다른지
- 자동화 스크립트는 뭔지
- AI한테 "어디서 돌아가게 만들어줘"라고 말하는 법
개념 하나씩 배우면서, AI한테 기술적으로 말하는 법을 익혀갈 거예요.
이 시리즈 로드맵
PART 1: 마인드셋 (4편) ✅ 완료!
[ 1편 ] AI는 유능한 신입사원이다 ✅
[ 2편 ] 바이브 코딩이란 무엇인가 ✅
[ 3편 ] 바이브 코더가 알아야 할 것 ✅
[ 4편 ] 목표 수준: 기술적 지시가 가능한 매니저 ← 지금 여기! ✅
↓
PART 2: 기술 개념 - 큰 그림 (6편)
[ 5편 ] 프로그램의 종류 (웹앱 vs 네이티브앱)
[ 6편 ] 프론트엔드 vs 백엔드
[ 7편 ] 데이터는 어디에 저장되나
[ 8편 ] 서비스들이 대화하는 방법: API
[ 9편 ] 프로젝트 구조
[ 10편 ] 데이터 흐름
↓
PART 3: 기술 개념 - 설계 (5편)
[ 11~15편 ] 자료구조, 아키텍처, 디자인 패턴, 상태 관리
↓
PART 4: 도구 세팅 (5편)
[ 16~20편 ] Claude Code, 터미널, VS Code, Git, 환경 세팅
↓
PART 5: 첫 프로젝트 - 할 일 관리 웹앱 (4편)
PART 6: 두 번째 프로젝트 - 자동화 봇 (4편)
PART 7: 세 번째 프로젝트 - 데이터 대시보드 (4편)
↓
PART 8: 독립 성장 (3편)
[ 33~35편 ] 에러 읽기, AI와 디버깅, 앞으로의 여정
"만들어줘"에서 "어떻게 만들까? 추천해봐"로. 이 한 걸음이 복권에서 주문서로 바뀌는 차이예요.
궁금한 점이나 다뤘으면 하는 주제가 있으면 댓글로 남겨주세요!