Home

트러블 슈팅

컴포넌트

TextField

• as props 기반 통합 컴포넌트에서 복잡한 타입 정의와 타입 단언으로 인해 가독성과 타입 안정성이 저하됨
• TextField.Input / TextField.TextArea로 분리하고 공통 UI는 Field 컴포넌트로 추출하여 역할 명확화
• 타입 추론이 명확해지고 컴포넌트 재사용성과 유지보수성이 크게 향상됨

ProtectedRoute

• 반복되는 권한 조건 로직을 ProtectedRoute 컴포넌트로 추상화하여, 조건 선언을 라우터 파일에서 일관되게 관리
• 조건별 모달 및 리다이렉트 처리까지 포함해 페이지 내부 로직을 단순화하고 재사용성 향상
• 향후 라우터 파일 확장을 고려해 도메인 단위 분리 전략도 사전에 구상하여 구조적 확장성에 대비

커스텀 훅

useRemoveTopPageScroll

• 모바일 환경에서 모달 사용 시 스크롤이 남는 문제를 해결하기 위해 디바이스 타입과 조건 기반의 useRemoveTopPageScroll 훅을 구현
• resize 이벤트를 debounce 처리한 useBreakpoint 훅과 조합해 다양한 디바이스 상황에서도 스크롤 상태를 안정적으로 제어
• 스크롤 제어 로직을 재사용 가능한 훅으로 분리하여 페이지/모달/바텀시트 등 다양한 컴포넌트에서 일관된 UX 유지 가능

useIntersection

• 반복되는 IntersectionObserver 로직을 추상화하여 useIntersection 커스텀 훅으로 분리
• callback과 deps만 넘기면 자동 관찰 및 해제가 가능해져 재사용성과 코드 일관성 확보
• 타입 제네릭 및 의존성 처리까지 고려해 다양한 요소에 범용적으로 대응 가능하게 설계