DevPen- CodePen Clone

DevPen is my own version of CodePen, built for coders who want a straightforward and efficient way to write and test HTML, CSS, and JavaScript. Using React and MaterialUI, I made sure DevPen is easy to use and gets the job done.

• Demo- https://codepen-clone-f0ca8.web.app/

🚀 Key Features

• Live Preview: Provides a dynamic live preview of the code output as users type in real-time.
• Custom Editors: Separate editors for HTML, CSS, and JavaScript with clear syntax and numbering.
• Auto-Save: Your code is saved in local storage, so you won't lose your work.
• Flexible Layout: Incorporates a flexible layout system that allows users to expand and collapse code sections as needed, enhancing workspace organization and customization.

📦 Tech Stack Used

• React.js
• Material-UI
• CSS
• CodeMirror2
• Firebase

💡 Improvement

• More Languages: Support more coding languages and frameworks.
• Themes: Let users pick their own color themes, including dark mode.
• Collaborate: Add a way for multiple people to work on the same code.
• More Editor Tools: Add features like auto-complete and error checking.