# sulfurcodes/sulfurdocs-realtime-document-editor architecture

> Architecture diagram of the GitHub repository sulfurcodes/sulfurdocs-realtime-document-editor, generated by GitDiagram from its file tree, README and a sample of source files (last updated 2026-09-27). It is an AI-made overview: check details against the source.

- Interactive diagram: https://gitdiagram.com/sulfurcodes/sulfurdocs-realtime-document-editor
- Repository: https://github.com/sulfurcodes/sulfurdocs-realtime-document-editor

## Overview

SulfurDocs is a cross-platform collaborative document editor. Users authenticate, create or open private documents, edit rich text, and have edits broadcast live and saved automatically. The backend’s REST routes handle account and document operations; its Socket.IO server authenticates connections, checks document ownership, relays deltas, and persists saves. The tree omits Flutter’s lib/ sources, so frontend components use the existing frontend/ path and their links rely on README documentation rather than sampled client code.

Main entry points: [`frontend`](https://github.com/sulfurcodes/sulfurdocs-realtime-document-editor/tree/main/frontend) (Flutter app), [`backend/src/socket/socketServer.js`](https://github.com/sulfurcodes/sulfurdocs-realtime-document-editor/blob/main/backend/src/socket/socketServer.js) (Socket server), [`backend/src/routes/authRoutes.js`](https://github.com/sulfurcodes/sulfurdocs-realtime-document-editor/blob/main/backend/src/routes/authRoutes.js) (Auth routes), [`backend/src/routes/documentRoutes.js`](https://github.com/sulfurcodes/sulfurdocs-realtime-document-editor/blob/main/backend/src/routes/documentRoutes.js) (Document routes)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_client["Flutter client"]
  node_flutter["Flutter app"]
  node_editor["Rich text editor"]
  node_clientstate["Client state"]
end

subgraph group_api["REST API"]
  node_authroutes["Auth routes<br/>[authRoutes.js]"]
  node_docroutes["Document routes<br/>[documentRoutes.js]"]
  node_app["Express app<br/>[app.js]"]
  node_authmiddleware["JWT middleware<br/>[authMiddleware.js]"]
  node_authcontroller["Account operations<br/>[authController.js]"]
  node_doccontroller["Document operations"]
end

subgraph group_realtime["Live collaboration"]
  node_server["HTTP server<br/>[server.js]"]
  node_socket["Socket server<br/>[socketServer.js]"]
end

subgraph group_storage["Persistence"]
  node_usermodel["User model<br/>[user.js]"]
  node_documentmodel["Document model<br/>[document.js]"]
  node_dbconfig["DB connection<br/>[database.js]"]
end

node_user(("User"))
node_mongodb[("MongoDB")]

node_user -->|"uses"| node_flutter
node_flutter -->|"updates"| node_clientstate
node_flutter -->|"requests account API"| node_authroutes
node_flutter -->|"requests documents"| node_docroutes
node_flutter -->|"opens and edits"| node_editor
node_editor -->|"sends deltas"| node_socket
node_socket -->|"broadcasts changes"| node_editor
node_editor -->|"sends autosaves"| node_socket
node_app -->|"mounts"| node_authroutes
node_app -->|"mounts"| node_docroutes
node_authroutes -->|"guards profile route"| node_authmiddleware
node_docroutes -->|"guards document routes"| node_authmiddleware
node_authroutes -->|"dispatches account actions"| node_authcontroller
node_docroutes -->|"dispatches document actions"| node_doccontroller
node_authcontroller -->|"reads and creates"| node_usermodel
node_doccontroller -->|"reads and writes"| node_documentmodel
node_server -->|"serves HTTP"| node_app
node_server -->|"initializes"| node_socket
node_server -->|"connects database"| node_dbconfig
node_dbconfig -->|"connects"| node_mongodb
node_usermodel -->|"persists users"| node_mongodb
node_documentmodel -->|"persists documents"| node_mongodb
node_socket -->|"checks ownership and saves"| node_documentmodel

click node_flutter "https://github.com/sulfurcodes/sulfurdocs-realtime-document-editor/tree/main/frontend"
click node_editor "https://github.com/sulfurcodes/sulfurdocs-realtime-document-editor/tree/main/frontend"
click node_clientstate "https://github.com/sulfurcodes/sulfurdocs-realtime-document-editor/tree/main/frontend"
click node_authroutes "https://github.com/sulfurcodes/sulfurdocs-realtime-document-editor/blob/main/backend/src/routes/authRoutes.js"
click node_docroutes "https://github.com/sulfurcodes/sulfurdocs-realtime-document-editor/blob/main/backend/src/routes/documentRoutes.js"
click node_app "https://github.com/sulfurcodes/sulfurdocs-realtime-document-editor/blob/main/backend/src/app.js"
click node_authmiddleware "https://github.com/sulfurcodes/sulfurdocs-realtime-document-editor/blob/main/backend/src/middlewares/authMiddleware.js"
click node_authcontroller "https://github.com/sulfurcodes/sulfurdocs-realtime-document-editor/blob/main/backend/src/controllers/authController.js"
click node_doccontroller "https://github.com/sulfurcodes/sulfurdocs-realtime-document-editor/blob/main/backend/src/controllers/documentController.js"
click node_server "https://github.com/sulfurcodes/sulfurdocs-realtime-document-editor/blob/main/backend/src/server.js"
click node_socket "https://github.com/sulfurcodes/sulfurdocs-realtime-document-editor/blob/main/backend/src/socket/socketServer.js"
click node_usermodel "https://github.com/sulfurcodes/sulfurdocs-realtime-document-editor/blob/main/backend/src/models/user.js"
click node_documentmodel "https://github.com/sulfurcodes/sulfurdocs-realtime-document-editor/blob/main/backend/src/models/document.js"
click node_dbconfig "https://github.com/sulfurcodes/sulfurdocs-realtime-document-editor/blob/main/backend/src/config/database.js"

classDef toneNeutral fill:#f8fafc,stroke:#334155,stroke-width:1.5px,color:#0f172a
classDef toneBlue fill:#dbeafe,stroke:#2563eb,stroke-width:1.5px,color:#172554
classDef toneAmber fill:#fef3c7,stroke:#d97706,stroke-width:1.5px,color:#78350f
classDef toneMint fill:#dcfce7,stroke:#16a34a,stroke-width:1.5px,color:#14532d
classDef toneRose fill:#ffe4e6,stroke:#e11d48,stroke-width:1.5px,color:#881337
classDef toneIndigo fill:#e0e7ff,stroke:#4f46e5,stroke-width:1.5px,color:#312e81
classDef toneTeal fill:#ccfbf1,stroke:#0f766e,stroke-width:1.5px,color:#134e4a
class node_flutter,node_editor,node_clientstate,node_user toneBlue
class node_authroutes,node_docroutes,node_app,node_authmiddleware,node_authcontroller,node_doccontroller,node_mongodb toneAmber
class node_server,node_socket toneMint
class node_usermodel,node_documentmodel,node_dbconfig toneRose
```

## Components

### Flutter client

- [Flutter app](https://github.com/sulfurcodes/sulfurdocs-realtime-document-editor/tree/main/frontend): `frontend`
- [Rich text editor](https://github.com/sulfurcodes/sulfurdocs-realtime-document-editor/tree/main/frontend): `frontend`
- [Client state](https://github.com/sulfurcodes/sulfurdocs-realtime-document-editor/tree/main/frontend): `frontend`

### REST API

- [Auth routes](https://github.com/sulfurcodes/sulfurdocs-realtime-document-editor/blob/main/backend/src/routes/authRoutes.js): `backend/src/routes/authRoutes.js`
- [Document routes](https://github.com/sulfurcodes/sulfurdocs-realtime-document-editor/blob/main/backend/src/routes/documentRoutes.js): `backend/src/routes/documentRoutes.js`
- [Express app](https://github.com/sulfurcodes/sulfurdocs-realtime-document-editor/blob/main/backend/src/app.js): `backend/src/app.js`
- [JWT middleware](https://github.com/sulfurcodes/sulfurdocs-realtime-document-editor/blob/main/backend/src/middlewares/authMiddleware.js): `backend/src/middlewares/authMiddleware.js`
- [Account operations](https://github.com/sulfurcodes/sulfurdocs-realtime-document-editor/blob/main/backend/src/controllers/authController.js): `backend/src/controllers/authController.js`
- [Document operations](https://github.com/sulfurcodes/sulfurdocs-realtime-document-editor/blob/main/backend/src/controllers/documentController.js): `backend/src/controllers/documentController.js`

### Live collaboration

- [HTTP server](https://github.com/sulfurcodes/sulfurdocs-realtime-document-editor/blob/main/backend/src/server.js): `backend/src/server.js`
- [Socket server](https://github.com/sulfurcodes/sulfurdocs-realtime-document-editor/blob/main/backend/src/socket/socketServer.js): `backend/src/socket/socketServer.js`

### Persistence

- [User model](https://github.com/sulfurcodes/sulfurdocs-realtime-document-editor/blob/main/backend/src/models/user.js): `backend/src/models/user.js`
- [Document model](https://github.com/sulfurcodes/sulfurdocs-realtime-document-editor/blob/main/backend/src/models/document.js): `backend/src/models/document.js`
- [DB connection](https://github.com/sulfurcodes/sulfurdocs-realtime-document-editor/blob/main/backend/src/config/database.js): `backend/src/config/database.js`

### Other components

- **User**
- **MongoDB**

## Connections

- User → Flutter app: uses
- Flutter app → Client state: updates
- Flutter app → Auth routes: requests account API
- Flutter app → Document routes: requests documents
- Flutter app → Rich text editor: opens and edits
- Rich text editor → Socket server: sends deltas
- Socket server → Rich text editor: broadcasts changes
- Rich text editor → Socket server: sends autosaves
- Express app → Auth routes: mounts
- Express app → Document routes: mounts
- Auth routes → JWT middleware: guards profile route
- Document routes → JWT middleware: guards document routes
- Auth routes → Account operations: dispatches account actions
- Document routes → Document operations: dispatches document actions
- Account operations → User model: reads and creates
- Document operations → Document model: reads and writes
- HTTP server → Express app: serves HTTP
- HTTP server → Socket server: initializes
- HTTP server → DB connection: connects database
- DB connection → MongoDB: connects
- User model → MongoDB: persists users
- Document model → MongoDB: persists documents
- Socket server → Document model: checks ownership and saves