Leverage Strong Development Tools from Your Browser

There continues to be very strong demand for web and application development skills in the job market, and there is especially demand for people familiar with open development tools. One of the biggest trends going among developers is leveraging browser extensions focused on developers. 

This is nothing new, of course. Many people are very familiar with using tools like Firebug, which is a development extension for Firefox. In this post, you'll find some of the best browser-based development tools, and you can get them for free.

Of course, one of the most beloved tools for web developers is the Firebug extension for Firefox. If you're deep into development for the web, you probably already use it. With Firebug, experimenting with CSS changes no longer requires that you reload a page dozens of times; using Firebug, you can dynamically edit an HTML element's styling, looking at the effects as you change each variable value. Firebug's JavaScript console also makes it easy to work with JavaScript interactively.

Dragonfly is an open source (under a BSD license) suite of tools for developers from the folks who make the Opera browser. Dragonfly is built to support remote debugging on many types of machines and devices and has a lot of useful tools. We covered it in its alpha version here, and it's made much progress since then.

It's also worth getting to know the add-on marketplace for Chrome. Network World has done a nice collection of developer extensions for Chrome, and notes the following about a couple of extensions you may want to investigate:

"CSSViewer by M.ed is a CSS property viewer. It provides a floating panel that reports on the identity of the section that the mouse is over along with its font, text, color, background, box, positioning, and effects attributes. When you don’t want to fire up developer tools, CSSViewer provided the basic CSS information you need quickly."

"Window Resizer from Ionut Botizan. I have no idea who Ionut Botizan might be but not only is his name outstanding so is his add-on. This add-on lets you resize your browser window on the fly and is, at least in my work, incredibly useful. Clicking on the icon in the menu bar produces a dropdown menu of window sizes which you can customize and you can even export Window Resizer settings so you can configure another machine similarly."

Meanwhile, although it is not browser-based Kompozer, is a huge favorite with developers who are into CSS (cascading style sheets). Kompozer's rendering engine uses Gecko, the same layout engine in Mozilla's Firefox. It stands out for its very easy-to-use CSS editor, and strong WYSIWYG features. You also don't have to be very experienced with HTML or other web development langauges to use Kompozer. Windows, Mac and Linux users can get going with it.

 Want even more open development tools? See our extensive collection of them found in this post.