22 March 2011

JavaScript Heaven with jsFiddle

I may have finally found the perfect tool to build and test JavaScript concoctions on the fly (or at least a really cool one). I have been utilizing Kodingen (which is awesome) to code on my Cr48 and then flipping between the JavaScript code, css, html (I know I could put these all in the same document but navigating that is more exhausting to me that toggling windows) and rendered pages to test my script, styles, and html quickly.  This can get a bit cumbersome, and flipping between tabs or workspaces can get old very quickly.

So I was reading through the Chromium blog and I watched a video of Paul Irish, a developer advocate for the Chrome team, discussing some of the cool tools using Google Chrome to develop quicker.  This sparked my interest in Paul Irish and the first post I saw on his site had an embedded example from jsFiddle.  This led me to jsFiddle.net.  Perfect.  Clean.  Awesome. 

The setup of the editor reminds me of the HTML5 playground at HTML5Rocks, only without the need to switch between views of CSS, HTML, and JavaScript.  In jsFiddle the concurrent views of HTML, CSS, JavaScript, and the current render are all visible because they are each contained in their own iframe.  I decided to try it out with a quick "hello world" test which due to the ease of use and another Paul Irish contribution CSS3Please, I was able to quickly generate this little fiddle:


Another great feature is the 'TidyUp' button which will clean up your code's indents and spacing, which is super handy if you are like me and you have moved things around or copied text in from outside sources (css3please).  Also included is JSLint which is a great utility that will examine the quality of your code and "will hurt your feelings" as it tells the user exactly what is wrong with their JavaScript.  I used jQuery as my JavaScript library of choice, but also included are Mootools, YUI, Prototype, Dojo, Glow, Procession.js, ExtJS, RightJS,  Raphael, and No Library (pure JS)... so just about any flavor you might care for.   I am sold on jsFiddle and I will likely be using it as my primary tool to fiddle with JavaScript.

No comments:

Post a Comment