Socket 서버가 연결이 되면 데이터베이스에 있는 그룹 스키마의 데이터를 룸스키마로 동기화 해주는 코드를 추가하고 클라이언트에서 채팅 네임스페이스로 들어온다면 룸 스키마의 데이터인 룸 리스트를 보내주려고 하였으㉯,(소켓 이벤트) 룸 리스트를 모두 클라이언트로 보내준다면, 특정 스터디 그룹을 선택했을 때 그 그룹의 objectId값과 일치하는 룸 데이터가져오지 못해서 특정 그룹 페이지 안에서 채팅을 누르면 api 서버로 요청을 보내 룸리스트 데이터를 가져오도록 로직을 변경하였습니다.


[before]

socket.on~~

[after]

Get/group/rooms api서버로 요청 보냄


**useEffect**는 React에서 사용되는 훅 중 하나로, 비동기적으로 작동하는 기능을 수행합니다.

**useEffect**는 주로 컴포넌트가 렌더링될 때나 업데이트될 때 비동기 작업을 수행하기 위해 사용됩니다.

useEffect 내에서 비동기 작업을 수행할 때 주로 콜백 함수나 **async/await**를 활용합니다.

예를 들어, API 요청, 데이터 가져오기, 컴포넌트 상태의 변경, 라이프사이클 이벤트 등을 처리할 때 **useEffect**를 사용하여 비동기 작업을 관리할 수 있습니다.

useEffect 내에서 여러 번 **setState**를 호출하면 각각의 **setState**가 비동기적으로 처리되므로, URL이 navigate되는 시점은 각 **setState**가 완료될 때가 아닌, React 업데이트 사이클 내에서 일반적으로 동시에 일어나지 않을 것입니다.