Code Collaborator 👨‍💻 💬 🔀

Real time peer programming platform to solve coding problems in multiple supported languages, edit fellow programmers' code, chat and share code through WhatsApp.

Features ✨

• Light/dark mode toggle
• Secure Login/Signup system using auth0
• Secured password-based rooms for peers to collaborate
• Users can create/join multiple rooms
• Real time code editing, running with periodic auto save feature
• Support for multiple programming languages, font size and code editor theme, along with error and output to debug the code.
• Built in real-time chat along with timestamps, dedicated to a room
• Code sharing through WhatsApp using Twilio

Tech Stack 💻

Frontend 📄

• ReactJS
• NextJS
• Chakra-UI

Backend 👷

• NodeJS
• SequelizeJS

Database 🗃️

• CockroachDB

Others

• Authentication - auth0
• Code sharing - Twilio
• Socket - Socket.IO

Demo 🎬

Find a short demo of the running project here

Installation ⬇️

1. Clone the project

  git clone https://github.com/SubhradeepSS/code_collaborator

2. Create accounts in CockroachDB, Twilio and auth0

3. Navigate to the server folder from project root by

cd server

• create a config.js file and enter your credentials

  module.exports = {
      accountSid: "<YOUR TWILIO ACCOUNT SID>",
      authToken: "<YOUR TWILIO AUTHTOKEN>",
      username: "<YOUR COCKROACHDB USERNAME>",
      password: "<YOUR COCKROACHDB CLUSTER PASSWORD>",
      host: "<YOUR COCKROACHDB HOST>",
      port: <PORT NO FOR COCKROACHDB>,
      database: "<YOUR COCKROACHDB CLUSTER NAME>.<COCKROACHDB DATABASE NAME>",
      cert_path: "<LOCAL PATH FOR CERTIFICATE DOWNLOADED FROM COCKROACHDB>"
  }

• Install all npm packages

  npm i

• Run local dev server

  npm run dev

4. Navigate to socket folder from root of project by

cd socket

• Install packages

  npm i

• Run dev server

  npm build
  npm run dev2

5. Navigate to frontend from root of project by

cd frontend

• Install packages

  npm i

• Run local server

  npm build
  npm run dev

6. Open http://localhost:3000/ and the project will open

Future scope 📈

• Add audio chat
• Collaborative drawing board like jamboard
• Sharing code through other platforms like Slack, Discord etc.
• Integrating better code formatting and styling in code editor
• Convert website to Desktop app
• Adding unit and integration tests

License 📄

MIT

Contributing 👩‍💻

Any contributions made to the project are greatly appreciated.

1. Fork the Project
2. Create your Feature Branch (git checkout -b feature/AmazingFeature)
3. Commit your Changes (git commit -m 'Add some AmazingFeature)
4. Push to the Branch (git push origin feature/AmazingFeature)
5. Open a Pull Request