1198791505
Real-time collaboration through consumer-provided transport and presence interfaces. Also includes a sample backend app.
47 lines
1.2 KiB
Markdown
47 lines
1.2 KiB
Markdown
# Flask Collaboration Example
|
|
|
|
A minimal Flask server demonstrating ribbit's collaboration features:
|
|
real-time sync, presence, locking, and revisions.
|
|
|
|
## Setup
|
|
|
|
```sh
|
|
pip install flask flask-sock
|
|
```
|
|
|
|
Copy (or symlink) the ribbit dist into the static directory:
|
|
|
|
```sh
|
|
ln -s /path/to/ribbit/dist/ribbit static/ribbit
|
|
```
|
|
|
|
## Run
|
|
|
|
```sh
|
|
python server.py
|
|
```
|
|
|
|
Open http://localhost:5000 in multiple browser tabs. Edits in one tab
|
|
appear in the others in real time.
|
|
|
|
## What it demonstrates
|
|
|
|
- **Real-time sync**: WebSocket relays document updates between clients
|
|
- **Presence**: colored badges show connected users and their status
|
|
- **Revisions**: save button creates named revisions, click to restore
|
|
- **Locking**: (available via console: `editor.lockForEditing()`)
|
|
- **Source mode**: entering markdown mode pauses sync, shows remote change count
|
|
|
|
## Architecture
|
|
|
|
```
|
|
Browser A ──┐
|
|
├── WebSocket ──→ Flask server ──→ WebSocket ──→ Browser B
|
|
Browser C ──┘ │
|
|
├── /api/revisions (REST)
|
|
└── /api/lock (REST)
|
|
```
|
|
|
|
The server is ~160 lines. In production you'd replace the in-memory
|
|
stores with a database and add authentication.
|