AI로 디버깅과 에러 해결

🔄 이전 레슨 복습: 이전 레슨에서 프로덕션 품질의 코드를 AI와 함께 생성하는 법을 배웠어요. 이제 AI를 디버깅 파트너로 활용하는 법을 다뤄요.

말도 안 되는 500 에러

지난달 한 개발자가 버그 하나에 6시간을 썼어요. API가 500 에러를 반환하는데, 화요일에만. EU 유저한테만. 2MB 이상 PDF를 업로드할 때만.

결국 전체 요청 흐름을 AI에 붙여넣고 물어봤어요: “왜 화요일에만, EU 유저한테만, 큰 PDF에서만 실패할까?”

30초 만에 답이 왔어요: EU 리전 로드밸런서의 타임아웃 설정이 다르고, PDF 처리 서비스에 매주 화요일 실행되는 크론잡이 메모리를 소비해서 큰 파일 처리가 타임아웃 임계값을 넘겼다고요.

6시간의 탐정 작업, 또는 적절한 맥락과 함께 30초. 이 레슨에서 배우는 게 바로 이거예요.

디버깅 삼총사

효과적인 AI 디버깅 세션에는 세 가지가 필요해요:

1. 에러 (무엇이 잘못됐는지)

TypeError: Cannot read properties of undefined (reading 'map')
at UserList.render (UserList.tsx:24)
at renderWithHooks (react-dom.development.js:14985)

2. 코드 (어디서 잘못됐는지)

const UserList = ({ users }: Props) => {
  return (
    <ul>
      {users.map(user => (  // Line 24
        <li key={user.id}>{user.name}</li>
      ))}
    </ul>
  );
};

3. 기대 (무엇이 일어나야 했는지)

기대: API 응답에서 유저 목록 렌더링
실제: 컴포넌트 첫 마운트에서 TypeError로 크래시

하나라도 빠지면 AI가 추측해야 해요. 세 개 다 있으면 거의 매번 정확한 진단을 해줘요.

이 예시에서 AI는 바로 알려줄 거예요: users가 첫 렌더링 때 undefined인 건 API 호출이 아직 완료되지 않아서예요. 로딩 상태를 추가하거나 users의 기본값을 빈 배열로 설정하라고요.

실전에서 통하는 다섯 가지 디버깅 패턴

패턴 1: 스택 트레이스 분석

전체 스택 트레이스를 붙여넣고 진단을 요청해요.

프로덕션 Node.js 서비스의 스택 트레이스예요.
간헐적으로 발생하고, 전체 요청의 약 5%에서 나와요.

[전체 스택 트레이스]

관련 코드 파일:
[스택 트레이스에 언급된 파일 붙여넣기]

원인이 뭐고, 왜 간헐적인 건가요?

AI는 실행 경로를 추적하고, 실패하는 라인을 식별하고, 간헐적 원인(레이스 컨디션, 리소스 고갈, 외부 서비스 타임아웃)을 추론할 수 있어요.

패턴 2: “뭐가 바뀐 거지?” 디버그

어제 작동하던 게 오늘 고장났어요. AI가 diff 분석에서 빛나는 순간이에요.

이 엔드포인트가 어제까지 작동했는데 오늘 422 Validation
Error가 발생해요. 어제 이후 변경된 git diff:

[git diff 붙여넣기]

에러 내용:
[에러 붙여넣기]

이 diff에서 뭐가 이 validation 에러를 일으킬 수 있을까요?

AI가 diff에서 검증 스키마, 타입 정의, 미들웨어, 설정 변경 사항을 스캔해서 에러 원인을 찾아줘요.

패턴 3: 러버덕 업그레이드

고전적인 러버덕 기법 — 문제를 소리 내어 설명하기 — 이 AI와 만나면 더 강력해져요. 동료에게 설명하듯 작성해요:

WebSocket 연결이 정확히 60초 비활성 후에 끊기는 이유를
이해하려고 해요.

알고 있는 것:
- WebSocket 서버 타임아웃: 120초로 설정
- 앞에 Nginx가 있음
- 클라이언트는 30초마다 ping 전송
- 그런데도 60초에서 연결이 끊김

