https://github.com/lakshayd02/online_code_editor
An online code editor is a web-based tool that allows users to write, edit, and run code directly in a browser. It typically consists of three main components: a text editor for code input, an area to display the output, and various controls or buttons to run or manipulate the code. Technology Stack used - HTML, CSS and JavaScript
https://github.com/lakshayd02/online_code_editor
cascading-style-sheets code-editor css html html-css-javascript html5 javascript online-code-editor
Last synced: about 2 months ago
JSON representation
An online code editor is a web-based tool that allows users to write, edit, and run code directly in a browser. It typically consists of three main components: a text editor for code input, an area to display the output, and various controls or buttons to run or manipulate the code. Technology Stack used - HTML, CSS and JavaScript
- Host: GitHub
- URL: https://github.com/lakshayd02/online_code_editor
- Owner: LakshayD02
- Created: 2023-11-19T12:22:57.000Z (about 2 years ago)
- Default Branch: main
- Last Pushed: 2025-01-31T17:25:04.000Z (10 months ago)
- Last Synced: 2025-06-17T09:07:48.621Z (6 months ago)
- Topics: cascading-style-sheets, code-editor, css, html, html-css-javascript, html5, javascript, online-code-editor
- Language: JavaScript
- Homepage: https://code-editor-web-lakshay.netlify.app/
- Size: 12.7 KB
- Stars: 6
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Online Code Editor with HTML, CSS, JavaScript 🖥️
An Online Code Editor built using HTML, CSS, and JavaScript that allows users to write, edit, and run code directly in their browser. This tool supports HTML, CSS, JavaScript, and Python. It provides a live HTML and CSS preview, making it easy to see changes in real-time. The editor also features syntax highlighting for a better coding experience.
## Features
- **Code Editor:** Write code in HTML, CSS, JavaScript, or Python directly in the browser ✍️
- **Live Preview:** See real-time HTML and CSS changes as you write the code 🔄
- **Syntax Highlighting:** Enhanced readability with color-coded syntax for different programming languages 🌈
- **Multi-Language Support:** Supports HTML, CSS, JavaScript, and Python for versatile coding practices 🔠
- **Run Code:** Execute code within the editor and view the results instantly 🚀
## Technologies Used
- **Frontend:** HTML for structure, CSS for styling, and JavaScript for interactivity and functionality 💻
- **Code Highlighting:** JavaScript libraries to add syntax highlighting and editor functionality 🖋️
- **Live Preview:** Dynamic updates of HTML and CSS in real-time for an instant preview of the changes 🖥️
## How it Works
1. **Write Code:** Type your HTML, CSS, JavaScript, or Python code in the provided editor ✍️
2. **Preview:** Instantly view the output of your HTML and CSS in a live preview window 🔄
3. **Run the Code:** Execute your code and see the results for JavaScript and Python directly in the browser 🚀
4. **Syntax Highlighting:** Enjoy clear and readable code with syntax highlighting for better coding experience 🌈
## Installation
1. Clone the repository:
```bash
git clone https://github.com/LakshayD02/online_code_editor.git
```
2. Open the `index.html` file in your browser to start using the editor.
3. Customize or edit the code as per your requirements.