CodeArena is an innovative, feature-rich online compiler designed to streamline coding experiences. With support for 6+ programming languages, 10+ beautiful themes, and powerful development tools, CodeArena is your go-to platform for coding endeavors.
- Multi-Language Support: Code in Python, JavaScript, TypeScript, Java, C++, and C with full syntax highlighting
- Instant Execution: Run your code instantly with real-time output and error handling
- Multiple Themes: Choose from 10+ beautiful dark and light themes including Night Owl, Dracula, GitHub Dark, Monokai, and more
- Save & Download: Save your code locally or download it as files with one click
- Multiple Files: Work with multiple files simultaneously with a tabbed interface
- Easy Sharing: Copy code with one click and share your solutions quickly
- IntelliSense: Full code completion and IntelliSense support for all languages
- Syntax Highlighting: Beautiful syntax highlighting for all supported languages
- Customizable Font Size: Adjust editor font size to your preference
- Auto-Save: Automatic local storage of your code
- Input/Output: Support for stdin input and console output
- Responsive Design: Seamless coding experience on any device
- Night Owl
- Dracula
- GitHub Dark
- Monokai
- One Dark
- Solarized Dark
- VS Dark
- VS Light
- High Contrast Dark
- High Contrast Light
- Python 3 (.py)
- JavaScript (.js)
- TypeScript (.ts)
- Java (.java)
- C++ (.cpp)
- C (.c)
- Node.js 16+ and npm/yarn
- Clone the repository:
git clone https://github.com/yourusername/codearena.git
cd codearena- Install dependencies:
npm install- Start the development server:
npm run dev- Open your browser and navigate to
http://localhost:3000
npm run build
npm run preview- Select Your Language: Choose from the supported programming languages in the sidebar
- Write Your Code: Start coding in the Monaco editor with full IntelliSense support
- Run Code: Click the "Run" button to execute your code
- View Output: See the results in the console output panel
- Save/Download: Save your code locally or download it as a file
- Multiple Files: Click the "+" button to add new files
- Switch Themes: Change themes from the Configuration panel
- Adjust Font Size: Use the Settings panel to customize font size
- Input Support: Enter stdin input in the Input field before running
- Framework: SolidJS - A declarative JavaScript library
- Editor: Monaco Editor - The editor that powers VS Code
- Routing: @solidjs/router - Official router for SolidJS
- Build Tool: Vite - Next generation frontend tooling
- Icons: solid-icons - Icon library for SolidJS
codearena/
├── public/
│ └── favicon.png
├── src/
│ ├── components/ # Reusable components
│ ├── pages/
│ │ ├── Landing.jsx # Landing page
│ │ └── Editor.jsx # Code editor page
│ ├── utils/
│ │ ├── api.js # API integration
│ │ └── themes.js # Theme configurations
│ ├── App.jsx # Main app component
│ ├── main.jsx # Entry point
│ └── index.css # Global styles
├── index.html
├── package.json
├── vite.config.js
└── README.md
Execute your code instantly and see results in real-time. The compiler supports stdin input and provides detailed output.
Choose from a variety of professionally designed themes that reduce eye strain and improve your coding experience.
- Create multiple files
- Switch between files with tabs
- Delete files when no longer needed
- Automatic code saving
- Full IntelliSense support
- Syntax highlighting
- Code formatting
- Bracket matching
- Error detection
CodeArena uses a code execution API to run your code. The API endpoint is configured in src/utils/api.js. You can modify this to use your own backend service.
This project is open source and available under the MIT License.
Contributions are welcome! Please feel free to submit a Pull Request.
For support, email sriramadusumilli98@gmail.com or open an issue on GitHub.
- Monaco Editor for the amazing code editor
- SolidJS for the reactive framework
- All theme creators for their beautiful color schemes
Made with ❤️ by the CodeArena team