Firebug - Firefox extension

Every now and then, a tool or interface enhancement comes along that changes the way you interact with computers. You can look way down the line, and see monitors and keyboards replacing punchcards, Xerox adding the mouse to the mix, email, VisiCalc evolutionizing accounting, the modern operating systems, etc. Back when I read Wired as a teenager, these were called killer apps, which to my ears sounds woefully dated and technically only applies to software. I’m not sure if there’s a replacement term nowadays, but I’m not too high on jargon, so I’m not going to do more than a cursory Google search - which reveals… nothing.

Firebug, a Firefox extension, is one of those tools (at least for those in the web development industry), and it has changed the way I build front end interfaces. It’s absence from Internet Explorer has made IE even more of a burden to use and develop for than it was a year ago, which is really saying something.

Firebug is a Javascript debugger, DOM inspector and a network profiler, just to cover the features I use most. While all of these things have existed to some degree in a variety of tools, having them all under one roof saves a ton of time. One of its most useful features is that you can examine any HTML element on any web page, and see all the CSS rules applied to the element, and edit them in real time. For me, this is WAY faster than actually editing a stylesheet, reloading the page, scrolling to the element, and seeing if my fix worked. Being able to modify the entire CSS inheritance tree while looking at the page… I can’t stress enough how great this is.

It’s also a great help for writing AJAX utilities, because you can use it to inspect HTTP requests and responses. It is very handy to be able to see the raw data that is being returned by your function as a built-in of your browser, so you can write scaffold code easily.

Honestly, I can’t recommend it enough as a development tool, and I wish I had discovered it a year ago. If you do front end web work, you’re missing out on a lot if you aren’t using it, regardless of your current development platform.