Easy Web Development with jsFiddle
jsFiddle is a free code-sharing tool that allows you to edit, share, execute and debug Web code within a browser.
When you edit a fiddle, you can create a new version of it by clicking the Update button. Or you can fork the code using the Fork button. The nice thing about the Update button is that it creates a new URL with a version number for the fiddle. This makes it easy to go back to previous versions of fiddles from the more recent ones, in case you need to refer back to previous code.
[Click on image for larger view.]
You can check out jsFiddle by creating your own fiddle; you can also view someone else's public fiddle, such as the one in the previous figure that I created, which is located here. From here you can view, run or even fork the code to try your own variations.
One of my favorite uses for jsFiddle is sharing code snippets with colleagues when tossing around ideas. One way to do this is to share the public link. However, you can also share the fiddle on Twitter or Facebook using the Share button.
You can also automatically include specific versions of popular references, such as Mootools or jQuery, from the options window (on the left). Notice in Figure 1 that I reference jQuery 1.7.1. You can also choose to add your own references, such as Knockout, by providing an address from the Add Resources option. Simply enter the URL for the resource's source code and it will be available.
I'll leave you with three tips for using jsFiddle effectively. First, register an account and log in before creating your fiddles. This makes it easier to organize your fiddles under your dashboard. It also adds your jsFiddle username to the URL of your fiddles.
Second, remember to fill in the Info section for each of your fiddles. This allows you to give your fiddle a title and description, which becomes extremely useful when you start creating several fiddles and are trying to discern each fiddle's purpose. Third, if you have no purpose for the intermediate fiddles as you go, click the Set Base button. This makes your current version of the fiddle the base fiddle, and all others will derive from it.
While jsFiddle is extremely useful, it's far from perfect. But I'm willing to live with its missing features and warts because its pros far outweigh its cons. jsFiddle isn't intended to be a full-fledged Web editor, but it is an excellent code testing and sharing tool that's simple to use and adds a lot of value. There are many other features that jsFiddle offers, and I highly recommend you check it out.