A collaborative text editor application built with React, ReactQuill, Socket.IO, and Express. This application allows multiple users to edit documents in real-time.
- Real-time collaborative text editing
- Unique URLs for each document
- List of active documents
- Seamless synchronization of text changes
- React
- ReactQuill
- Socket.IO
- Express
- Node.js
- uuid (for generating unique IDs)
- CORS (for handling cross-origin requests)
- Clone the repository
git clone https://github.com/yourusername/collaborative-text-editor.git cd collaborative-text-editor
- Install server dependencies
cd server npm install
- Install client dependencies
cd ../client npm install
-
Navigate to the server dir and start the server
cd server node server.js
The server will run on http://localhost:3000
-
Navigate to the client dir and start the client
cd ../client npm run dev
The client will run on http://localhost:5173
- You will see a list of active documents at http://localhost:5173/. Click on any document to join the editor.
- Open your browser and navigate to http://localhost:5173/editor to create a new document.
- Start typing in the editor. Changes will be synchronized in real-time for all users in the same document.
- Implement database persistence with MongoDB
- Add user authentication
- Improve the UI/UX