에러 바운더리(Error Boundary)는 어떤 오류를 처리하나요?

이렇게 답해 보세요 (핵심 답변)

에러 바운더리는 하위 컴포넌트 트리의 렌더링, 수명주기 메서드, 생성자 실행 중에 발생한 예외를 포착해 앱 전체가 하얀 화면으로 죽는 대신 대체 UI(Fallback UI)를 보여 주는 컴포넌트입니다. 클래스 컴포넌트의 getDerivedStateFromError와 componentDidCatch로 구현하거나 검증된 래퍼 라이브러리를 사용하며, 위젯이나 페이지 섹션처럼 독립적으로 복구 가능한 경계마다 배치합니다. 다만 렌더링 과정이 아닌 일반 이벤트 핸들러, setTimeout, 비동기 fetch 요청 자체의 에러는 포착하지 못하므로 이는 별도의 try/catch나 비동기 에러 상태로 처리해야 합니다.

함께 설명하면 좋은 이유 (꼬리질문 대비)

1. 장애 격리 단위를 잘 나누어 두면 대시보드의 차트 하나가 실패하더라도 네비게이션과 나머지 핵심 기능은 정상 유지할 수 있습니다.
2. 포착한 에러 정보를 모니터링 도구로 전송해 운영 환경의 렌더링 실패 원인을 추적하는 지점으로 활용할 수 있습니다.

면접에서 자주 하는 실수

에러 바운더리는 자신의 하위 트리에서 난 오류만 잡을 수 있으며, 에러 바운더리 컴포넌트 자체의 렌더 오류나 클릭 이벤트 핸들러 내부 오류까지 자동으로 잡아 주지는 않습니다.