🔨[refactor] Woori CodeShare 프로젝트 리팩토링

[namsh1125]

개요

현재 woori-codeshare 프로젝트는 여러 구조적 문제로 인해 유지보수성과 개발 효율성이 저하되고 있다. 이를 해결하기 위한 종합적인 리팩토링이 필요하다.

주요 문제점 분석

1. 타입 안정성 부족 (JS → TS 마이그레이션 필요)

문제점

• WebSocket 이벤트 타입 보장 불가: JSON.parse(message.body) 결과의 타입 안정성 부족
• API 응답 타입 검증 부재: 런타임에서만 데이터 구조 오류 발견
• 컴파일 타임 에러 검출 불가: 속성명 오타, 잘못된 함수 호출 등

2. Props Drilling 문제

문제점

• 과도한 Props 전달: 컴포넌트 계층을 통해 여러 개별 props 전달
• 코드 가독성 저하: props 개수 증가로 인한 함수 시그니처 복잡화
• 유지보수성 악화: props 추가/삭제 시 여러 컴포넌트 수정 필요

3. 알림 시스템 일관성 부족

문제점

• Alert Context와 react-toastify 혼재: 두 가지 알림 시스템 동시 사용
• 일관성 없는 UX: 알림 스타일과 동작이 통일되지 않음
• 코드 중복: 유사한 알림 로직의 중복 구현

4. WebSocket 구독 로직 분산

문제점

• 컴포넌트별 개별 구독: 각 컴포넌트에서 독립적으로 WebSocket 구독
• 중복 구독 위험: 같은 토픽을 여러 곳에서 구독할 가능성
• 상태 동기화 어려움: WebSocket 이벤트 처리 로직이 분산되어 일관성 부족

5. 불필요한 코드

문제점

• 사용되지 않는 코드 존재: room-users-count.js과 같이 사용되지 않는 코드 존재