Elevate your Coding Experience: Coderspace - Unleash the Potential of Real-time Collaboration and Conference Meets! (Actively building π ) π»π₯
- π¬ Conference Meetings: Conduct virtual conference meetings with multiple participants, including audio and video capabilities, screen sharing, and chat functionality. π€π₯π₯οΈπ¬
- π€ Pair Programming: Collaborate with other developers in real-time, allowing simultaneous code editing, chat, and audio communication. π₯π»π¬π€
- π Code Sync: Enable synchronized code editing in real-time, allowing all participants to see and interact with code changes as they happen. ππ»
- π Live Whiteboard: Facilitate brainstorming and visual explanations through a shared whiteboard where participants can draw, write, and annotate. ππ¨
- β Raise Hand: Participants can raise their hand to indicate that they have a question or need assistance, triggering a visual notification for others.
- Frontend: React, Redux
- Backend: Node.js, Express.js, MongoDB
- Real-time Communication: WebRTC, Socket.IO
- Authentication: Twilio API for OTP (One-Time Password) authentication
- Deployment: Docker, AWS (Amazon Web Services), or any preferred hosting service
To set up Coderspace locally for development and testing, follow these steps:
- This documentation will guide you through the process of setting up Coderspace locally on your machine. By following these steps, you will be able to run the application, and integrate Twilio for OTP service.
Prerequisites:
- Node.js (v14.x or higher) and npm (v6.x or higher) installed on your machine
- MongoDB installed locally (v4.x or higher)
- Twilio account with Account SID, Auth Token, and a registered phone number
Step 1: Clone the Repository
- Open your terminal or command prompt.
- Change to the directory where you want to clone the repository.
- Run the following command to clone the repository:
Replace
git clone https://github.com/your-username/coderspace.git
your-username
with your actual GitHub username.
Step 2: Install Dependencies on frontend and backend:
- Navigate to the project's root directory:
cd coderspace
- Run the following command to install the project dependencies in both frontend and backend directory:
npm install
Step 3: Configure Twilio for OTP Service
- Sign up for a Twilio account at https://www.twilio.com and obtain your Account SID, Auth Token, and a registered phone number.
- Open the
.env
file in the project's root directory. - Set the
SMS_SID
variable to your Twilio Account SID. - Set the
SMS_AUTH_TOKEN
variable to your Twilio Auth Token. - Set the
SMS_FROM_NUMBER
variable to your registered Twilio phone number.
Step 4: Set Up Environment Variables
- In the project's root directory, locate the
.env.example
file. - Create a new file named
.env
in both backend and frontend directory and copy the contents of.env.example
and.env.dev
respectively. - Modify the values in the
.env
file in backend directory to match your local configuration. Make sure to set the necessary variables, such as database connection information, Twilio Account SID, Auth Token, and Twilio phone number. - Set the SECRETS in the
.env
file bycrypto.randomBytes(length).toString('hex')
. It is a Node.js method that generates a random string of bytes with the specified length and converts it to a hexadecimal string representation which you can use to generate strong SECRET VARIABLES. You can set secrets to be any random generated string.
Step 5: Start MongoDB
- Open a new terminal or command prompt window.
- Start the MongoDB service by running the following command:
mongod
Step 6: Run the Application
- In the original terminal or command prompt window, navigate to the project's root directory if you're not already there.
- Run the following command to start the application:
This will start the server and the client development server.
cd /frontend npm start cd ../backend npm run dev
Step 7: Access the Application
- Open your web browser and visit
http://localhost:3000
to access the Coderspace application.
Congratulations! You have successfully set up Coderspaces locally, including the integration of Twilio for OTP service and now it's a time to collaborate ..
Note: Remember to keep your local environment variables and configurations secure and do not commit them to any version control system.
Step 8: Collaborate:
Contributions to the collaboration feature in our Coderspace project are welcome! If you would like to contribute, please follow these guidelines:
- Fork the repository and create a new branch for your feature or bug fix.
- Commit your changes with descriptive commit messages.
- Push your changes to your forked repository.
- Submit a pull request detailing your changes and explaining the purpose and benefits of the contribution.
We appreciate your contributions to making Coderspace an even better coding community app!