TypeScript
TypeScript에서 날짜 타입 리팩터링할 때 확인해야 할 것
날짜 관련 버그를 쫓을 때는 타입 정의부터 실제 응답까지 체계적으로 비교하는 게 핵심이다.
날짜 관련 작업을 하다 보면 타입은 맞는데 실행 결과가 이상한 경우를 자주 마난다. 특히 TypeScript를 쓸 때는 타입 체크가 통과했으니 당연히 정상이겠거니 하다가 나중에 서버에서 뜻밖의 값을 받는 경험을 하게 된다.
내가 배운 방법은, 문제를 크게 잡지 말고 확인할 지점들을 체계적으로 좁혀가는 것이다. 전체 타입 구조에서 이상이 있다고 느낀다면 재현 조건과 실제 응답값부터 모아야 한다.
먼저 정상 상태를 정의하기
수정을 시작하기 전에 정상일 때의 타입 상태를 정해두는 게 중요하다. 그래야 뭐가 달라졌는지 빨리 판단할 수 있다. 확인할 값들을 정리하면:
- 실제 응답 값
- 기대하는 타입 형태
- 빌드 에러 메시지
타입 가드 확인
TypeScript에서 optional이나 null 체크를 건너뛰면 나중에 런타임에서 터진다. 빌드할 때 먼저 확인해보자:
npm run build
npx tsc --noEmit
이 명령이 통과하면 기본적인 타입 문제는 없는 거다. 그 다음은 실제 응답을 보면서 타입 정의가 맞는지 비교해야 한다.
로컬 vs 운영 환경 차이
로컬에서는 잘 동작하던 코드가 배포 후 이상한 값을 받는 경우가 많다. 이럴 때는 환경 차이를 명확히 적어두면 다음 확인이 훨씬 쉬워진다.
한 번에 하나씩만 바꾸기
날짜 타입을 리팩터링할 때 실수하기 쉬운 부분은 여러 파일을 동시에 수정하는 것이다. 작은 단위로 나눠서 확인하면서 진행하면 문제가 발생했을 때 원인 추적이 쉽다.
- 원래 증상이 같은 조건에서 다시 나는지 확인한다.
- 로그와 응답에서 바뀐 부분을 명확히 한다.
- 빌드 결과와 실제 요청을 마지막으로 확인한다.
마지막으로, 작업을 마친 후 관련 기록을 남겨두면 비슷한 문제가 나중에 생겼을 때 훨씬 빨리 처리할 수 있다.