{"id":20796147,"url":"https://github.com/amirhaytham/super-multi-prog-lang-playground","last_synced_at":"2026-02-04T16:32:49.611Z","repository":{"id":263196105,"uuid":"888163501","full_name":"AmirHaytham/Super-multi-prog-lang-playground","owner":"AmirHaytham","description":"A modern web-based code editor and execution environment supporting multiple programming languages. Built with React, TypeScript, Node.js, and Docker.","archived":false,"fork":false,"pushed_at":"2024-12-17T17:28:30.000Z","size":59313,"stargazers_count":1,"open_issues_count":0,"forks_count":1,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-04-09T19:46:45.838Z","etag":null,"topics":["cpp","docker","docker-compose","docker-image","go","js","monaco-editor","node","nodejs","playground","ruby","typescript"],"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/AmirHaytham.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":"2024-11-13T23:27:32.000Z","updated_at":"2024-12-17T17:29:09.000Z","dependencies_parsed_at":"2024-12-17T17:23:00.489Z","dependency_job_id":"e56d8bbe-3e9e-4e95-80f4-8282c07fd31f","html_url":"https://github.com/AmirHaytham/Super-multi-prog-lang-playground","commit_stats":null,"previous_names":["amirhaytham/super-multi-prog-lang-playground"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/AmirHaytham/Super-multi-prog-lang-playground","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/AmirHaytham%2FSuper-multi-prog-lang-playground","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/AmirHaytham%2FSuper-multi-prog-lang-playground/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/AmirHaytham%2FSuper-multi-prog-lang-playground/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/AmirHaytham%2FSuper-multi-prog-lang-playground/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/AmirHaytham","download_url":"https://codeload.github.com/AmirHaytham/Super-multi-prog-lang-playground/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/AmirHaytham%2FSuper-multi-prog-lang-playground/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":29090599,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-02-04T03:31:03.593Z","status":"ssl_error","status_checked_at":"2026-02-04T03:29:50.742Z","response_time":62,"last_error":"SSL_connect returned=1 errno=0 peeraddr=140.82.121.5:443 state=error: unexpected eof while reading","robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":false,"can_crawl_api":true,"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":["cpp","docker","docker-compose","docker-image","go","js","monaco-editor","node","nodejs","playground","ruby","typescript"],"created_at":"2024-11-17T16:25:54.028Z","updated_at":"2026-02-04T16:32:49.592Z","avatar_url":"https://github.com/AmirHaytham.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# 🚀 Multi-Language Code Playground\n\n[![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://opensource.org/licenses/MIT)\n[![Docker](https://img.shields.io/badge/docker-%230db7ed.svg?style=flat\u0026logo=docker\u0026logoColor=white)](https://www.docker.com/)\n[![React](https://img.shields.io/badge/react-%2320232a.svg?style=flat\u0026logo=react\u0026logoColor=%2361DAFB)](https://reactjs.org/)\n[![TypeScript](https://img.shields.io/badge/typescript-%23007ACC.svg?style=flat\u0026logo=typescript\u0026logoColor=white)](https://www.typescriptlang.org/)\n[![Node.js](https://img.shields.io/badge/node.js-6DA55F?style=flat\u0026logo=node.js\u0026logoColor=white)](https://nodejs.org/)\n[![Twitter Follow](https://img.shields.io/twitter/follow/AmirHaytham_?style=social)](https://twitter.com/AmirHaytham_)\n[![GitHub followers](https://img.shields.io/github/followers/AmirHaytham?style=social)](https://github.com/AmirHaytham)\n\nA modern, secure, and powerful web-based code execution environment supporting multiple programming languages. Built with React, TypeScript, Node.js, and Docker for secure code execution.\n\n\u003cdiv align=\"center\"\u003e\n  \u003cimg src=\"https://github.com/AmirHaytham/Super-multi-prog-lang-playground/blob/master/Screenshot%20(88).png\" alt=\"Code Playground Screenshot\" width=\"800\"/\u003e\n\u003c/div\u003e\n\n## 📑 Table of Contents\n- [✨ Features](#-features)\n- [🚀 Quick Start](#-quick-start)\n- [🔧 Configuration](#-configuration)\n- [🏗️ Architecture](#️-architecture)\n- [🔍 Troubleshooting](#-troubleshooting)\n- [📚 API Documentation](#-api-documentation)\n- [🧪 Testing](#-testing)\n- [🔒 Security](#-security)\n- [🤝 Contributing](#-contributing)\n- [📝 License](#-license)\n- [🙏 Acknowledgments](#-acknowledgments)\n- [📞 Support](#-support)\n\n## ✨ Features\n\n### 🌈 Multiple Language Support\n- **JavaScript** 📜: Full ES6+ support with Node.js runtime\n- **C++** ⚡: C++17 standard with STL support\n- **Ruby** 💎: Latest Ruby with gem support\n- **Go** 🔵: Latest Go version with package management\n\n### 💻 Professional Code Editor\n- **Monaco Editor** (VS Code's editor)\n  ```typescript\n  // Example of editor configuration\n  const editorOptions = {\n    theme: 'vs-dark',\n    language: 'javascript',\n    automaticLayout: true,\n    minimap: { enabled: true },\n    fontSize: 14,\n  };\n  ```\n- Intelligent code completion\n- Real-time syntax highlighting\n- Error detection and linting\n- Multiple themes (Dark/Light/High Contrast)\n\n### 🛡️ Secure Execution\n- Containerized code execution with resource limits:\n  ```yaml\n  # Example Docker container limits\n  services:\n    code-runner:\n      mem_limit: 512m\n      cpus: 0.5\n      pids_limit: 100\n      ulimits:\n        nproc: 100\n        nofile:\n          soft: 1024\n          hard: 2048\n  ```\n\n### ⚙️ Additional Features\n- Real-time code execution\n- Quick feedback\n- Multiple language support\n- Secure sandboxed environment\n- Code sharing capabilities\n- Custom themes\n- Keyboard shortcuts\n- Code snippets\n\n## 🚀 Quick Start\n\n### Prerequisites\n- Docker Desktop 20.10.0+\n- Git\n\n### Using Docker (Recommended)\n\n1. **Clone the repository**\n   ```bash\n   git clone https://github.com/AmirHaytham/Super-multi-prog-lang-playground.git\n   cd Super-multi-prog-lang-playground\n   ```\n\n2. **Create necessary environment files**\n   \n   Create `backend/.env`:\n   ```env\n   NODE_ENV=development\n   PORT=5002\n   ```\n\n   Create `frontend/.env`:\n   ```env\n   REACT_APP_API_URL=http://localhost:5007\n   REACT_APP_REPORT_WEB_VITALS=true\n   WDS_SOCKET_PORT=0\n   ```\n\n3. **Start Docker Desktop**\n   - Make sure Docker Desktop is running\n   - Open Docker Desktop\n   - Wait until you see \"Docker Desktop is running\" in the system tray\n\n4. **Build and Run**\n   ```bash\n   # Clean up any old containers (if needed)\n   docker-compose down --rmi all\n\n   # Build and start services\n   docker-compose up --build\n\n   # If you see any errors, try running the services separately:\n   docker-compose up --build backend    # In first terminal\n   docker-compose up --build frontend   # In second terminal\n   ```\n\n5. **Verify Installation**\n   - Backend API should be running at: http://localhost:5007\n   - Frontend should be running at: http://localhost:3007\n   - Try opening the frontend URL in your browser\n   - Test code execution with a simple program\n\n### Troubleshooting Common Setup Issues\n\n1. **Port Conflicts**\n   ```bash\n   # If you see \"port already in use\" error:\n   # Windows:\n   netstat -ano | findstr \"5007\"\n   netstat -ano | findstr \"3007\"\n   # Then kill the process using the PID shown\n   ```\n\n2. **Docker Build Fails**\n   ```bash\n   # Clean Docker system\n   docker system prune -a\n   docker volume prune\n   \n   # Rebuild from scratch\n   docker-compose build --no-cache\n   ```\n\n3. **Frontend Can't Connect to Backend**\n   - Check if both containers are running:\n   ```bash\n   docker-compose ps\n   ```\n   - Verify backend logs:\n   ```bash\n   docker-compose logs backend\n   ```\n   - Make sure your firewall isn't blocking the ports\n\n4. **Container Startup Issues**\n   ```bash\n   # Stop all containers and remove volumes\n   docker-compose down -v\n   \n   # Start with detailed logs\n   docker-compose up --build --force-recreate\n   ```\n\n### Example Test Code\n\nAfter setup, try these examples to verify everything works:\n\n**JavaScript**:\n```javascript\nconsole.log(\"Hello from JavaScript!\");\n```\n\n**C++**:\n```cpp\n#include \u003ciostream\u003e\nint main() {\n    std::cout \u003c\u003c \"Hello from C++!\" \u003c\u003c std::endl;\n    return 0;\n}\n```\n\n**Ruby**:\n```ruby\nputs \"Hello from Ruby!\"\n```\n\n**Go**:\n```go\npackage main\nimport \"fmt\"\nfunc main() {\n    fmt.Println(\"Hello from Go!\")\n}\n```\n\n## 📚 API Documentation\n\n### REST Endpoints\n\n#### Code Execution\n```http\nPOST /api/execute\nContent-Type: application/json\n\n{\n  \"language\": \"javascript\", // Supported: javascript, cpp, ruby, go\n  \"code\": \"console.log('Hello, World!')\",\n  \"timeout\": 30000\n}\n```\n\n#### Language Support\n```http\nGET /api/languages\nResponse:\n{\n  \"languages\": [\n    {\n      \"id\": \"javascript\",\n      \"version\": \"ES6+\",\n      \"runtime\": \"Node.js\"\n    },\n    {\n      \"id\": \"cpp\",\n      \"version\": \"C++17\",\n      \"compiler\": \"g++\"\n    },\n    {\n      \"id\": \"ruby\",\n      \"version\": \"Latest\",\n      \"runtime\": \"Ruby\"\n    },\n    {\n      \"id\": \"go\",\n      \"version\": \"Latest\",\n      \"runtime\": \"Go\"\n    }\n  ]\n}\n```\n\n## 🧪 Testing\n\n### Running Tests\n```bash\n# Backend Tests\ncd backend\nnpm test\n\n# Frontend Tests\ncd frontend\nnpm test\n\n# E2E Tests\nnpm run test:e2e\n```\n\n### Test Coverage\n```bash\n# Generate coverage reports\nnpm run test:coverage\n```\n\n## 🔒 Security\n\n### Security Features\n1. **Container Isolation**\n   - Separate containers for each execution\n   - Network isolation\n   - Resource limits\n   - No persistent storage\n\n2. **Code Execution Limits**\n   ```typescript\n   const executionLimits = {\n     timeout: 30000, // 30 seconds\n     memory: '512m',\n     processes: 100,\n     fileSize: '10m'\n   };\n   ```\n\n3. **Input Validation**\n   - Code size limits\n   - Language validation\n   - Syntax checking\n   - Malicious code detection\n\n## 🔍 Advanced Troubleshooting\n\n### Docker Issues\n\n1. **Container Build Failures**\n   ```bash\n   # Clean Docker cache\n   docker builder prune\n   \n   # Remove all containers and images\n   docker-compose down --rmi all\n   ```\n\n2. **Performance Issues**\n   ```bash\n   # Check container stats\n   docker stats\n   \n   # Monitor container logs\n   docker-compose logs -f --tail=100\n   ```\n\n3. **Network Problems**\n   ```bash\n   # Inspect network\n   docker network ls\n   docker network inspect multi-lang-playground_app-network\n   ```\n\n### Application Issues\n\n1. **Frontend Connection Issues**\n   - Check API URL in `.env`\n   - Verify CORS settings\n   - Check browser console logs\n\n2. **Backend Errors**\n   ```bash\n   # Check backend logs\n   docker-compose logs backend\n   \n   # Access container shell\n   docker-compose exec backend sh\n   ```\n\n## 📈 Performance Optimization\n\n### Frontend Optimization\n- Code splitting\n- Lazy loading\n- Caching strategies\n- Asset optimization\n\n### Backend Optimization\n- Request queuing\n- Caching layer\n- Load balancing\n- Resource pooling\n\n## 🤝 Contributing\n\nWe welcome contributions! Please follow these steps:\n\n1. **Fork and Clone**\n   ```bash\n   git clone https://github.com/AmirHaytham/Super-multi-prog-lang-playground.git\n   ```\n\n2. **Create Feature Branch**\n   ```bash\n   git checkout -b feature/amazing-feature\n   ```\n\n3. **Commit Changes**\n   ```bash\n   git commit -m 'Add amazing feature'\n   ```\n\n4. **Push and Create PR**\n   ```bash\n   git push origin feature/amazing-feature\n   ```\n\n### Development Guidelines\n- Follow TypeScript best practices\n- Write unit tests\n- Update documentation\n- Follow code style guide\n\n## 📞 Support\n\nNeed help? We're here to assist:\n\n1. 📚 Check the [Documentation](#-documentation)\n2. 🔍 Search [Issues](https://github.com/AmirHaytham/Super-multi-prog-lang-playground/issues)\n3. 💬 Follow on [Twitter](https://twitter.com/AmirHaytham_)\n4. 📧 Email: amir.haytham.salama@gmail.com\n\n---\n\n\u003cdiv align=\"center\"\u003e\n\n**[GitHub](https://github.com/AmirHaytham)** • **[Twitter](https://twitter.com/AmirHaytham_)** • **[Report Bug](https://github.com/AmirHaytham/Super-multi-prog-lang-playground/issues)** • **[Request Feature](https://github.com/AmirHaytham/Super-multi-prog-lang-playground/issues)**\n\nMade with ❤️ by [Amir Haytham](https://github.com/AmirHaytham)\n\n\u003c/div\u003e\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Famirhaytham%2Fsuper-multi-prog-lang-playground","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Famirhaytham%2Fsuper-multi-prog-lang-playground","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Famirhaytham%2Fsuper-multi-prog-lang-playground/lists"}