⚡️CDE (Code Development Environment)

CDE is a blazing fast online code development environment powered by StackBlitz's WebContainer 🔥. Whether you are looking to prototype, code, or collaborate, CDE provides a seamless experience right in your browser.

🌐 Features

• Monaco Editor: Integrated with the popular Monaco Editor for a rich code editing experience.
• DockView: Tabbed interface and organized workspace.
• Xterm.js: Integrated terminal for real-time logs and command executions.
• YJS: Real-time collaborative features for coding sessions.
• React Complex Tree: Feature-rich tree views for project files and directories.

🧰 Libraries Used

• @monaco-editor/react - Monaco Editor for React.
• @webcontainer/api - WebContainer API for StackBlitz.
• dockview - Windowing interface library.
• monaco-editor-auto-typings - Automatic typings for the Monaco Editor.
• react & react-dom - React library and DOM bindings.
• react-complex-tree - Feature-rich tree view component for React.
• typescript - TypeScript language and compiler.
• vite - Build tool and development server.
• xterm & xterm-addon-fit - Terminal front end component and fitting addon.
• y-monaco - YJS bindings for Monaco Editor for collaborative features.
• y-webrtc - WebRTC provider for YJS.
• yjs - High-performance real-time collaboration framework.

🚀 Getting Started

1. Clone the repository.

   git clone https://github.com/prashantpaddune/CDE

2. Install the dependencies.

   pnpm install

3. Start the development server.

   pnpm start

4. Open in your browser and enjoy coding!

How do I use it?

Access the CDE instance using the following URLs:

• http://localhost:5101 - Normal instance.
• http://localhost:5101/~/gh/prashantpaddune/CDE.git - Clones the git repo and installs dependencies.

📜 License

MIT