JS Code Editor

A modern, browser-based JavaScript code editor built with React, Vite, and Monaco Editor.

Features

• Monaco-powered code editing
• Separate HTML, CSS, and JavaScript files
• Live preview in a sandboxed iframe
• Console output capture
• Runtime error reporting
• Keyboard shortcuts
• Template gallery
• Local workspace persistence
• Export complete project as a single HTML file
• Beautiful responsive UI with dark and light theme support

Getting Started

npm install
npm run dev

Open the local development URL shown by Vite.

Build

npm run build

Keyboard Shortcuts

• Ctrl/Cmd + Enter → Run code
• Ctrl/Cmd + S → Save workspace locally
• Shift + Alt + F → Format the active file via Monaco

Project Structure

src/
  components/
  data/
  hooks/
  utils/

Tech Stack

• React
• Vite
• Monaco Editor
• Lucide React