C
개발 도구/바이브기초/Lesson 04

바이브 기초 — 에러 읽기 · 디버그 · 패키지 관리

30분·theory

바이브 기초 — 에러 읽기 · 디버그 · 패키지 관리

🎯 이 lesson 을 읽고 나면

이 lesson 을 다 읽고 나면 아래 3가지를 자신 있게 할 수 있습니다.

  • ✅ 에러 메시지 읽는 법 (stack trace 핵심 1줄)
  • ✅ 디버그 4단계 (재현 · 가설 · 검증 · 수정)
  • ✅ AI 디버깅 4요소 템플릿

학습 목표를 체크리스트로 두고 다 답할 수 있게 되면 lesson 을 닫으세요.

에러 메시지 읽는 법

한 줄: 에러 메시지는 해답. 무시 X, 끝에서 거꾸로 읽기.

Stack Trace 읽는 순서:

code
Traceback (most recent call last):
  File "app.py", line 23, in main          # 가장 위 = 최초 호출
    process(data)
  File "app.py", line 15, in process       # 중간
    validate(item)
  File "app.py", line 8, in validate       # 가장 아래 = 실제 에러
    raise ValueError("nil 데이터")          # ← 여기부터 읽기
ValueError: nil 데이터

3단계 분석:
1. 에러 이름: ValueError·NullPointerException·SyntaxError...
2. 에러 메시지: 구체적 원인 ("nil 데이터")
3. 위치: 어느 파일·줄에서 (가장 아래부터 거꾸로 = 내 코드 찾기)

자주 만나는 에러:

에러의미해결
NullPointerException (Java)null 객체 메서드 호출null 체크 + Optional
Cannot read property of undefined (JS)undefined 속성 접근optional chaining ?.
ModuleNotFoundError (Python)import 실패venv 활성화 + pip install
Address already in use포트 점유lsof -ti :3000 \xargs kill
Permission denied권한 부족chmod +x 또는 sudo
CORS error다른 도메인 차단서버 측 헤더 설정

> 💡 Googling 의 함정: 에러 메시지 전체 검색 X. 핵심 키워드만 ("Cannot find module" express).

디버그 마인드 — 가설·검증 루프

Iron Law: 근본 원인 없이 수정 X. "어찌어찌 됐어요" = 다음에 다시 터짐.

디버깅 4단계:
1. 재현 — 100% 재현 가능한 최소 케이스 (Hello, world 수준)
2. 분석 — 로그·디버거·console.log·print. 데이터 흐름 추적
3. 가설 — "X 때문에 Y" 명확한 문장으로
4. 검증 — 가설대로 수정 → 에러 사라짐? 안 사라지면 가설이 틀림

디버그 도구:

도구용도
console.log / print빠른 확인 (production 전 제거)
디버거 (IDE·Chrome DevTools)breakpoint·step over·변수 검사
로그 레벨 (debug/info/warn/error)production 에서
Network 탭API 요청·응답
Performance 프로파일러느림 원인
Heap snapshot메모리 누수

고급 기법:

  • Binary Search: 큰 변경 → 절반씩 잘라 어느 쪽이 원인인지
  • Rubber Duck: 코드를 큰 소리로 설명 — 절반은 그 과정에서 발견
  • Time Travel Debug: 일부 IDE 가 지원 (변수 변화 역추적)
  • AI 페어: 에러 + 코드를 Claude/Copilot 에 붙여넣기 → 가설 후보 제안

흔한 함정:

  • ❌ "코드 재시작하면 됨" → 무시한 채 다음 사람한테 폭탄
  • ❌ try/catch 로 에러 숨김 (catch {}) — 추후 진짜 버그 묻힘
  • ❌ 한 번에 여러 곳 수정 → 어느 게 효과인지 모름
  • ✅ 가설 1개씩, 변경 1개씩, 즉시 검증

🤖 AI 디버깅 요청 템플릿 — *토큰 2~3배 절약*

❌ 이렇게 요청하지 마세요

code
"에러가 나요. 고쳐주세요."

AI 의 첫 응답이 "어떤 에러인가요? 코드 보여주세요. 환경이 뭐예요?" 가 됩니다. 한 번의 답을 받기 위해 3~5번 왕복. 매번 토큰 누적.

✅ 이렇게 요청하세요 — 4요소 템플릿

code
다음 에러가 발생합니다:
[에러 메시지 + stack trace 전체 복사]

실행 환경:
- 언어/런타임: Node 20 / Python 3.11 / Java 17
- 프레임워크: Next.js 15.4 / Spring Boot 3.2
- OS: Windows 11 / macOS 14

