« Telco vs Cableco, DSL vs cable modem | Main | (Re)learning to ice skate »
December 19, 2006
FireBug excellent addition to Web developer's toolkit
Doing a job right (and efficiently) requires the right toolset, and I've been changing mine to fit my new job.
One of the challenges of Web development is determining what caused an error on a complex Web page. Tracing through raw HTML source is cumbersome at best, and manually figuring out all the interactions between HTML, CSS and Javascript is nearly impossible.
Mike pointed me to the Web Developer's Toolbar, which I found very useful (looks like there's something similar for IE).
I recently stumbled on FireBug, a plug-in for FireFox that's got to be the best addition to my toolset. FireBug is something like the debugger you'd 
find in traditional development environments, but designed for the Web (which means it has to be on the browser). FireBug is designed for FireFox, but there are some limited capabilities with IE and Safari.
I've only poked around a little to explore FireBug's capabilities, and I know there's a ton of capability I'm not using yet. The Inspect feature is incredibly useful for matching a page element to it's underlying code, and the Javascript debugger is a welcome addition, but the most intriguiging feature I've found is the ability to modify the HTML and CSS source right in the page. This significantly shortens the code-check-recode cycle for page design.
If FireBug isn't in your Web developer toolset, I'd highly recommend checking it out. It's opensource and free, definitely a project worth supporting.
Posted by pete at December 19, 2006 8:46 AM
Comments
Thanks for the lead to FireBug.
Regarding the Web Developers add-on, that is one of my favourite pieces of software, period. It really makes life a little better.
However, I have found it a little buggy with Firefox 2, and I wonder if anyone else has too?
Cheers,
Dave Edwards.
Log Buffer - pythian.com/blogs/about-log-buffer
Posted by: Dave Edwards at December 19, 2006 10:39 AM