I have mentioned Firebug before, which is an extension to Firefox that allows you to do some incredible things with Javascript, HTML, and CSS.
One of the more powerful things it does is let you set breakpoints in your javascript. A breakpoint is a debugging tool that causes the script execution to stop at a specific line in your code so that you can examine the state of the script at that point, and potentially change values. I think that if you've never used breakpoints in your development before, then you're really crippling yourself in terms of how you debug. The problem seems to be that nobody really teaches this skill.
So I've put together a beginner's-level tutorial screencast of how to use Firebug. It covers the basic use of breakpoints, inspecting variable values at runtime, changing the values of HTML and CSS at runtime, and a few other neat Firebug goodies. It's not comprehensive, but it does give a pretty good introduction to what you can do with Firebug, and I think that anyone who develops on the web that doesn't already use it will benefit from it. I'm really shocked by the number of seasoned web coders I've met that don't use this tool - it's too handy....
more