📝 Real-Time Collaborative Notes App

A real-time collaborative notes application built with FastAPI, Socket.IO and Redis for instant updates across connected clients.
Users can create, edit and share notes in real time, with changes instantly synced for all participants in a shared room.

🚀 Features

• Real-time Collaboration — Multiple users can edit notes simultaneously with instant updates via Socket.IO.
• Persistent Storage — Notes are stored in Redis for quick retrieval and low latency.
• Room-based Editing — Users can join specific rooms to collaborate on different notes.
• Private/Public Rooms — Users can create rooms which can only be accessed through passcodes (private) or they can be public.
• REST + WebSocket Hybrid — FastAPI serves the REST API for CRUD operations, while Socket.IO handles live updates.
• Scalable Architecture — Designed to run in distributed environments with Redis Pub/Sub as the message broker.

🛠 Tech Stack

• Backend Language: Python
• Backend Framework: FastAPI
• Frontend: HTML, CSS, JavaScript
• WebSocket Communication: python-socketio (Socket.IO for Python)
• Message Broker / Cache: Redis
• ASGI Server: Uvicorn
• Docker: Docker
• Docker Compose: Docker Compose
• Minikube: Minikube
• Kubernetes: Kubernetes

📂 Project Structure

collaborative-notes/
├── docker-compose.yml
├── Dockerfile
├── k8s/
│   ├── notes-app-deployment.yaml
│   ├── notes-app-service.yaml
│   ├── redis-deployment.yaml
│   └── redis-service.yaml
├── main.py
├── models.py
├── README.md
├── requirements.txt
├── screenshots/
│   ├── accessing-private-note.png
│   ├── collaborative-editing-private-note-1.png
│   ├── collaborative-editing-private-note-2.png
│   ├── collaborative-editing-private-note-3.png
│   ├── collaborative-editing-public-note-1.png
│   ├── collaborative-editing-public-note-2.png
│   ├── collaborative-editing-public-note-3.png
│   ├── deleted-private-note.png
│   ├── deleted-public-note.png
│   ├── deletion-private-note.png
│   ├── deletion-public-note.png
│   ├── initial-screen.png
│   ├── private-note-creation.png
│   ├── public-note-creation.png
│   └── wrong-passcode.png
└── static/
    ├── index.html
    ├── script.js
    └── style.css

🔌 API Endpoints

Method	Endpoint	Description
GET	/api/notes	Get all notes
GET	/api/notes/{id}	Get a specific note
POST	/api/notes	Create a new note
POST	/api/notes/{id}/unlock	Unlocks a passcode-locked note
DELETE	/api/notes/{id}	Delete a note

🔄 Real-Time Events

Event Name	Direction	Description
join_note	Client ↔ Server	Opens a specific note
leave_note	Client ↔ Server	Closes a specific note
apply_patch	Client ↔ Server	Broadcast note content changes in real time
update_title	Client ↔ Server	Broadcast note title changes in real time
cursor_move	Client ↔ Server	Broadcast active users' cursor positioning in real time

⚡ Local Installation & Setup

1️⃣ Clone the repository

git clone https://github.com/deluxe-wizard-seven/collaborative-notes.git
cd collaborative-notes

2️⃣ Create a virtual environment

python -m venv .venv
source .venv/bin/activate   # Mac/Linux
.venv\Scripts\activate      # Windows

3️⃣ Install dependencies

pip install -r requirements.txt

4️⃣ Start Redis using Docker

For local development using redis-stack, redis-server is used in production level:

docker run -d --name redis-stack -p 6379:6379 -p 8001:8001 redis/redis-stack:latest

5️⃣ Run the application

python main.py

📦 Deployment

• Local Development:

  • Start the redis-server/redis-stack in your localhost.
  • Run python main.py.

• Dockerized Setup:

  • A Dockerfile is provided to containerize the FastAPI + Socket.IO backend.

  • A docker-compose.yml is included to orchestrate services (FastAPI app, Redis and any additional dependencies).

  • Bring everything up with:

    docker compose up --build

• Kubernetes Setup:

  • Using minikube the project can be deployed (locally).
    • Create image - docker build -t notes-app:latest .
    • Start minikube service - minikube start
    • Load image in minikube - minikube image load notes-app:latest
    • Apply the k8s config - kubectl apply -f ./k8s
    • Tracking changes - kubectl get deployments and kubectl get services
    • Fetch Cluster IP using - minikube ip and the app will be hosted on http://<cluster ip address>:31000/
    • Clean resources - kubectl delete deployments redis notes-app and kubectl delete services redis notes-svc
    • Stop minikube service - minikube stop
    • Remove image - docker rmi -f notes-app:latest

• Production Deployment:

  • Push the Docker images to a registry (e.g., Docker Hub, AWS ECR or GCP Artifact Registry).
  • Deploy via AWS ECS/Fargate, GCP Cloud Run, or Kubernetes.
  • Ensure Redis runs either as a managed service (AWS ElastiCache, GCP Memorystore) or as part of your container stack.

📷 Screenshots

1. Initial Opening (When no notes are present)
2. Creating Private Note
3. Creating Public Note
4. Collaborative Editing In Public Note
5. Entering Incorrect Passcode
6. Accessing Private Note
7. Collaborative Editing In Private Note
8. Deleting Public Note
9. Deleting Private Note