Last time we told you about 10 essential resources for designers. Today we shift our attention to developers to give you a few extra tools that will improve your efficiency and productivity. Here are 10 of our favorite developer resources that we use on a daily basis at ZURB.
In fact, it can tell you what CSS styles are being applied to any given HTML element, pointing you to the exact line in the file that contains that declaration. Firebug lets you be quick and dirty with your coding by allowing you to manipulate and preview styles on the fly, without saving and refreshing over and over again.
YSlow is a plugin for Firebug that gives you extra tools for improving the speed and load times of your web pages. YSlow will run a series of tests on your page, displaying results that show you exactly what you can change to improve page load time and performance.
It took us several months to find a decent Mac application for Subversion, and although we've all learned to use Subversion entirely from command line by now, we recently discovered Versions and have been very impressed with the simple interface that it provides. The price tag, after the trial runs out, is about $50, but it's easier to justify a purchase for a tool that is used often and increases our productivity.
On top of that, the Versions team has turned us on to a very useful and free subversion repository called Beanstalk. It integrates well with Versions, and has an excellent web interface for browsing recent activity in each repository, which is very handy when working with a team of designers and developers.
VMware Fusion is a Mac virtual machine, an emulator for running several operating systems on the same computer. We typically use it to run Windows XP and Internet Explorer—and it works great. You can try it free for 30 days, but make sure you have the original disc and license key for the operating system you're installing.
Let's face it, sifting through programming APIs can be a time consuming and often visually strenuous task. This tool combines just about any API you can imagine into a clean interface with a simple search auto-complete to help speed up your searches. And when you're really in a bind, you can search through several APIs at the same time.
Sometimes sending code over email and IM doesn't work as well as planned. Josh Goebel spent his free time writing a sweet little web app called Pastie that lets you easily paste in a code snippet and send it as a link to your friend or coworker. No hassle and no messy formatting—all you see is your code. That's all there is too it.
If you're familiar with grid systems, you're probably also familiar with how hard it can be to code for them too. Well here's a great little template system that will give you a head start on your CSS layouts. You can start with a 12 or 16 column grid, and use one of the prepackaged design templates for Photoshop and Illustrator. We use our own grid system here, but if you're looking for a starting point, the 960px layout is a great place to start.
Here's a Firefox plugin that keeps you honest about your HTML code. At a single glance you'll be able to tell if the page you're viewing has valid html or not. Not only is this a valuable tool for debugging HTML, it also makes for a great learning tool by constantly giving you tips on how to fix each line that doesn't validate.
If you're a Mac user, you'll have to grab it here »
Did we miss one?
That's 10 of our favorite developer resources. Drop us a comment if you've got a couple more to add to the list. We're always open to hearing about new tools of the trade that improve our efficiency and make our lives easier.
Also, make sure to keep your eyes peeled for more posts in this series, we've haven't given away all our secrets just yet ;)