Refactor/error handling

[spde3289]

개요

close #82

카테고리

• Bug fix (not modifying existing features)
• New feature (not modifying existing features)
• Changing feature (modifying existing feature or fixing bug)
• Docs updated required
• Chore

상세 내용

기존에는 오류가 발생했을 때 처리 방식이 일관적이지 않아
페이지 전체가 붕괴되거나 기본 React Router 에러 화면이 노출되는 문제가 있었습니다.

이를 해결하기 위해 오류의 종류별로 책임 범위를 분리하고,
사용자 경험(UX)을 최대한 유지하는 방향으로 에러 레이어를 정의했습니다.

1) 404 NotFoundPage — 잘못된 경로 접근

• 사용자가 존재하지 않는 URL에 접근한 경우
• 즉시 홈으로 보내는 대신 안내 페이지를 먼저 보여줌
• "홈으로 돌아가기" 행동 유도

2) RouteErrorPage — 라우팅된 페이지 내부 에러

• loader/action/lazy route 등 라우터 수준의 에러
• React Router의 errorElement로 처리
• 시스템적인 에러를 사용자에게 안내 + 재시도/홈 이동 제공

3) SectionErrorBoundary — 기능 단위 오류

• 특정 섹션(DonationSection, ChartSection)에서만 오류가 발생했을 때
• 전체 페이지가 붕괴되지 않고 해당 컴포넌트만 Fallback 렌더
• "다시 시도하기"로 해당 기능만 재로드 가능

4) API Error — 네트워크/스키마 에러

• axios interceptor에서 처리
• 사용자에게 눈에 띄는 토스트로 즉각 안내
• 화면은 유지되고 요청 실패만 알려주도록 설계

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

1 Skipped Deployment

Project	Deployment	Preview	Comments	Updated (UTC)
fandom-k	Ignored			Nov 18, 2025 1:10pm