Year of the Code Monkey
Because Jonah Bishop Said So
I recently stumbled upon what might be the greatest Firefox extension of all time: Firebug. This extension is aimed squarely at web developers and includes a number of mind-blowing features. And I mean mind blowing. Before reading any further, take a look at this short screencast of Firebug in action. Just make sure that you hold on to your socks.
How did I survive this long without this tool? And why haven’t we had something like this all along? Firebug single-handedly obsoletes the DOM Inspector extension that ships with Firefox, and nearly obsoletes the mighty fine Web Developer extension that I have relied on for so long. I can now view exactly what my CSS is doing. I can peruse through my page’s DOM without opening up the DOM Inspector and switching between windows. I can even edit the CSS and HTML for a page in real time; no reloading necessary! Want to watch your AJAX code in action? Firebug makes it easy.
This tool feels so incredibly polished, and the user interface is so streamlined, that I barely even notice that I have it installed. And it weighs in at an extraordinarily small 288 KB (as of this writing). I cannot say enough good things about this extension; just download it and give it a try. You will not be disappointed.
December 10, 2006 at 3:02 pm
That is pretty cool, I’ve seen that extension before but assumed from the name that it had something to do with Bugzilla so I never investigated more closely. Although I should add that the Web Developer extension also allows you to edit HTML and CSS in real time (i.e. without reloading the page).
December 10, 2006 at 8:13 pm
I’ve never used the edit CSS and HTML stuff in Web Developer; the sidebar doesn’t lend itself too well to hacking, since it can’t grow very wide. But I guess that’s just a personal preference. I mainly like the fact that with Firebug, I don’t have to open up the DOM inspector to parse through the DOM.
But what really hooked me was the box-model highlighting. Now I can actually see where my margin is in relation to the content. Far out!