Codebox is a code editor inspired by CodePen, where you can write and preview HTML, CSS, and JavaScript code in real-time. It is built using React and utilizes CodeMirror as the editor component. CodeBox also provides a live preview functionality, allowing you to instantly see the output of your code as you type.
- Real-time code editing and preview.
- Support for HTML, CSS, and JavaScript.
- Code syntax highlighting for improved readability.
- A user-friendly interface for a smooth coding experience.
Follow these steps to get the project up and running on your local machine:
- Clone the repository:
git clone https://github.com/Prachi24599/code-box.git - Navigate to the project directory: `cd code-box
- Install the dependencies:
npm install - Start the development server:
npm start
- After starting the development server, open your browser and go to
http://localhost:3000. - You will see the Codebox interface with three sections for HTML, CSS, and JavaScript.
- Write your code in the respective sections.
- The preview of the output will be shown in real-time on the bottom side.
We welcome contributions to improve Codebox. To contribute, follow these steps:
- Fork the repository.
- Create a new branch:
git checkout -b feature/your-feature - Make your changes and commit them:
git commit -m 'Add some feature' - Push the changes to your forked repository:
git push origin feature/your-feature - Create a pull request to the main repository.
- CodeMirror - A versatile text editor implemented in JavaScript for the browser.
- React - A JavaScript library for building user interfaces.
If you have any questions or feedback, feel free to reach out:
- Email: polakhare.prachi@gmail.com
- Linkedin: Prachi Polakhare
Happy coding!