{"id":25639288,"url":"https://github.com/basemax/editor-realtime-collaborative","last_synced_at":"2026-05-05T14:31:24.790Z","repository":{"id":278929341,"uuid":"934198313","full_name":"BaseMax/editor-realtime-collaborative","owner":"BaseMax","description":"Backend implementation of a collaborative Markdown editor using Node.js, Express, and Socket.IO. The frontend can be developed using React.js to provide a seamless, real-time editing experience.","archived":false,"fork":false,"pushed_at":"2025-02-22T15:28:09.000Z","size":207,"stargazers_count":0,"open_issues_count":1,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-02-22T16:26:55.506Z","etag":null,"topics":["editor","javascript","js","nodejs","real-time","real-time-chat","socket-io","socketio","ts","typescript","websocket"],"latest_commit_sha":null,"homepage":"","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/BaseMax.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2025-02-17T12:42:30.000Z","updated_at":"2025-02-22T15:28:12.000Z","dependencies_parsed_at":"2025-02-22T16:27:18.157Z","dependency_job_id":"9c840df6-cec4-4990-bec9-6b174fb0f8c5","html_url":"https://github.com/BaseMax/editor-realtime-collaborative","commit_stats":null,"previous_names":["basemax/editor-realtime-collaborative"],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/BaseMax%2Feditor-realtime-collaborative","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/BaseMax%2Feditor-realtime-collaborative/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/BaseMax%2Feditor-realtime-collaborative/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/BaseMax%2Feditor-realtime-collaborative/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/BaseMax","download_url":"https://codeload.github.com/BaseMax/editor-realtime-collaborative/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":240265402,"owners_count":19774070,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["editor","javascript","js","nodejs","real-time","real-time-chat","socket-io","socketio","ts","typescript","websocket"],"created_at":"2025-02-23T03:29:23.387Z","updated_at":"2026-05-05T14:31:24.740Z","avatar_url":"https://github.com/BaseMax.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Building a Custom Real-Time Collaborative Markdown Editor\n\nWelcome to the **Real-Time Collaborative Markdown Editor** project! This repository contains the backend implementation of a collaborative Markdown editor using **Node.js, Express, and Socket.IO**. The frontend can be developed using **React.js** to provide a seamless, real-time editing experience.\n\n\u003e Front-End repository: https://github.com/BaseMax/custom-editor-react\n\n![Custom Editor React](demo.jpg)\n\n## Features\n\n- **Real-Time Collaboration:** Multiple users can edit the same document simultaneously.\n- **Live Markdown Preview:** Users can see rendered Markdown in real time.\n- **Socket.IO Integration:** Ensures instant synchronization between users.\n- **User Tracking:** Displays the number of online users.\n- **Customizable Interface:** Can be extended with themes, plugins, and additional features.\n\n## Technologies Used\n\n- **Node.js** - JavaScript runtime environment.\n- **Express.js** - Lightweight web framework.\n- **Socket.IO** - WebSockets for real-time communication.\n- **TypeScript** - Ensures type safety and better development experience.\n\n## Getting Started\n\n### Prerequisites\n\nEnsure you have the following installed:\n\n- [Node.js](https://nodejs.org/) (v16 or later)\n- [npm](https://www.npmjs.com/) or [bun](https://bun.sh/)\n\n### Installation\n\n1. Clone the repository:\n\n   ```sh\n   git clone https://github.com/BaseMax/editor-realtime-collaborative.git\n   cd editor-realtime-collaborative\n   ```\n\n2. Install dependencies:\n\n   ```sh\n   npm install  # or use bun install\n   ```\n\n3. Start the server:\n\n   ```sh\n   npm run dev  # or use bun run dev\n   ```\n\n   The server will start on port **3099**.\n\n### Project Structure\n\n```\neditor-realtime-collaborative/\n│-- src/\n│   │-- config.ts            # Configuration file\n│   │-- io.ts                # Handles socket.io events\n│   │-- default.ts           # Default markdown content\n│   │-- server.ts            # Express server setup\n│-- package.json\n│-- tsconfig.json\n│-- README.md\n```\n\n## API \u0026 WebSocket Events\n\n### WebSocket Events\n\n| Event Name       | Description |\n|-----------------|-------------|\n| `connection`    | Triggered when a user connects. |\n| `updateMarkdown` | Sends the latest Markdown content. |\n| `markdownChange` | Updates Markdown content from a user. |\n| `onlineUsers`   | Notifies users of the current online count. |\n| `disconnect`    | Triggered when a user disconnects. |\n\n### Example WebSocket Usage (Client-Side)\n\n```js\nconst socket = io(\"http://localhost:3099\");\n\nsocket.on(\"updateMarkdown\", (content) =\u003e {\n  console.log(\"Updated Content:\", content);\n});\n\nsocket.emit(\"markdownChange\", \"# New Markdown Content\");\n```\n\n## Contributing\n\nContributions are welcome! Feel free to:\n\n- Submit issues.\n- Open pull requests.\n- Suggest new features.\n\n## License\n\nThis project is licensed under the **MIT License**.\n\n## Author\n\n**Seyyed Ali Mohammadiyeh (Max Base)**\n\nGitHub: [@basemax](https://github.com/BaseMax)  \n\nEmail: maxbasecode@gmail.com\n\nHappy Coding! 🚀\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fbasemax%2Feditor-realtime-collaborative","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fbasemax%2Feditor-realtime-collaborative","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fbasemax%2Feditor-realtime-collaborative/lists"}