Better JavaScript Debugging in 15 Minutes
I have created a 15 minute screencast that will show you how to Debug JavaScript with Firebug. I cover a number of concepts such as using the console, interactive debugger and timer features of the Firebug extension for Firefox. If you haven’t tried Firebug yet, I’m sure that this screencast will convince you to make it a part of your JavaScript coding workflow.
I hope you enjoy my first screencast! I plan on doing a few more over the next couple of weeks, so I would appreciate your feedback.
Launch the screencast now! (requires Flash)



Great screencast! I wasn’t aware that Firebug was so powerful.
Point of irony: your screencast page throws a Firebug error;)
Cheers,
Oliver
Odd - My Firebug shows no errors! It is worth noting that Firebug often doesn’t refresh itself properly when moving from page to page or from tab to tab. Maybe it was a leftover error message!
JavaScript Debugging mit Firebug Screencast…
Jim Rutherford (Digital Media Minute) hat einen interessanten Screencast online gestellt, der einen Teil von Firebugs tollen Fähigkeiten sehr anschaulich erklärt. In 15 Minuten umreisst er Schritt für Schritt das Debugging von JavaScript mit den schon …
[...] Jim Rutherford hat einen interessanten Screencast zum Umgang mit dem JavaScript-Debugger veröffentlicht. [...]
Thankyou for the screencast..
I am off to download it now!
Jim,
You’re right. I refreshed and it was gone. A bug in Firebug - even more ironic;)
Great stuff.
I did notice one error though. At the end when you are naming your timers, you name the End timer different than the begin function. Could that be why there was a 0 ms?
Regardless, thanks for the screencast, I’m on my way over to download Firebug now!
Thanks for putting this together! I think the source and style inspector needs a good screencast.
This tool isn’t only for devs. Designers are going to love it too
Tom - That is my plan for another screencast next week!
Michael - Thanks for pointing that out! I will get it fixed as soon as I get a chance!
Well done. Succinct, clear presentation. I did find that I had to turn the volume to max.
Perfect pages… tnx
[...] FireBug ist eine Erweiterung für Firefox, die sich an Webentwickler richtet. Zwei Screencasts führen in die Funktionsweise von Firebug ein. FireBug - Firefox Erweiterung für Webentwickler auf pixelgraphix zeigt die grundlegenden Funktionen und Better JavaScript Debugging in 15 Minutes von Digital Media Minute zeigt, wie man Javascript-Fehler mit Firebug bereinigen kann. [...]
I appreciate your video which taught me the basics of debugging for js. Thanks. One tiny nit: it was difficult for me to hear.
Excellent intro! Thank you.
Great intro. Very instructive. Keep up the good work!
Your screencast came just in time for me. Previous and infrequent attempts to understand how to use firebug were unsuccessful. The screencast gave me a lot of important insights. Is there a site that lists all the screen casts and tutuorial pieces? Great job and a greater THANK YOU!!