Pre-requisites

ReactQuery

프론트엔드에서 서버 상태 관리를 위한 라이브러리로, 자체적인 에러 핸들링 메커니즘을 제공합니다.

onError 콜백, useQuery 의 에러 상태, 전역 쿼리 클라이언트 설정을 통해 API 요청 실패 시 에러를 처리할 수 있습니다.

Axios

HTTP 클라이언트 라이브러리로, 인터셉터를 통해 요청/응답 에러를 중앙에서 처리할 수 있습니다. 에러 객체에는 상태 코드, 응답 데이터 등 상세 정보가 포함되어 있어 에러 분류와 처리에 유용합니다.

Error Utility Class

에러 객체를 생성, 변환, 분류하는 유틸리티 클래스입니다. 애플리케이션 전반에서 일관된 에러 처리 방식을 제공하며, 서버 에러와 클라이언트 에러를 명확히 구분하고, 각 에러 유형에 따라 적절한 처리 방법을 결정할 수 있게 해줍니다.

ErrorHandler

애플리케이션에서 발생하는 에러를 중앙에서 처리하는 컴포넌트나 함수입니다. 에러 로깅, 사용자 알림, 에러 복구 등의 작업을 담당하며, 일관된 에러 처리 전략을 구현합니다.

ErrorBoundary

React 컴포넌트에서 발생하는 JavaScript 에러를 캐치하여 애플리케이션 전체가 중단되는 것을 방지하는 컴포넌트입니다. 에러 발생 시 대체 UI를 표시하거나 에러 정보를 로깅할 수 있습니다.

ErrorComponent

사용자에게 에러 상황을 알리는 UI 컴포넌트입니다. UI의 일부로 표시되어 에러 메시지를 표시할 수 있습니다.

Notification

사용자에게 에러 상황을 알리는 UI 컴포넌트입니다. 토스트, 모달, 인라인 메시지 등 다양한 형태로 구현될 수 있으며, 에러의 심각도나 유형에 따라 다른 스타일과 메시지를 표시할 수 있습니다.

(addEventListener) error

실행 중인 JavaScript 코드에서 예외 발생하는 경우를 위한 이벤트입니다.

(addEventListener) unhandledrejected

Promise가 거부(reject)되었지만 .catch()로 처리되지 않았을 경우를 위한 이벤트입니다.