🖥️ Web Compiler

Write, compile & run code in multiple languages directly in your browser.
Built for developers, by developers — ready for both development and production.

---

📋 Project Overview

A full-stack, web-based code compiler platform with:

• ✨ Modern React frontend with Monaco Editor
• ⚡ Express.js backend with Docker integration
• 🐳 Secure, isolated code execution in Docker containers
• 📚 Comprehensive documentation & examples
• 🎨 Sleek dark-themed UI inspired by professional code editors

Languages Supported: Python, JavaScript, C++, Java, C#, Rust, Go, Lua, R
Security Level: Multi-layer isolation (containers, network, resources)
Scalability: Suitable for development, testing, and production

---

🗂️ Project Structure

WebCompiler/
├── backend
│   ├── src
│   │   ├── api
│   │   │   └── routes.js
│   │   ├── common
│   │   │   └── config.js
│   │   ├── docker
│   │   │   └── containerManager.js
│   │   └── server.js
│   ├── .env.example
│   ├── Dockerfile.backend
│   └── package.json
├── frontend
│   ├── src
│   │   ├── api
│   │   │   └── client.js
│   │   ├── components
│   │   │   ├── CodeEditor.jsx
│   │   │   ├── ConsoleOutput.jsx
│   │   │   ├── ExecuteButton.jsx
│   │   │   └── LanguageSelector.jsx
│   │   ├── App.jsx
│   │   ├── index.css
│   │   ├── main.jsx
│   │   └── store.js
│   ├── Dockerfile.frontend
│   ├── index.html
│   ├── package.json
│   ├── postcss.config.js
│   ├── tailwind.config.js
│   └── vite.config.js
├── .gitignore
├── README.md
├── docker-compose.yml
├── setup.bat
└── setup.sh

---

🚀 Getting Started

Automated Setup (Recommended)

Windows:

cd "Web Compiler"
setup.bat

Linux/Mac:

cd "Web Compiler"
chmod +x setup.sh
./setup.sh

Manual Setup

Backend:

cd backend
npm install
npm run dev

Frontend (new terminal):

cd frontend
npm install
npm run dev

Open http://localhost:3000 in your browser.

Docker Compose (Production)

docker-compose up --build

---

💻 Technology Stack

• Frontend: React 18, Vite, Monaco Editor, Tailwind CSS, Zustand
• Backend: Node.js 18, Express, Dockerode
• DevOps: Docker, Docker Compose
• Languages: Python 3.11, JavaScript (Node.js 18), C++ (g++ 11), Java 17, C# (.NET 6), Rust 1.70, Go 1.20, Lua 5.1, R 4.0+

---

🔌 API Quick Reference

Execute Code

POST /api/execute
Content-Type: application/json

{
  "code": "print('Hello')",
  "language": "python"
}

Get Languages

GET /api/languages

Health Check

GET /api/health

---

⚡ Key Features

Frontend

• 🎨 Dark theme, responsive, real-time syntax highlighting
• 🎯 Intuitive UI: language selection, run button, console output
• 🔄 Efficient state management with Zustand

Backend

• 🔐 Secure containerized code execution
• ⚙️ Multi-language support
• 🛡️ Resource limits & execution timeouts
• 📊 Logging & health monitoring
• 🚀 Asynchronous execution for speed

DevOps

• 🐳 Fully containerized with Docker
• 📦 Orchestration with Docker Compose
• 🔄 Scalable and horizontally ready
• 📈 Health checks and monitoring included

---

⚙️ Configuration

Languages & Limits: backend/src/common/config.js
Environment Variables: Create backend/.env

NODE_ENV=development
PORT=5000
DOCKER_TIMEOUT=30000
MAX_OUTPUT_SIZE=10000

---

🚨 Troubleshooting

• Docker not found: Install from Docker Desktop
• Port 5000 in use: Change PORT in .env
• Frontend can’t reach backend: Check backend is running:

curl http://localhost:5000/api/health

---

📄 License

MIT License - Use freely for personal and commercial projects

---