유저를 관리하기 위한 웹소켓 Room 추가

[yewonJin]

🔖 연관된 이슈

• closes 유저를 관리하기 위한 웹소켓 Room 추가 #206

📂 작업 내용

• Client 룸 생성하기
• 유저 식별을 위한 랜덤 색상 및 clientId 생성 (로컬스토리지 이용)
• 에디터 접속 인원을 노드와 에디터에 보여주기

📑 참고 자료 & 스크린샷 (선택)

Recording.19.mp4

📢 리뷰 요구사항 (선택)

일단 디자인은 최대한 간단하게 했습니다. (추후 수정을 위해)
궁금한 게 하나 있는데, 자신의 접속 현황은 표시를 안하는 게 자연스러울까요??

추후 수정해야 할 사항

1. 에디터(content)에서 클라이언트를 일관되게 보여주기 (에디터 마다 다른 웹 소켓 Room에 접속해서)
2. 중복 탭 문제 -> 클라이언트 id가 같은 접속 현황이 여러 개 보여지게 됨
3. 이미 접속중인 clientId 가 있으면 이전 연결을 끊고, 새로운 연결을 해야 할 거 같습니다! (새로고침하면 flow-room에 다시 연결돼서 컴포넌트 key 문제가 생깁니다.

[djk01281]

고생하셨습니다!! 👏🏻👏🏻👏🏻 사용자는 모두 표시되어도 괜찮을 것 같습니다..!