Firebug 1.0—Web developer tool of the year?

Joe Hewitt’s Firebug extension for Firefox used to be a really useful development tool, well worth installing alongside your other extensions that make Web development easier. But what Firebug used to be is nothing compared to what it is now.

With the recent release of Firebug 1.0 (beta—the old kind of beta, not a Web 2.0 eternal beta), this extension went from "great" to absolutely marvellous. A must have that no Web developer should do without. I’m serious—you need Firebug.

I love the new style inspector. I’ve been using the WebKit nightly builds for the Web Inspector tool that comes with it, but it honestly pales in comparison to what Firebug offers.

Firebug 1.0 lets you view and edit the HTML and CSS of any page. It tells you exactly which CSS rules affect the styling of the element you select in the style inspector—not only which rules affect it directly but also which rules it inherits properties from. It lets you edit anything and toggle CSS declarations on and off, with the results immediately showing on the page.

Firebug also has a layout inspector that displays a nice graphic of the currently selected element’s box model properties, and a DOM inspector that lists all DOM properties and their values. Then there’s the JavaScript debugger and the Net inspector. All of these goodies are no longer constrained to part of the main browser window, which they were in the previous version. If you want to you can now open Firebug in a separate window.

There is much more than that to this fantastic extension, so I could go on and on raving about it. I won’t though—now it’s time for you to download Firebug and see for yourself.

Posted on December 7, 2006 in Browsers