Codex / Claude Code를 활용한 네트워크 요청 디버깅 (Debugging) 실용 팁.

웹 개발을 할 때, 서버 측 API (Server-side API)에서 오류가 발생하거나 최적화가 필요할 경우, 더 이상 직접 반복적으로 스크린샷을 찍고 복사하여 붙여넣지 마세요.

실제 네트워크 요청 데이터를 Agent에게 전달하면, Agent가 직접 문제를 파악하고 해결 방법을 제시할 수 있습니다.

가장 간편한 두 가지 방법:

1. Chrome DevTools 사용: Network 탭을 열고, 문제를 재현한 후 HAR 파일을 내보내어 해당 파일을 Agent에게 전달하여 분석하게 합니다.

2. 데이터 자동 저장: 코드에 임시로 요청/응답 로그를 추가하거나, 프록시(Proxy) 도구를 사용하여 패킷을 캡처하고 저장한 뒤, Agent가 로그 파일을 직접 읽도록 합니다.

핵심 원칙: AI가 "추측"하게 하지 말고, 현장의 증거를 직접 제공하세요.