🧑‍💻 Collab-Code

Collab-Code is a real-time collaborative code editor built using React, Express.js, Socket.io, and CodeMirror. It allows multiple users to write and edit code together in real-time with live chat, room-based collaboration, and a clean UI.

🚀 Features

• 🔄 Real-Time Code Sharing – Collaborate live using WebSockets (Socket.io).
• 💬 In-Room Chat – Communicate seamlessly with other users in the same room.
• 🛏️ Multiple Rooms – Isolated editing sessions for different groups.
• 🎨 Responsive UI – Built with Tailwind CSS for a modern and responsive design.
• 🔗 Unique Room URLs – Shareable links to invite collaborators instantly.

---

🌐 Live Demo

👉 Try Collab-Code Live

---

🛠️ Tech Stack

Frontend:

• React.js
• Tailwind CSS

Backend:

• Express.js
• Socket.io

---

📦 Getting Started

1. Clone the repo

git clone https://github.com/Kumaraditya18/Collab-Code.git
cd Collab-Code

2. Install dependencies

• Frontend

cd client
npm install

• Backend

cd server
npm install

3. Run the app locally

In separate terminals:

• Frontend

cd client
npm start

• Backend

cd server
npm run start

Visit http://localhost:3000 in your browser.

---

📁 Folder Structure

Collab-Code/
│
├── client/                # React frontend
│   ├── components/
│   ├── pages/
│   └── App.js
│
├── server/                # Express backend
│   ├── socket/
│   └── index.js
│
└── README.md

---

🔮 Upcoming Enhancements

• 💻 Code execution in multiple languages
• 🗃️ File structure + tabs
• 🔒 Authentication and private rooms
• ⏪ Undo/Redo with version history
• 🌐 Language/theme selection

---

🤝 Contributing

Pull requests are welcome! Feel free to fork the repo and submit improvements or bug fixes.

---

📄 License

This project is licensed under the MIT License.

---

👤 Author

Made with 💻 and ❤️ by Kumar Aditya

---

Let me know if you'd like badges, images, or a walkthrough gif/video added too!