재현 조건:
[어떤 입력값/조건에서 발생하는지 — "users API GET /users/{id}
에 id=999 보내면" 같은 구체 시나리오]

이미 시도한 것:
- npm cache clean → 동일 에러
- node_modules 삭제 후 재설치 → 동일
- 다른 라우트는 정상 동작

원인과 수정 방법을 알려주세요.

왜 이게 효과적인가

AI 가 답에 필요한 맥락 4축 을 한 번에 받음:

1. 에러 자체 — stack trace 가 가장 큰 단서
2. 환경 — 같은 코드도 버전에 따라 다른 동작
3. 재현 조건 — "항상 그렇다" vs "이 조건에서만" 이 핵심
4. 시도 — AI 가 이미 제시할 뻔한 솔루션을 건너뜀

토큰 비교 — 실측

나쁜 요청 (3턴 왕복):

code
나: 에러 났어. 고쳐줘.   (50토큰)
AI: 에러 메시지 보여주세요. (30)
나: [복사]  (200)
AI: 환경이 뭐예요?  (20)
나: Node 20.  (10)
AI: 답변  (1000)
총: 약 1310 토큰

좋은 요청 (1턴):

code
나: [4요소 모두 포함]  (400)
AI: 답변  (1000)
총: 약 1400 토큰

비슷하다? 아니다 — 첫 답의 품질이 다름. 좋은 요청은 1번에 정확한 답, 나쁜 요청은 대화 후 추가 보강 필요 로 결국 3000+ 토큰.

더 절약하는 팁

  • 에러 메시지가 길면 핵심만: Caused by: 라인 + 첫 5줄 stack trace
  • 민감 정보 제거: API 키·비밀번호·실제 사용자 데이터 → <REDACTED>
  • 재현 가능한 최소 코드 (MCRE): 100줄 중 문제되는 10줄만 첨부
  • stack trace 가 너무 길면 위 5줄 + 아래 5줄

면접 응용

"AI 도구 잘 쓰세요?" → 이 4요소 템플릿을 답하면 합격. AI 활용 깊이의 척도가 됩니다.

💻 📌 npm + pip 가상환경 핵심
# ═══════════════════════════════════════════
# npm — Node 패키지 관리
# ═══════════════════════════════════════════
npm init -y                         # package.json 자동 생성
npm install <pkg>                   # 의존성 추가 (dependencies)
npm install -D <pkg>                # 개발 의존성 (devDependencies)
npm install -g <pkg>                # 전역 (보통 피하고 npx 권장)
npm uninstall <pkg>                 # 제거
npm update                          # 마이너·패치 업데이트
npx <pkg>                           # 설치 없이 1회 실행 (create-next-app)

# package.json scripts 활용
# {"scripts": {"dev": "next dev", "lint": "tsc --noEmit"}}
npm run dev                         # scripts.dev 실행
npm run lint                        # 정의된 모든 script

# === 흔한 npm 함정 ===
# 1. node_modules 손상 → 삭제 후 재설치
rm -rf node_modules package-lock.json && npm install
# 2. 글로벌 권한 에러 → npx 또는 nvm 사용 (sudo X)
# 3. 락 파일 무시 → 팀 빌드 깨짐. git add package-lock.json 필수

# ═══════════════════════════════════════════
# pip + venv — Python 패키지 관리
# ═══════════════════════════════════════════
python -m venv .venv                # 프로젝트별 가상환경
source .venv/bin/activate           # macOS/Linux
.venv\Scripts\activate              # Windows
which python                        # → .venv/bin/python (격리 확인)
deactivate                          # 가상환경 종료

pip install requests                # 의존성 설치
pip install -r requirements.txt     # 일괄
pip install -e .                    # 편집 가능 (개발용)
pip freeze > requirements.txt        # 현재 버전 고정

# === 모던 도구 (pip 대체) ===
# uv: Rust 기반, pip 보다 10-100배 빠름 (2024+)
uv venv && uv pip install -r requirements.txt
# poetry: 의존성 + 패키징 통합
poetry add requests && poetry install
# pipenv: Pipfile + Pipfile.lock

# === 흔한 함정 ===
# 1. venv 활성화 안 하고 pip install → 시스템 Python 더러워짐
# 2. requirements.txt 버전 미고정 → 다음 빌드 깨짐
#    ❌ requests        ✅ requests==2.31.0
# 3. .venv/ git 커밋 → .gitignore 에 추가 필수

🤖 AI 에게 이렇게 요청해보세요

이 lesson 의 개념을 알면 AI 에게 구체적으로 지시할 수 있습니다.

  • "다음 에러: [에러 전체 복사] / Node 20 / 재현 조건: [입력값] / 이미 시도: [내용] — 원인과 수정 방법 알려줘."
  • "이 package.json 의 의존성 충돌을 npm ls 결과와 함께 진단해줘."
  • "이 stack trace 의 핵심 1줄을 찾아주고 디버그 순서 4단계로 알려줘."

왜 이게 토큰을 줄이나

"에러 났어요. 고쳐주세요." 는 AI 가 5번은 다시 물어봅니다. 환경 + 재현 + 시도 3요소를 같이 보내면 한 번에 답이 옵니다 — 토큰 2~3배 절약.

다음 추천: 네트워크
바이브 기초 — 에러 읽기·디버그·패키지 - 개발 도구