혼자 운영할 때 자주 빠지는 에러 페이지

처음 프로젝트를 배포할 때 에러 페이지를 제대로 만들지 않은 경험이 있다. 로컬에서는 개발 모드라 자세한 에러 메시지가 나오지만, 배포 환경에서는 사용자에게 보여줄 페이지가 필요하다.

배포 환경에서 필요한 에러 페이지

Next.js라면 error.tsx와 not-found.tsx를 각 라우트에 추가해야 한다. 단순하게라도 있어야 한다. 없으면 흰 화면만 나온다.

npm run build

빌드 과정에서 빌드 경고나 에러가 없는지 확인하는 것도 중요하다. 로컬에서는 문제가 없어 보이지만 배포 환경에서 다르게 나타날 수 있다.

로컬과 배포 환경 차이 점검

배포 전에 다음을 확인해야 한다:

1. 로컬에서 npm run build && npm run start로 실제 프로덕션 빌드를 테스트
2. 개발 서버에서는 안 나타나는 에러가 프로덕션에서 나지는 않는지 확인
3. 환경 변수가 배포 환경에서 제대로 설정되었는지 확인

에러 페이지 준비하기

최소한 다음 정도는 준비해야 한다:

• 404 Not Found 페이지: 존재하지 않는 경로로 접근했을 때
• 500 Internal Server Error 페이지: 서버에서 뭔가 터졌을 때
• 로딩 중이나 연결 오류 상태를 사용자에게 보여줄 폴백

자주 놓치는 부분

혼자 개발할 때는 에러 상황을 많이 테스트 안 한다. 프로덕션 환경에서 갑자기 API가 느려지거나 데이터베이스 연결이 끊겼을 때도 준비가 되어 있어야 한다.

간단한 에러 페이지라도 없는 것보다는 훨씬 낫다. 사용자 입장에서는 아무것도 안 나오는 것보다 '뭔가 문제가 있습니다'는 메시지가 낫다.

배포 후 확인

배포 후 실제 사이트에 접속해서 에러 상황을 의도적으로 만들어보는 것도 좋다. 없는 페이지로 가보고, 개발자 도구 콘솔에서 네트워크 에러가 제대로 처리되는지 보자.