Reduced test cases are a great way to help find bugs and fine tune new ideas. Tools like jsfiddle are a great start. A similar web app, CodePen builds on code editing features with a social coding component.
CodePen allows you to quickly build demos with an in-browser code editor, share your new creation and discover new ideas from other developer’s code. The site is currently in beta and was created by Alex Vazquez, Tim Sabat and Chris Coyier.
The code editor is divided into: HTML, CSS, JS and Result windows:
- HTML Section: HAML, Markdown, Slim, Zen coding built in
- CSS Section: LESS, SASS, Compass, External CSS file
- JS Section: Coffee Script, Popular libraries, External JS file
- Click section to see compiled version of HTML or CSS
Several CSS preprocessor languages are available
You can share your code through social links or a direct link.