Firefox by Mozilla, Inc.

Firefox is not just a browser, but the best development tool for web applications. It complies with almost every web standard, is extremely fast, and has the most plugins that aid developers. Keep in mind that a web application developer should always code first in a standards compliant browser, then tackle less compliant browsers, such as Internet Explorer.

There are a large number of useful FireFox extensions, but here are the ones that I find most useful:

Firebug by Joe Hewitt

FireBug is the most powerful web development tool for FireFox. With FireBug you can monitor AJAX/HTTP requests, view and edit live CSS, delve into the DOM, mark breakpoints to step through JavaScript, and it can be extended by other plugins. I use FireBug everyday and it is my primary development tool.

Venkman (Mozilla JavaScript Debugger) by James Ross, Robert Ginda

This was the original JavaScript debugger for FireFox, and is also great for marking breakpoints and stepping through JavaScript code. I used to occasionally use this addon as a backup for or in parallel with FireBug, but have not needed it in over a year.

Web Developer Toolkit (WDT) by Chris Pederick

This toolbar is filled with a lot of little features that increase productivity. Some of the most helpful features are: live cookie editing, outlining elements by tag type, and resizing to browser to support different resolutions. After spending some time and get to know the features, I am sure you will find something that you cannot live without.

View Source Chart (VSC) by Jennifer Madden

This is similar to the standard view the page source, but more powerful, as it is more readable and includes elements that were rendered by DOM scripting and AJAX. However, I no longer use this addon as FireBug has similar features.

Internet Explorer (IE) by Microsoft

Unfortunately, after your development in FireFox, you then need to look at your web application in Internet Explorer. Although, it is far easier and efficient to not support IE, your business demands will probably require you to support IE, as it has the largest market shared among web users. And to make matters worse you also need support the last few versions of IE, as many users are not tech savvy and often corporations mandate their employees use older versions of IE.

Fiddler by Microsoft

Fiddler allows developers to see most network traffic in and out of your computer by using a proxy. This is useful for monitoring http and AJAX request in IE. You can also use this with other browsers (see the documentation).

Multiple IE (MIE) by Manfred Staudinger

You still need to support IE 6 for a few years and this tool allows you to run an IE 6 instance without launching a virtual PC. You can also see how your pages behave in IE 3, 4.01, 5.01, 5.5, and 6, without interfering with the latest version of IE. The only problem I have ever encountered is an occasional memory leak having to do with older IE versions and displaying elements with the opacity style.

IE Developer Toolbar

Although, it has a long way to go to replace the Web Developer Toolbar of FireFox, this is must-have tool for IE 6+. You can outline and navigate through the DOM, measure page elements, see and change applied styles, and more.

DebugBar for IE8

This is the latest tool in your arsenal, combining IE Developer Toolbar and Microsoft Script Debugger to have a tool that attempts to rival FireBug. It does not, but at least it&rsquot;s a step in the right direction.

Opera

Opera has been around for a long time, but has never really claimed much market share, except on mobile platforms. I usually check to make sure my web applications look decent in Opera, and since it is mostly standards compliant, anything that works in FireFox, tends to work in Opera as well.

Safari

Safari is blazing fast and with the new found popularity of MAC computing and the iPhone, it is becoming an important player in the browser market. It is based on Web-Kit technology, and is also mostly standards compliant.

Web Inspector

This is part of Safari 3+. It allows you to inspect the DOM, to see the styles applied to elements and the surrounding HTML. If you also need to support earlier version of Safari, I suggest you test and fix Safari 3+ first. Then run separate Safari installations for each version and see if the bug is fixed, before trying to debug in those less hospitable versions.

Chrome

Google has entered the browser market as well with its Chrome browser, which is also based on Web-Kit. So it renders very similarly to Safari and will often have the same issues. Additionally, Chrome creates a new process for each tab, so it should crash less frequently.

Non-Browser Tools

JSLint by Douglas Crockford

Before releasing your JavaScript code to a production environment, run it through JSLint to help prevent many easy-to-overlook errors. Also, if your code validates with JSLint you can use a minimizing or obfuscation tool to reduce and protect your code.

JSMin by Douglas Crockford

If you have more than 50k worth of JavaScript, then the downloading of your JavaScript files becomes an issue on machines with slower connections (if you have more than 200k of JavaScript, then you might even have issues on high-speed connections). To reduce script download times you can combine your JavaScript into fewer files, and then remove needless white spaces and comments from your production code. JSMin is a command-line application that usually reduces the file size by 33% and removes your comments.