Collaborative editing

Introduction

This example shows how you can use Tiptap to let multiple users collaborate in the same document in real-time.

It connects all clients to a WebSocket server and merges changes to the document with the power of Y.js. If you want to learn more about collaborative text editing, check out our guide on collaborative editing.

Example

Shared Document

Be nice! The content of this editor is shared with other users from the Internet.

Backend

In case you’re wondering what kind of sorcery you need on the server to achieve this, here is the whole backend code for the demo:

import { Server } from '@hocuspocus/server'

const server = Server.configure({
  port: 80,
})

server.listen()