[jQuery] An Interesting Twist on a Pastebin

[jQuery] An Interesting Twist on a Pastebin

guys, we should definitely use this online tool to ask questions. it seems really useful to our mailinglist !
<div style="margin: 0px 2px; padding-top: 1px; background-color: #c3d9ff; font-size: 1px !important; line-height: 0px !important;"> </div>
<div style="margin: 0px 1px; padding-top: 1px; background-color: #c3d9ff; font-size: 1px !important; line-height: 0px !important;"> </div>
<div style="padding: 4px; background-color: #c3d9ff;"><h3 style="margin:0px 3px;font-family:sans-serif">Sent to you by pixeline via Google Reader:</h3></div>
<div style="margin: 0px 1px; padding-top: 1px; background-color: #c3d9ff; font-size: 1px !important; line-height: 0px !important;"> </div>
<div style="margin: 0px 2px; padding-top: 1px; background-color: #c3d9ff; font-size: 1px !important; line-height: 0px !important;"> </div>
<div style="font-family:sans-serif;overflow:auto;width:100%;margin: 0px 10px"><h2 style="margin: 0.25em 0 0 0"><div class=""><a href="http://feeds.feedburner.com/~r/ajaxian/~3/415896674/an-interest-twist-on-a-pastebin">An Interesting Twist on a Pastebin</a></div></h2>
<div style="margin-bottom: 0.5em">via <a href="http://ajaxian.com" class="f">Ajaxian » Front Page</a> by Rey Bango on 10/9/08</div><br style="display:none">

Pastebins have become an important part of sharing code with colleagues. Sites such as <a href="http://pastebin.com/">Pastebin</a> & <a href="http://pastie.org/">Pastie.org</a> are extremely popular because they’re easy to use and very effective in letting people compare notes on source code, especially in a support setting.


<a href="http://remysharp.com">Remy Sharp</a> wanted to take <a href="http://remysharp.com/2008/10/06/js-bin-for-collaborative-javascript-debugging/">the pastebin concept a step further</a>, past the static posting of code. His idea, which he tossed around for 6 months, finally came to fruition in the form of JS Bin, a new pastebin site with a twist:


<blockquote>

JS Bin is a form of paste bin, but with a twist. It allows you to also include the HTML and CSS to provide context to your pasty. As such, it means you can actually run the JavaScript and pass this on to a colleague to help to debug.

</blockquote>

This is a great idea as it lets you troubleshoot your code while seeing immediate results. The feature list is well thought out as well.


<ul>
<li>Save private snippet</li>
<li>Remote Ajax debugging</li>
<li>Snippet URLs run entirely on their own (i.e. without the JS Bin framework around them)</li>
<li>Support to quickly inject major JS libraries including jQuery, jQuery UI, Prototype, Scriptaculous, Dojo, MooTools & YUI</li>
<li>Saves state within the open window (i.e. refresh and the code doesn’t reset)</li>
</ul>

The ability to inject many of the popular JavaScript libraries is especially important and I would highly recommend individual project teams to contact Remy <em><strong>directly</strong></em> to have their libs included.


To give this a run, I’d suggest going to the <a href="http://jsbin.com/">JS Bin site</a> and putting it through its paces. In addition, Remy has produced two videos which go into detail on how to leverage JS Bin:


<ul>
<li><a href="http://jsbin.com/about#video">JS Bin Video Introduction</a></li>
<li><a href="http://jsbin.com/about#video">Ajax Debugging</a></li>
</ul>
<div>
<a href="http://feeds.feedburner.com/~f/ajaxian?a=A9TDM"><img src="http://feeds.feedburner.com/~f/ajaxian?i=A9TDM" border="0"></a> <a href="http://feeds.feedburner.com/~f/ajaxian?a=iNgoM"><img src="http://feeds.feedburner.com/~f/ajaxian?i=iNgoM" border="0"></a> <a href="http://feeds.feedburner.com/~f/ajaxian?a=toK7m"><img src="http://feeds.feedburner.com/~f/ajaxian?i=toK7m" border="0"></a>
</div></div>
<div style="margin: 0px 2px; padding-top: 1px; background-color: #c3d9ff; font-size: 1px !important; line-height: 0px !important;"> </div>
<div style="margin: 0px 1px; padding-top: 1px; background-color: #c3d9ff; font-size: 1px !important; line-height: 0px !important;"> </div>
<div style="padding: 4px; background-color: #c3d9ff;"><h3 style="margin:0px 3px;font-family:sans-serif">Things you can do from here:</h3>
<ul style="font-family:sans-serif"><li><a href="http://www.google.com/reader/view/feed%2Fhttp%3A%2F%2Ffeeds.feedburner.com%2Fajaxian?source=email">Subscribe to Ajaxian » Front Page</a> using <b>Google Reader</b></li>
<li><a href="http://www.google.com/reader/?source=email">Get started using Google Reader</a> to easily keep up with <b>all your favorite sites</b></li></ul></div>
<div style="margin: 0px 1px; padding-top: 1px; background-color: #c3d9ff; font-size: 1px !important; line-height: 0px !important;"> </div>
<div style="margin: 0px 2px; padding-top: 1px; background-color: #c3d9ff; font-size: 1px !important; line-height: 0px !important;"> </div>