FRONTEND·중요도 6·2026. 05. 27.·Dev.to

TipTap + Yjs + Hocuspocus saves content, but other users only see updates after a page refresh

── KO ──────────────────

TipTap, Yjs, Hocuspocus를 이용한 실시간 협업 문제에 대한 질문.

TipTap 편집기를 사용하는 Next.js 앱에서 Yjs와 Hocuspocus를 통해 실시간 협업을 구현하려고 합니다. 사용자 A가 문서의 섹션을 수정하면 데이터베이스에 저장되지만, 사용자 B는 페이지를 새로 고침해야 업데이트를 확인할 수 있습니다. Hocuspocus 서버를 로컬에서 실행하고 WebSocket URL을 추가했으나, 협업 모드에서 Yjs 상태가 비어있거나 오래될 경우 문서가 비어 있습니다. 기존 TipTap JSON을 Y.Doc으로 변환해야 하는지, 저장 방식 등 여러 질문이 있습니다.

── EN ──────────────────

Questions about real-time collaboration issues using TipTap, Yjs, and Hocuspocus.

I am trying to implement real-time collaboration in a Next.js app using the TipTap editor with Yjs and Hocuspocus. While User A's edits save correctly to the database, User B can only see updates after refreshing the page. After starting the Hocuspocus server and connecting the frontend, I found that if the Yjs state is out-of-date, the document can appear blank. I have several questions about initializing the editor, converting existing JSON, and ensuring both users are connected and receiving live updates.

원문 보기 →목록으로