Home

트러블 슈팅

컴포넌트

TextField

• 초기에는 asprops로 Input과 Textarea를 별개로 렌더링할 수 있도록 구현
• 구현은 했으나 복잡한 타입 로직으로 코드의 가독성이 떨어져 협업 차원에서 적합하지 않다고 판단
• Input, Textarea 컴포넌트는 분리, TextField 네임스페이스로 묶어 활용하는 것으로 최종 구현

ProtectedRoute

• 요구사항에 따라 권한에 따른 페이지 별 리다이렉트 로직 필요성 존재
• 기존에 팀원들이 모두 페이지별로 따로 각 조건에 따른 리다이렉트 로직을 구현하고 있었음
• 권한 확인 시, 매 페이지를 들여다 보거나, 중복된 조건의 로직을 작성하게 되는 등의 문제들을 인식
• Router 파일 한 곳에서 관리할 수 있도록 ProtectedRoute 컴포넌트 구현

커스텀 훅

useRemoveTopPageScroll

• 모바일 뷰포트에서도 최상단 페이지의 스크롤이 여전히 남아 있는 문제가 발생
• 현재의 뷰포트를 감지 (리사이즈 이벤트 포함), 최상단 페이지의 스크롤을 제거할 수 있도록 구현

useIntersection

• 무한 스크롤 등, 특정 요소가 뷰포트 내로 진입했을 때 로직을 트리거할 수 있도록 IntersectionObserver API 활용
• 사용되는 곳이 많아 매번 로직을 일일이 구현하기가 번거로움
• 반복되는 로직을 추상화하여 커스텀 훅으로 만듬으로써 재사용성을 높임