변경 권장 이슈

[ftery0]

중첩 라우팅을 하는데 Outlet을 사용하면 useExceptionHandling이렇게 할필요 없을거 같아 효율적으로 보입니다.
에러를 능동적이고 사용자입장에서 더 좋게 만들기 위해서 ErrorBoundary를 사용하는게 어떨까요?

React.FC를 사용하지 말아야 하는 이유

1. 암묵적으로 children props를 포함

• React.FC는 기본적으로 children을 props에 포함합니다.
• 이로 인해 의도치 않게 컴포넌트가 children을 받을 수 있다고 인식하게 됩니다.

2. Generic 사용이 제한적

• 고차 컴포넌트(HOC)나 generic 컴포넌트를 만들 때 문제가 생길 수 있습니다.

3. 명시적으로 반환 타입을 작성해야함

• React 컴포넌트는 일반적으로 JSX 또는 null을 반환하기 때문에, 굳이 React.FC를 통해 반환 타입을 지정할 필요가 없습니다.
• TypeScript는 JSX 반환을 자동으로 추론합니다.

같은 hook을 사용하는경우에는 분리하는게 좋아보입니다.

jsx에 너무 많은 css in js 컴퍼넌트는 시간을 느리게 하는 주요 원인이 될수 있습니다.

[kyumin7487]

첫 번째로, Outlet 사용에 대한 피드백 감사드립니다. 현재 회원가입 페이지에 중첩 라우팅이 포함되어 있지만, 회원가입 기능이 필요 없어져 임시로 비활성화한 상태입니다. 추후 Admin 개발이나 회원가입 기능이 다시 필요할 때, 그때 Outlet을 적용하도록 리팩토링할 계획입니다.

두 번째로, ErrorBoundary에 대해 말씀드리자면, 기존의 errorHandler와 함께 사용해보겠습니다. ErrorBoundary는 렌더링 중 UI를 보호하는 용도로 활용되는 것으로 이해하고 있습니다. 현재는 사용자가 많지 않아 UI 보호보다는 API 응답 처리에 더 집중하고 있어, ErrorBoundary보다는 errorHandler를 커스터마이즈하여 사용하고 있습니다. errorHandler에서 메시지 분기 처리가 잘 되어 있고, 웹 렌더링 중에 문제가 발생할 경우 fallback UI를 고려해 두 가지를 적절히 결합하여 사용할 예정입니다.

마지막으로, React.FC에 대해 말씀드리자면, V2에서는 CkMember 컴포넌트에서 자식 요소(children)를 받지 않지만, React.FC를 사용하면 나중에 자식 요소를 받을 수 있는 준비가 자동으로 되어 있어 장점이 있습니다. 이 점을 반영하여 사용한 것 같으니, V3에 디자인 패턴에 맞게 코드를 수정하도록 하겠습니다.