v∞
★ LAB · REST

데이터 흐름 디버깅 워크숍

REST API와 마무리 — 실습

📍 지금 어디를 만지고 있나요?
브라우저
REST API와 마무리
DB

사전 준비

이번 실습의 목표

① F12 → ② 서버 콘솔 → ③ Mapper SQL 로그 → ④ DB SELECT → ⑤ 응답 JSON

1
코드 작성
시나리오 1: "댓글이 화면에 안 떠요"

   ① F12 Network 탭
      → 요청이 갔는가?
      → 갔다면 응답 Status 는?
      → 가지 않았으면 → JS 코드의 fetch 가 호출됐는지 확인

   ② 갔다면 서버 콘솔
      → 컨트롤러가 호출됐는가? (로그 출력)
      → 호출됐는데 에러? → 스택 트레이스

   ③ 컨트롤러 OK 면 Mapper SQL 로그
      → 실제 SQL 이 실행됐는가?
      → 파라미터가 제대로 전달됐는가?

   ④ SQL 실행됐다면 DB 에서 직접 SELECT
      → 데이터가 진짜 들어갔는가?
      → DB 에는 있는데 응답엔 없으면 → 응답 직렬화 문제

   ⑤ 마지막 — 응답 JSON 자체
      → DevTools Network → Response 탭
      → 응답에 뭐가 와 있는가?
      → 클라이언트 JS 가 그걸 어떻게 그렸는가?

시나리오 2~5: 로그인 풀림 / 한글 깨짐 / null 데이터 / 권한 오류
   각각 같은 5 단계 역추적 적용
CHECKPOINT
  • 코드를 작성한 뒤 빨간 줄(컴파일 오류)이 없는가?
2
실행 + 결과 확인

Run on Server 또는 javac+java 로 실행하고 결과를 확인합니다.

CHECKPOINT
  • 예상한 동작이 일어났는가?
  • 안 됐다면 F12 / 콘솔 / 로그 어디서 단서가 보이는가?

실습 완료 체크리스트

디버깅 = 흐름도 역추적
5 단계 점검 순서
한 단계씩 좁혀나감
v∞ — 4 주 학습의 종착점