Skip to content

chandrikabijore/code_editor

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

10 Commits
 
 
 
 
 
 
 
 
 
 

Repository files navigation

🖥️ Code Editor

A simple, interactive code editor built using HTML, CSS, and JavaScript. This editor allows users to write code in three separate boxes for HTML, CSS, and JavaScript and displays the output in real time as they type.

✨ Features

  1. Three separate input boxes for HTML, CSS, and JavaScript.
  2. Live preview of the output, updated in real-time as code is written.
  3. Clean and minimalistic design for the webpage.

🚀 Getting Started

To run the project locally, follow these steps:

Clone the repository:

git clone https://github.com/divyesh-singh-gehlot/code_editor.git

Navigate to the project directory:

cd code_editor

Navigate to the project sub-directory:

cd "Code Editor"

Open the index.html file in your browser:

For Windows: start index.html

For Mac: open index.html

📂 Project Structure

index.html: The main HTML file containing the structure of the editor and output.

style.css: Contains all styling for the code boxes, output, and overall webpage design.

script.js: The JavaScript file responsible for the real-time output and other interactive features.

🛠️ How It Works

Users can write code in each of the three boxes corresponding to HTML, CSS, and JavaScript. As you type, the output is updated in real-time to reflect the changes.

💡 Future Enhancements

Adding more customizable features like different themes. Improving the code editor with syntax highlighting. Enhancing the UI/UX with better responsive design.

About

No description, website, or topics provided.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published