Troubleshooting

진행하 프로젝트에서 Supabase의 Realtim 기능을 활용해 실시간 채팅 기능을 구현했다.

Tailwind CSS를 Next.js 모노레포 환경에서 개발하던 중, dev서버를 실행하고 나서 css값을 바꿔보니 같은 Tailwind 클래스인데 위치에 따라 변경 반응 차이가 나타났다. 📌 문제 현상 ✅ 앱 내부 컴포넌트 수정 시 → 클래스 변경 시 즉시

사용자 정보를 zstand에서 설정한 캐시에 저장된 유저 정보 값을 연결 하는 리펙토링 작업인데수정하는 단계에서 또 realtime 이 제대로 작동하지 않는 문제가 생겼다.

임시 방편으로 setTimeout을 사용하였다채팅방에서 뒤로 갔다가 다시 들어오면 생기는 "WebSocket is closed before the connection is established" 오류인데 ..

앞서 realtime 구조를 다시 확립하였는데 이 과정 후 UI에 메시지를 전송하고 랜더 되는 과정에 3초 정도 지연되어 표시되는 문제가 발생했다.

배포를 vercel로 진행하다가 겪은 에러에 대한 문서이다. 이 문제 말고도 여러문제가 있었지만 중요한 순서대로 문서를 작성해 보았다.