Nginx 설정:
[설정 붙여넣기]

WebSocket 서버 설정:
[설정 붙여넣기]

내가 뭘 놓치고 있는 거예요?

이걸 쓰는 과정에서 답이 보이는 경우가 많아요. 안 보여도 AI가 Nginx의 proxy_read_timeout이 60초로 설정되어 WebSocket 서버의 타임아웃을 오버라이드하고 있다는 걸 바로 찾아줄 거예요.

패턴 4: 재현-그리고-수정

버그를 재현할 수 없을 때, 증상을 설명하고 AI에게 재현 방법을 만들도록 요청해요:

데이터 테이블의 "날짜" 컬럼으로 정렬하면 순서가 가끔
잘못되는 버그가요. 로컬에서 재현이 안 돼요.

사용자 보고:
- 다른 연도의 날짜가 걸치면 발생
- 일부 사용자만 경험
- 캐시 지워도 해결 안 됨

정렬 코드:
[정렬 구현 붙여넣기]

일관되지 않은 정렬의 원인이 뭐고, 재현할 테스트 케이스를
어떻게 만들 수 있을까요?

AI가 날짜 문자열을 사전순이 아닌 시간순으로 정렬하고 있다는 걸 식별하고, 연도 경계에서만 문제가 나타난다는 걸 알려줄 수 있어요.

패턴 5: 에러 메시지 번역

정말 암호 같은 에러 메시지가 있어요. AI가 번역에 탁월해요:

이 에러가 뭔 뜻인지 모르겠어요:

FATAL ERROR: Ineffective mark-compacts near heap limit
Allocation failed - JavaScript heap out of memory

500개 이상 마크다운 파일을 처리할 때 빌드에서 발생해요.
빌드 스크립트:
[빌드 설정 붙여넣기]

AI가 번역해줘요: Node.js 프로세스가 빌드 중 메모리 부족이라고. --max-old-space-size로 힙 크기를 늘리라고 제안하고, 빌드의 어떤 부분이 메모리를 많이 쓰는지 식별해줘요.

✅ 확인 질문: React 앱의 검색 기능에서 결과를 클릭하면 잘못된 페이지로 이동하는 버그가 있어요. 특수 문자가 포함된 이름(예: “Ben & Jerry’s”)에서만 발생해요. AI에게 뭘 보내야 할까요?

핵심 파일: 검색 결과 컴포넌트, URL 생성 로직, 네비게이션 핸들러. 원인? URL 인코딩 — &가 쿼리 파라미터 구분자로 해석되고 있어요.

AI가 디버깅에서 틀리는 경우

AI 디버깅은 완벽하지 않아요. 이런 함정에 주의하세요:

자신만만한 오답. AI가 그럴듯하게 들리지만 완전히 틀린 설명을 할 때가 있어요. AI 설명과 실제 동작을 대조해서 항상 검증하세요.

원인이 아닌 증상 수정. 때때로 AI가 근본 원인을 해결하지 않고 에러 메시지만 없애요. 수정이 “null 체크 추가"라면 물어보세요: “근데 이 값이 왜 null인 거예요?”

환경 무시. AI가 다른 버전의 라이브러리나 다른 OS에 맞는 수정을 제안할 수 있어요. 항상 구체적인 버전을 언급하세요.

핵심 정리

• 항상 디버깅 삼총사를 제공하세요: 에러, 코드, 기대 동작
• 상황에 맞는 디버깅 패턴을 사용하세요 (스택 트레이스, diff, 러버덕, 재현, 에러 번역)
• 다중 파일 버그에서는 전체 데이터 흐름을 보여주세요
• AI 설명을 검증하세요 — 수정을 그냥 적용하지 마세요
• “왜?“를 물어서 증상이 아닌 근본 원인을 찾으세요

다음 레슨: 테스트와 품질 보증 — AI로 여러분이 절대 생각하지 못할 엣지 케이스까지 포함한 포괄적인 테스트 스위트를 작성하는 법을 배워요.