This project was 99% vibe-coded using Lovable, GitHub Copilot, and GPT-4o as a fun Monday evening experiment in AI-assisted development. The goal was to explore rapid end-to-end app creation: building a frontend and backend with AI/Lovable, integrating real-time features, and deploying something fully usable. The project is provided as-is for inspiration - feel free to fork it, remix it, or ask your LLM to extend it in whatever way you like.
The application supports the core features of an online coding interview tool:
- Create a sharable session link
- Let multiple users edit code collaboratively in real time
- Synchronize code changes across all connected clients
- Provide syntax highlighting for multiple languages
- Execute code safely in the browser via WASM
- Live Deployment on Google Cloud Run: https://collabcode-live-970353872929.us-central1.run.app/
- My first Lovable version:: https://lovable.dev/projects/65d98231-24eb-401d-a936-8447bfd26775
- Vite: A fast build tool for modern web applications.
- TypeScript: A strongly typed programming language that builds on JavaScript.
- React: A JavaScript library for building user interfaces.
- shadcn-ui: A component library for building accessible and customizable UI components.
- Tailwind CSS: A utility-first CSS framework for rapid UI development.
- Node.js: A JavaScript runtime for building scalable backend services.
- Express.js: A minimal and flexible Node.js web application framework.
- WebSockets: Enables real-time, bidirectional communication between clients and the server.
- WASM (WebAssembly): Used for secure and sandboxed code execution.
- Google Cloud
- Install dependencies:
npm install
- Start the development server:
npm run dev
- Build the Docker image:
docker build -t collabcode-live . - Run the Docker container:
docker run -d -p 8080:80 collabcode-live
- Access the application in your browser:
$BROWSER http://localhost:8080
- Authenticate with Google Cloud:
gcloud auth login
- Set the active project:
Replace
gcloud config set project <PROJECT-ID>
<PROJECT-ID>with your Google Cloud project ID. - Enable required APIs:
gcloud services enable run.googleapis.com containerregistry.googleapis.com - Build and push the Docker image:
docker build -t gcr.io/<PROJECT-ID>/collabcode-live . docker push gcr.io/<PROJECT-ID>/collabcode-live
- Deploy to Google Cloud Run:
gcloud run deploy collabcode-live \ --image gcr.io/<PROJECT-ID>/collabcode-live \ --platform managed \ --region us-central1 \ --allow-unauthenticated
- Access the deployed application:
- The deployment command will output the URL of your application. Open it in your browser:
$BROWSER <url>
- The deployment command will output the URL of your application. Open it in your browser:
