API 상태 코드를 안전하게 바꾸기

API 상태 코드를 바꿀 때는 프론트엔드에서 그 상태 코드를 어떻게 다루는지 먼저 파악해야 한다. 로컬에서는 괜찮아 보였던 변경도 실제 서버에서는 문제를 일으킬 수 있기 때문이다.

현재 상황을 정확히 파악

어떤 엔드포인트의 상태 코드를 바꿀 건지 명확히 한다. 그리고 현재 프론트엔드는 그 상태 코드를 받았을 때 뭘 하는지 본다. 에러를 표시하는가, 다시 시도하는가, 아니면 다른 화면으로 넘어가는가를 써둔다.

빌드하고 모바일 환경까지 테스트

npm run build
# 브라우저에서 모바일 폭과 키보드 입력 흐름을 확인한다

상태 코드 변경이 터치 입력이나 폼 제출 같은 이벤트에 영향을 미칠 수 있다. 로컬 개발 환경에서 테스트했을 때는 괜찮았는데, 모바일에서는 다르게 작동하는 경우가 있다.

API 응답 직접 확인

개발자 도구의 네트워크 탭에서 실제 응답을 본다. 상태 코드가 정말 바뀌었는지, 응답 본문은 뭔지 확인한다. 프론트엔드가 같은 상태 코드를 여러 상황에서 받을 수 있다면, 응답 본문의 내용도 중요하다.

한 번에 한 엔드포인트씩

여러 엔드포인트의 상태 코드를 한 번에 바꾸면 뭐가 문제인지 추적하기 어렵다. 한 엔드포인트 하나만 바꾸고, 실제 화면에서 그 엔드포인트가 호출되는 상황을 다시 테스트한다. 로그나 API 응답에서 뭐가 달라졌는지 설명할 수 있을 때까지만 나중 엔드포인트로 넘어간다.