프론트엔드 소켓 리팩토링

[sbyeol3]

💁 설명

• 저번 회의 때 논의했던 것처럼 소켓 관리를 씬과 독립적으로 하도록 리팩토링 진행했습니다.
• socket 디렉토리를 생성하여 각 씬에 필요한 함수들로 분리했습니다. (웹팩 alias 추가)
• 모든 소켓함수에서 각 씬의 현재 타입을 확인하고 해당 씬이 아니면 그냥 리턴합니다.
• 다음 씬을 렌더링할 때 씬 매니저의 현재 씬 타입을 업데이트 합니다. (위 조건문에 필요)
• 소켓함수에서 필요한 오브젝트들은 씬 매니저가 sharedComponents로 갖고 있고, 이것들은 처음에 game.js에서 초기화됩니다.
• Progress bar도 계속 생성하는 것보다는 display로 관리하는 게 더 효율적일 것 같아 씬 매니저에 추가해두고 필요할 때마다 setTime() => hide 해제 후 렌더 => hide 반복합니다.

📑 체크리스트

구현한 목록 체크리스트

• [ ] 기존과 동일하게 정상 작동한다.

🚧 주의 사항

PR을 읽을 때 살펴볼 사항

• 주말 컨디션이 안좋아 작업을 늦게 시작했습니다..

close #188