diff --git a/frontend/docker/Dockerfile b/frontend/docker/Dockerfile
index 7962ae9b4..998ac44f3 100644
--- a/frontend/docker/Dockerfile
+++ b/frontend/docker/Dockerfile
@@ -13,15 +13,21 @@ USER node
 WORKDIR /usr/src/app
 
 COPY --chown=node .yarn/plugins .yarn/plugins
+COPY --chown=node .yarn/patches .yarn/patches
 COPY --chown=node .yarn/releases .yarn/releases
 COPY --chown=node .yarnrc.yml .yarnrc.yml
 COPY --chown=node package.json package.json
 COPY --chown=node yarn.lock yarn.lock
 COPY --chown=node backend/package.json backend/
+COPY --chown=node commons commons
 COPY --chown=node frontend frontend
 RUN --mount=type=cache,sharing=locked,uid=1000,gid=1000,target=/tmp/.yarn \
     yarn install --immutable && yarn workspaces focus @hedgedoc/frontend
 
+WORKDIR /usr/src/app/commons
+
+RUN yarn build
+
 WORKDIR /usr/src/app/frontend
 
 RUN rm -rf public/public && \
diff --git a/frontend/package.json b/frontend/package.json
index d4f698a92..b5227ddfc 100644
--- a/frontend/package.json
+++ b/frontend/package.json
@@ -46,9 +46,9 @@
     "@codemirror/theme-one-dark": "6.1.0",
     "@codemirror/view": "6.7.0",
     "@fontsource/source-sans-pro": "4.5.11",
+    "@hedgedoc/commons": "workspace:commons",
     "@hedgedoc/html-to-react": "1.4.5",
     "@hedgedoc/markdown-it-plugins": "1.0.0",
-    "@hedgedoc/realtime": "0.3.0",
     "@mrdrogdrog/optional": "1.0.0",
     "@react-hook/resize-observer": "1.2.6",
     "@redux-devtools/core": "3.13.1",
diff --git a/frontend/src/components/editor-page/editor-pane/hooks/yjs/mock-connection.ts b/frontend/src/components/editor-page/editor-pane/hooks/yjs/mock-connection.ts
index 957a0ae1d..2cd57136a 100644
--- a/frontend/src/components/editor-page/editor-pane/hooks/yjs/mock-connection.ts
+++ b/frontend/src/components/editor-page/editor-pane/hooks/yjs/mock-connection.ts
@@ -4,7 +4,7 @@
  * SPDX-License-Identifier: AGPL-3.0-only
  */
 import { MARKDOWN_CONTENT_CHANNEL_NAME } from './use-markdown-content-y-text'
-import { YDocMessageTransporter } from '@hedgedoc/realtime'
+import { YDocMessageTransporter } from '@hedgedoc/commons'
 import type { Awareness } from 'y-protocols/awareness'
 import type { Doc } from 'yjs'
 
diff --git a/frontend/src/components/editor-page/editor-pane/hooks/yjs/use-insert-note-content-into-y-text-in-mock-mode-effect.ts b/frontend/src/components/editor-page/editor-pane/hooks/yjs/use-insert-note-content-into-y-text-in-mock-mode-effect.ts
index d963c72ca..1da56473f 100644
--- a/frontend/src/components/editor-page/editor-pane/hooks/yjs/use-insert-note-content-into-y-text-in-mock-mode-effect.ts
+++ b/frontend/src/components/editor-page/editor-pane/hooks/yjs/use-insert-note-content-into-y-text-in-mock-mode-effect.ts
@@ -6,7 +6,7 @@
 import { getGlobalState } from '../../../../../redux'
 import { isMockMode } from '../../../../../utils/test-modes'
 import { MockConnection } from './mock-connection'
-import type { YDocMessageTransporter } from '@hedgedoc/realtime'
+import type { YDocMessageTransporter } from '@hedgedoc/commons'
 import { useEffect } from 'react'
 
 /**
diff --git a/frontend/src/components/editor-page/editor-pane/hooks/yjs/use-is-connection-synced.ts b/frontend/src/components/editor-page/editor-pane/hooks/yjs/use-is-connection-synced.ts
index 78b239bb3..82c7ed408 100644
--- a/frontend/src/components/editor-page/editor-pane/hooks/yjs/use-is-connection-synced.ts
+++ b/frontend/src/components/editor-page/editor-pane/hooks/yjs/use-is-connection-synced.ts
@@ -3,7 +3,7 @@
  *
  * SPDX-License-Identifier: AGPL-3.0-only
  */
-import type { YDocMessageTransporter } from '@hedgedoc/realtime'
+import type { YDocMessageTransporter } from '@hedgedoc/commons'
 import { useEffect, useState } from 'react'
 
 /**
@@ -18,9 +18,11 @@ export const useIsConnectionSynced = (connection: YDocMessageTransporter): boole
   useEffect(() => {
     const enableEditor = () => setEditorEnabled(true)
     const disableEditor = () => setEditorEnabled(false)
-    connection.on('synced', enableEditor).on('disconnected', disableEditor)
+    connection.on('synced', enableEditor)
+    connection.on('disconnected', disableEditor)
     return () => {
-      connection.off('synced', enableEditor).off('disconnected', disableEditor)
+      connection.off('synced', enableEditor)
+      connection.off('disconnected', disableEditor)
     }
   }, [connection])
 
diff --git a/frontend/src/components/editor-page/editor-pane/hooks/yjs/use-on-metadata-updated.ts b/frontend/src/components/editor-page/editor-pane/hooks/yjs/use-on-metadata-updated.ts
index c8682be64..0325e4cf5 100644
--- a/frontend/src/components/editor-page/editor-pane/hooks/yjs/use-on-metadata-updated.ts
+++ b/frontend/src/components/editor-page/editor-pane/hooks/yjs/use-on-metadata-updated.ts
@@ -4,8 +4,8 @@
  * SPDX-License-Identifier: AGPL-3.0-only
  */
 import { updateMetadata } from '../../../../../redux/note-details/methods'
