CodeFiddle

Ever used sites like CodeSandbox, or codedamn? Wondered how they've built their code editors to be so customisable while integrating personalised features like open collaboration? This project is a take on how a site like this could be built.

The basic layout provides a VS Code experience, wherein a user can navigate between his available files from the file manager. The user also has a shell available that is hooked to a container that has been spun up for him, thus allowing for a full developer workflow, similar to the way you would work offline.

Integrated with this is also an iframe providing realtime feedback to changes you may make in your project. The various components in this project, like the Code Editor, and the Browser Previews are freely resizable, so you can set them to a size that provides the most optimal working environment for you.