About

My name is Rob Cherny and I'm a professional Web Developer with 16 years of experience creating Web sites and Web-based applications. This site is where I write about my work, and random other things...

Web Development

Essential Firefox Developer Extensions

So I just figured I’d post yet another self-important list of “here’s the extensions for Firefox that I use”, in case there’s anything that sparks interest. I know there’s nothing ground breaking here, but whatever.

• Digger — allows you to “dig” through folder structures in the current URL. This feature I’ve long felt should be built into a browser, but as long as the extension is around I’m a happy camper.
• DOM Inspector — typically installed by default, I think, can really help you pick apart a Web page if you’re working on building a problem page.
• Duplicate Tab — another thing I feel like should be built in, duplicates tabs for tabbed browsing addicts.
• Firebug — this is the #2 most important extension on this list, if you don’t have it, you’re missing out. Especially cool is using the console for JavaScript debugging and being able to watch XMLHTTPRequests (XHRs), and their responses (anyone who’s debugged Ajax knows this is a pain).
• IE Tab — allows you to run IE on demand or for select sites in a tab inside Firefox, great for debugging site pages, again.
• Link Alert — this tiny little jewel adds an icon next to the cursor when you’re about to click on a link that’s different, everything from scripts, to HTTPS, to PDFs, Word Docs, new windows and more. Love this.
• LinkChecker — parses the page you’re on and validates the links, great for a Web developer.
• Linky — Allows all sorts of behaviors related to links, images, etc. on the current page, from opening text links, opening all images and links in new tabs, and more.
• Resizable Form Fields — allows you to resize form fields like Textareas by dragging on the edge of it when it’s too small.
• Tails — alerts you and allows you to parse through and check out any embedded Microformats in your pages.
• Web Developer toolbar — this is #1 for any Web site designer or developer, it goes without saying. This has validator links built in, resizes windows, disables style sheets, pulls document weights, creates document outlines, disables and enables scripts, manipulates forms and cookies, and on and on, you find something new here all the time there’s too many features to list them all.

One last extension I also swear by has been LiveHTTPHeaders, which allows you to sniff HTTP transactions from the browser, but it doesn’t seem to be updated for Firefox 2.0 yet, if anyone finds a link, please let me know, I love that thing too.

So there we have it. My Firefox Web developer toolkit, even if it is pretty standard fair. Enjoy.

Nov 5, 02:13 PM in Web Development (filed under Browsers, General)

1. rob    Nov 11, 11:50 AM    #

   One more excellent and handy extension I forget about is the excellent Aardvark extension. Very cool.

   Here's a copy fixed for Firefox 2

2. Adam    Dec 1, 04:51 PM    #

   If you like LiveHttpHeaders, try TamperData.

   A

3. rob    Dec 2, 10:28 AM    #

   Adam, yeah, I’d recently read about it. However, I’m actually getting hooked on Firebug which monitors HTTP requests as well. It doesn’t allow the editing and so forth, but honestly I haven’t had much need for those features (80/20 rule).

4. Shaun    Jul 20, 01:47 PM    #

   That’s a nice list you got there. Some other extensions that help with web dev are:

   ColorZilla, MeasureIt, and “Veiw Source Chart”, very handy for web dev.. check ‘em out :).

Commenting is closed for this article.