diff --git a/README.md b/README.md index 7167566..7836338 100644 --- a/README.md +++ b/README.md @@ -1,42 +1,69 @@ +# Real-Time Code Editor with Collaborative Chat + Welcome to our Real-Time Code Editor with Collaborative Chat web application! This project allows users to code in real-time with their collaborators while simultaneously communicating through a dedicated chat feature. Whether you're working on a coding project, debugging together, or simply learning to code with friends, this application provides a seamless collaborative experience. -Features -Real-Time Code Editing: See changes made by collaborators in real-time. -Code Syntax Highlighting: Enjoy syntax highlighting for various programming languages for better readability. -Collaborative Chat: Communicate with team members in a dedicated chat window. -Room Creation: Create rooms and invite collaborators to join and work together. -User Authentication: Securely log in to the application to access personalized features. -Responsive Design: Works seamlessly across devices of all screen sizes. - -Technologies Used -React: Used for building the user interface and managing state. -Socket.IO: Enables real-time, bidirectional communication between clients and servers. -Express.js: Provides a robust framework for building server-side logic and APIs. -Node.js: Powers the server-side environment for running JavaScript code. -HTML/CSS: For structuring and styling the user interface. -Bootstrap: Used for styling and layout. -JWT Authentication: Ensures secure user authentication and authorization. -MongoDB: Stores user data and room information. - -Getting Started +## Features + +- **Real-Time Code Editing**: See changes made by collaborators in real-time. +- **Code Syntax Highlighting**: Enjoy syntax highlighting for various programming languages for better readability. +- **Collaborative Chat**: Communicate with team members in a dedicated chat window. +- **Room Creation**: Create rooms and invite collaborators to join and work together. +- **User Authentication**: Securely log in to the application to access personalized features. +- **Responsive Design**: Works seamlessly across devices of all screen sizes. + +## Technologies Used + +- **React**: Used for building the user interface and managing state. +- **Socket.IO**: Enables real-time, bidirectional communication between clients and servers. +- **Express.js**: Provides a robust framework for building server-side logic and APIs. +- **Node.js**: Powers the server-side environment for running JavaScript code. +- **HTML/CSS**: For structuring and styling the user interface. +- **Bootstrap**: Used for styling and layout. +- **JWT Authentication**: Ensures secure user authentication and authorization. +- **MongoDB**: Stores user data and room information. + +## Getting Started + To get started with the project, follow these steps: -Clone the repository to your local machine. -Navigate to the project directory. -Install dependencies using npm install. -Start the development server using npm start. -Access the application in your web browser at http://localhost:5000. +1. **Clone the repository** to your local machine: + ```bash + git clone https://github.com/yourusername/realtime-code-editor.git + ``` +2. **Navigate to the project directory**: + ```bash + cd realtime-code-editor + ``` +3. **Install dependencies** using npm: + ```bash + npm install + ``` +4. **Start the development server**: + ```bash + npm start + ``` +5. **Access the application** in your web browser at `http://localhost:5000`. +## Contributing -Contributing Contributions are welcome! If you'd like to contribute to this project, please follow these guidelines: -Fork the repository. -Create a new branch for your feature (git checkout -b feature/new-feature). -Make your changes and commit them (git commit -am 'Add new feature'). -Push to the branch (git push origin feature/new-feature). -Create a new Pull Request. +1. **Fork the repository**. +2. **Create a new branch** for your feature: + ```bash + git checkout -b feature/new-feature + ``` +3. **Make your changes** and commit them: + ```bash + git commit -am 'Add new feature' + ``` +4. **Push to the branch**: + ```bash + git push origin feature/new-feature + ``` +5. **Create a new Pull Request**. + +## Acknowledgements + +This project was inspired by the need for real-time collaboration in coding environments. We would like to thank the developers of React, Socket.IO, and all other open-source libraries used in this project. -Acknowledgements -This project was inspired by the need for real-time collaboration in coding environments. -We would like to thank the developers of React, Socket.IO, and all other open-source libraries used in this project.