[the] Code Girl (aka UnrulyGrrl)

All the coding that I do at work is web-based, so I looked for extensions to Firefox that would help me debug/troubleshoot.
Here’s what I found, that I cannot live without:

• Firebug - fantastic for troubleshooting , css, and XMLHTTPRequest… including stack traces; also contains an inspecter and some other things. Bonus: you can add javascript code for debugging (that you wont later have to remove or comment out) by using

  console.debug

  or console.info and a few other error levels. The XMLHTTPRequest debug output alone is worth its weight in gold (i’ve been doing a log Ajax-type stuff lately so it has come in really handy)

• Web Developer toolbar - Contains a boatload of useful things. My favorites: showing all class/id details, displaying element information as you move around a page, and ‘view source -> generated source’ (YES, you can see the source of a page that was dynamically generated without resubmitting the form (as the default ‘view source’ requires)
• Live HTTP Headers - shows you HTTP headers being sent and received real time. You can filter which sites you care about or exclude things like images. Also shows you form-related POST and GET (both requests and responses). Great for finding out what hitting Submit actually sent
• Find in Statusbar - not just for developers but anyone who wants to conserve precious screen real estate. adds a small search text box to the status bar instead of popping up a new section above the statusbar….also dont have to worry about accidentally making it pop up by certain key combinations.

This entry was posted on Tuesday, July 4th, 2006 at 6:24 pm and is filed under Dev, css, javascript, firefox. You can follow any responses to this entry through the RSS 2.0 feed. You can leave a response, or trackback from your own site.