A powerful and flexible online code editor inspired by CodePen. This project allows users to write and preview HTML, CSS, and JavaScript code in real-time.

• Features
• Demo
• Installation
• Usage
• Contributing
• Acknowledgements
• Contact

• Live Preview: See your HTML, CSS, and JavaScript changes in real-time.
• Code Autocomplete: Intelligent code completion for faster development.
• Syntax Highlighting: Easy-to-read code with syntax highlighting.
• Customizable Layout: Flexible layout to organize your workspace.
• Responsive Design: Works well on both desktop and mobile devices.

Check out the live demo: CodePen Editor Demo

To run this project locally, follow these steps:

1. Clone the repository:

   git clone https://github.com/iMuhammadBilalDev/code-pen.git

2. Navigate to the project directory:

   cd code-pen

3. Install dependencies:

   npm install

4. Start the development server:

   npm start

1. Open your browser and go to http://localhost:3000.
2. Start coding in the HTML, CSS, and JavaScript panels.
3. See the live preview of your code in the preview pane.

We welcome contributions from the community! To contribute, follow these steps:

1. Fork the repository.
2. Create a new branch:

   git checkout -b feature-name

3. Make your changes and commit them:

   git commit -m "Add feature-name"

4. Push to the branch:

   git push origin feature-name

5. Open a pull request.

For major changes, please open an issue first to discuss what you would like to change.

• CodeMirror - The code editor component used in this project.
• React - The JavaScript library for building user interfaces.
• Webpack - The module bundler used in this project.
• Babel - The JavaScript compiler used in this project.

• GitHub: iMuhammadBilalDev
• Email: [email protected]