Chomper Stomping jQuery/JavaScript/CSS 3/HTML 5, Java/PHP/Python/ActionScript, Git, Chrome/Firefox Extensions, Wordpress/Game/iPhone App Development and other random techie tidbits I've collected

28Dec/090

TOTW: Etherpad.com

This week's Tool of the Week is Etherpad.com.

What it does:

Allows you to edit a text file collaboratively in real time with others. Each person's changes are highlighted in a unique color. The file gets saved to their server at a unique URL that you can share and reference. You can view past versions of the file using a "Time Slider". It's kind of like Google Wave, but easier to use... There is even a chat feature on the side of the page for off-document conversation that persists from session to session.

When you need it:

  • When walking through or collaborating on some code with another developer
  • When collaborating on a text document (like a list or something)

How to use it:

In case you blinked at the end, I had Firefox and Chrome both open and was editing the same pad from within the two browsers. It kept the edits in sync live between the two browsers. This would have been more apparent had I actually had them both showing, which I should have done, but didn't think about it until just now...

21Dec/090

TOTW: Firebug HTML > Layout

This week's tool of the week is another component of Firebug, the "Layout" tool.

What it does:

Allows you to edit html element box dimensions directly in the browser to get that perfect witdh/height/padding/margin/border combo you're looking for.

When you need it:

  • Resolving float issues
  • Adjusting Padding/Margin
  • Prototyping Layouts

How to use it:

Screencast on screencast.com

The example:

14Dec/092

TOTW: Spoon.net/browsers

This weeks Tool of the Week is spoon.net's browser sandbox tool.

What it does:

Allows you to run sand-boxed versions of each of the major (and minor) browsers from within Firefox.

When you need it:

  • Cross browser testing
  • Running multiple versions of the same browser at once

How to use it:

Screencast hosted on screencast.com

7Dec/090

TOTW: Firebug Console

This is a special Tool of the Week, because it focuses on a sub-set of a larger tool. This week's Tool of the Week is the console feature of the Firefox extension Firebug by Joe Hewitt, Rob Campbell, FirebugWorkingGroup.

What it does:

Allows you to run commands and play with the JavaScript on a web page, as well as output information from a webpage through a dos/shell style console; all from within the browser window. It's as if you "opened the hood" of the browser and started running diagnostics/talking to the robot that controls the page display.

When you need it:

  • prototyping JavaScript
  • debugging JavaScript
  • writing JavaScript

How to use it:

Please note that this doesn't even BEGIN to scratch the surface of the power of this little tool. Check out the documentation, here and here.

The Example:

30Nov/090

TOTW: Pastebin.me

This week's Tool of the Week is Pastebin by Dale Harvey.

What it does:

Allows for quick, IN BROWSER PROTOTYPING.

When you need it:

  • Quick testing of a bit of HTML/JS code
  • Demonstrating/Teaching HTML/JS in front of a group
  • IMing/Linking/Emailing editable code

How to use it:

Full Screencast here

The Example:

http://pastebin.me/198414be57085581cd82c85877387fc1

23Nov/090

TOTW: Pastie.org

I'm starting a new feature on my blog. It's called "Tool of the Week". Let's see how long it lasts.

To be honest, I'm writing the first four TOTWs right now and scheduling them to post over the next month. Double confession is that all of these tools were introduced to me by none other than Paul Irish. The best developer I've ever had the pleasure of working alongside. He came out to Indy from Boston to help out with the FinishLine website redesign project and sat next to me for three weeks. I requested that he give a one hour presentation to our team, and I learned more in that one hour than I normally would have in about 6 months of just learning on my own (reading blogs etc). Hopefully I can help share that knowledge a little. This post is the first in a series of my attempts to do just that.

So, the first tool of the week is Pastie by Josh Goebel.

What it does:

Allows you to paste code that you can then e-mail/IM/embed in a FORMATTED SYNTAX HIGHLIGHTED WAY!

When you need it:

  • Working on a team
  • Posting code on your blog
  • Posting code on your website
  • Getting help online (IRC/forums/etc)

How to use it:

Full Screencast here

The Example:

Bonus TOTW! Paul Irish's easy CSS refresh code:

So, next time you find yourself getting ready to FTP a file, or paste code into an e-mail just to send it to another developer, use the <pre> tag on your blog or whatever, why not give pastie a try?

And btw, sorry to disappoint those of you who land on this page in hopes of finding anything related to the product actresses and "loose women" use in lieu of bras or even shirts... You're better off not finding that stuff anyways...