-import type { YDocMessageTransporter } from '@hedgedoc/realtime'
-import { MessageType } from '@hedgedoc/realtime'
+import type { YDocMessageTransporter } from '@hedgedoc/commons'
+import { MessageType } from '@hedgedoc/commons'
 import { useCallback, useEffect } from 'react'
 
 /**
@@ -19,9 +19,9 @@ export const useOnMetadataUpdated = (websocketConnection: YDocMessageTransporter
   }, [])
 
   useEffect(() => {
-    websocketConnection.on(MessageType.METADATA_UPDATED, updateMetadataHandler)
+    websocketConnection.on(String(MessageType.METADATA_UPDATED), () => void updateMetadataHandler())
     return () => {
-      websocketConnection.off(MessageType.METADATA_UPDATED, updateMetadataHandler)
+      websocketConnection.off(String(MessageType.METADATA_UPDATED), () => void updateMetadataHandler())
     }
   })
 }
diff --git a/frontend/src/components/editor-page/editor-pane/hooks/yjs/use-on-note-deleted.ts b/frontend/src/components/editor-page/editor-pane/hooks/yjs/use-on-note-deleted.ts
index 52d47d2e7..022512807 100644
--- a/frontend/src/components/editor-page/editor-pane/hooks/yjs/use-on-note-deleted.ts
+++ b/frontend/src/components/editor-page/editor-pane/hooks/yjs/use-on-note-deleted.ts
@@ -6,8 +6,8 @@
 import { useApplicationState } from '../../../../../hooks/common/use-application-state'
 import { Logger } from '../../../../../utils/logger'
 import { useUiNotifications } from '../../../../notifications/ui-notification-boundary'
-import type { YDocMessageTransporter } from '@hedgedoc/realtime'
-import { MessageType } from '@hedgedoc/realtime'
+import type { YDocMessageTransporter } from '@hedgedoc/commons'
+import { MessageType } from '@hedgedoc/commons'
 import { useRouter } from 'next/router'
 import { useCallback, useEffect } from 'react'
 
@@ -35,9 +35,9 @@ export const useOnNoteDeleted = (websocketConnection: YDocMessageTransporter): v
   }, [router, noteTitle, dispatchUiNotification])
 
   useEffect(() => {
-    websocketConnection.on(MessageType.DOCUMENT_DELETED, noteDeletedHandler)
+    websocketConnection.on(String(MessageType.DOCUMENT_DELETED), noteDeletedHandler)
     return () => {
-      websocketConnection.off(MessageType.DOCUMENT_DELETED, noteDeletedHandler)
+      websocketConnection.off(String(MessageType.DOCUMENT_DELETED), noteDeletedHandler)
     }
   })
 }
diff --git a/frontend/src/components/editor-page/editor-pane/hooks/yjs/use-websocket-connection.ts b/frontend/src/components/editor-page/editor-pane/hooks/yjs/use-websocket-connection.ts
index 80c2a80ee..1442f4764 100644
--- a/frontend/src/components/editor-page/editor-pane/hooks/yjs/use-websocket-connection.ts
+++ b/frontend/src/components/editor-page/editor-pane/hooks/yjs/use-websocket-connection.ts
@@ -7,7 +7,7 @@ import { isMockMode } from '../../../../../utils/test-modes'
 import { MockConnection } from './mock-connection'
 import { useWebsocketUrl } from './use-websocket-url'
 import { WebsocketConnection } from './websocket-connection'
-import type { YDocMessageTransporter } from '@hedgedoc/realtime'
+import type { YDocMessageTransporter } from '@hedgedoc/commons'
 import { useEffect, useMemo } from 'react'
 import type { Awareness } from 'y-protocols/awareness'
 import type { Doc } from 'yjs'
diff --git a/frontend/src/components/editor-page/editor-pane/hooks/yjs/websocket-connection.ts b/frontend/src/components/editor-page/editor-pane/hooks/yjs/websocket-connection.ts
index 4cfacf045..ec6e6cfa1 100644
--- a/frontend/src/components/editor-page/editor-pane/hooks/yjs/websocket-connection.ts
+++ b/frontend/src/components/editor-page/editor-pane/hooks/yjs/websocket-connection.ts
@@ -8,7 +8,7 @@ import {
   encodeCompleteAwarenessStateRequestMessage,
   encodeDocumentUpdateMessage,
   WebsocketTransporter
-} from '@hedgedoc/realtime'
+} from '@hedgedoc/commons'
 import WebSocket from 'isomorphic-ws'
 import type { Awareness } from 'y-protocols/awareness'
 import type { Doc } from 'yjs'