---
title: 애플리케이션 안정성 및 로깅 (Error Boundary)
category: Software Architecture
tags: [Reliability, Error Boundary, Sentry, Logging, Stability]
created: 2026-04-20
---

# [[Reliability_Safety_First]] (애플리케이션 안정성)

## 📌 한 줄 통찰 (The Karpathy Summary)
> 에러는 막는 것이 아니라 '우아하게 격리'하는 것이다. 컴포넌트 하나가 무너져도 전체 시스템은 안전하게 순항해야 한다.

## 📖 구조화된 지식 (Synthesized Content)
- **Error Boundary (에러 바운더리)**:
    - 리액트의 `componentDidCatch` 생명 주기를 활용하여, 특정 하위 컴포넌트 트리의 런타임 에러를 포착하고 '대체 UI'를 보여주는 최후의 방어선이다.
    - **적용 전략**: 전체 앱을 감싸는 전역 바운더리 외에도, 독립적으로 동작하는 위젯(예: 사이드바, 게시글 목록) 단위로 세밀하게 감싸는 것이 유리하다.
- **Observability (로깅 및 관측 가능성)**:
    - **Sentry 연동**: 클라이언트 사이드에서 발생하는 에러를 스택 트레이스와 함께 실시간 수집하여, 사용자가 제보하기 전에 개발자가 먼저 인지하게 한다.
    - **Contextual Logging**: 에러 발생 시 사용자의 브라우저 버전, 마지막 행동(Breadcrumbs)을 함께 기록하여 재현 가능성을 높인다.
- **Graceful Fallback**:
    - 에러 발생 시 단순한 "에러 발생" 문구보다는 "일시적인 오류입니다. [다시 시도하기]" 버튼을 제공하여 사용자 경험 단절을 최소화한다.

## ⚠️ 모순 및 업데이트 (RL Update)
- 모든 곳에 에러 바운더리를 칠 필요는 없다. 데이터와 UI가 1:1로 매칭되는 구조라면 차라리 상위에서 에러를 처리하는 것이 논리적으로 명확할 수 있다.

## 🔗 지식 연결 (Graph)
- Related: [[System_Debugging_Protocol]] , [[React_Testing_Strategy]]
- Foundation: [[System_Protocol_Standard]]
