Windows Apps for Web Developers

When the editor of Nettuts+ requested an article to show Windows developers love by listing popular web development apps, I was all over it. OSX devs get a lot of attention, so it’s good to mix things up a bit.

What I want to do is list the development tools that I frequently use as a web developer on Windows. It may not include your favorite, and if it doesn’t, please let me know within the comments section. I’m always anxious to find new tools to enhance my workflow!

Writing Code

Visual Studio 2012

I wrote about Visual Studio before, and I think it’s an awesome IDE. It’s feature-rich with tons of bells and whistles.

Web Essential Extension for VS2012

Thank goodness browser-based debugging tools have evolved to what they are today.

This is the extension that makes Visual Studio great for web development. It brings functionality that web developers need such as:

Bundling of files for future processing
Minification of assets
JSHint support for linting of your JavaScript code
Top client-side templating engines including Handlebars, Mustache and JSRender
The LESS stylesheet language with on-the-fly previewing
CoffeeScript and TypeScript

Mads Kristensen, the creator of the extension, is a rockstar!

Sublime Text 2

It’s the little editor that can. Sublime Text is an amazing tool, and Package Control rounds it out with the extensions you need to really streamline your development. Nettuts+ has a TON of articles on this powerful editor, including a full (and free) course.

Browsers

I shoot for cross-browser sites, so having the broadest possible coverage is key. I also like to stay on top of new features that’ll be coming out shortly, and I also install dev and nightly browser builds to stay in the loop. Here’s the list of the browsers I use for testing:

IE10
Chrome – Stable & Canary
Firefox – Stable & Aurora
Opera – Stable & Next
Safari v5.1

One thing to note is that Safari no longer offers its newest version of Safari on Windows. It looks like v5.1.7 will be the last one, but I still keep it around for testing.

Browser-Based Dev Tools

Thank goodness browser-based debugging tools have evolved to what they are today. Otherwise, we’d still be using alert() boxes to test our code. The great thing is that every major modern browser has built-in, sophisticated debugging tools to help you analyze your code, site performance and more. Here’s an article I wrote about IE’s F12 Developer Tools to get you up-to-speed.

Browser Extensions

I find browser add-ons and extensions invaluable to my troubleshooting work. Not only do they help in debugging code, but they also make creating pages easier.

Firefox:

I’m considering Currents for keeping my desktop and laptops in sync.

Firebug – The old reliable that kicked off the browser-tool revolution. Still awesome in my book.
ColorZilla – Gives me a color dropper that can help me snag the color code for most anything on a page. Love it!
MeasureIt – Ever wanted to see the dimensions of something on a page. This is the extension to get.
YSlow – The original add-on created by Steve Souders while he was at Yahoo! to help developers analyze key attributes of their site’s performance.
Page Speed – Steve then moved to Google and came out with Page Speed. Both are awesome and apply his principles for improving site performance.
Web Developer Toolbar – This is always the second add-no I install because it gives me such granular details about my pages. The “Generated Source” option alone is worth it.

Mozilla’s Add-on hub has a number of great add-ons–not only for web development, but for all types of fun things. Be sure to check it out.

Chrome:

Chrome Sniffer – Gives me a quick glance at which libs and frameworks are used on a specific page.
Web Developer Toolbar – It’s the same as the add-on I described above but ported to Chrome.
Pendule – Very similar to the Web Developer Toolbar but I find it’s UI better and it’s resize viewport feature is really nicely laid out.

Version Control

Git has won; hands down. And there’s a plethora of tools available; some are great and some feel overly-complicated.

Git (command line) – Call me old school but I really like using Git via the command line.
GitHub for Windows – With that said, Github’s Windows client is really slick and makes it easy to use Git and their services via an attractive user interface.

Virtualization

Even on Windows, I still need to use VMs for non-modern versions of IE, and while I wish I could test these different versions side-by-side, at least I know I can spin up VM instances and workaround this. Here’s the software I use:

VirtualBox – Easy to use, supports every major OS and best of all, it’s free!
BrowserStack.com – If I need to see how my site will look like on another OS, I just spark up this great service and it creates a virtualized browser session in my own browser. It even supports local development so I can tunnel between my local dev and BrowserStack’s cloud servers.
modern.IE – Microsoft is trying to lower the friction to testing IE and this project is a big step towards that. You can scan your site for common compat issues and download VMs for testing IE versions.

VMs

As I mentioned before, I use VMs for testing non-modern versions of IE. Thankfully, I don’t have to go grab the old VPC images which limited my options for VM software. I can now go to modern.IE and grab VMs for my platform.

IE8 & 9 – Available on modern.IE in a variety of target OSes and VM platforms.
Ubuntu Server – Pull down the iso for one of the most popular Linux distros and go.

Screencasts

Screencasts are one of the best ways of helping to teach developers. For Windows, the best option, in my opinion is Camtasia Studio 8. It’s makes creating, editing and producing screencasts trivial. I was up and running with it in an hour and TechSmith offers free tutorial videos to get you started quickly.

Screen Capture

We’ve all been there. We want to do a quick screen grab but pressing “PrtScn”, and pasting into MS Paint is the suck. My choice for this is Snagit. It binds itself to the “PrtScn” key and allows you to easily choose which parts of the screen you want to grab. It can even do a full page scroll in a browser if the page is longer than the viewport. Once the grab is done, you have a full array of editing tools to tweak the image and post it. Solid tool.

Local Servers

Web developers need web servers, and because I work with both MS and non-MS web developers, I like to have the option of switching between IIS (which a local version comes built into Windows) and WampServer which makes working with Apache, MySQL & PHP so easy.

I also have Node.js installed but I haven’t jumped into it yet. It’s definitely on my radar and a must-have since so many tools (like Grunt) are building on it.

Communication

I’m a remote worker, so staying in contact is vital to me. I try to use as many tools as possible to be able to communicate with my co-workers and peers in the community. Here’s what I use:

Skype – Not sure if there’s any other calling service that works as well as Skype. For voice and video, I don’t know of any better.
Pidgin – This open source IM client is great and easy to setup.
XChat – It’s interesting to see IRC picking up again after IM was the choice of chatter for so long. XChat has served me well in this space

Command Line

My *nix brethren tell me how they spend their lives in the terminal. I can’t say I do the same, but when I do, I choose Windows PowerShell. Personally, it’s just a “feel” thing since the way you work in it (e.g.: accessing directories) reminds me of *nix-based terminals. I’m definitely not takng full advantage of its features, but I do like it.

FTP

For my FTP needs, I’ve not found anything that replaces FileZilla. It’s open-source and jammed to the rim with the features I want. It would be nice if it had AWS support, but other than that, it’s a favorite of mine.

HTTP Web Debugging Proxies

I wrote about web debugging proxies recently, explaining the real benefits of using a third party traffic analyzer to inspect your HTTP requests. These are must-have tools, no matter which OS you work on.

Fiddler – In my opinion this is the best proxy for Windows. So many features and you can get a 300+ page book to boot that tells you EVERYTHING you need to know about using it.
Charles – A VERY close second and it’s cross-platform to boot. This is my choice for OSX and Linux. If you want a consistent UI across all OSes, this is the one to choose.

TCP/IP

Can you believe that Windows devs sometimes have to telnet or SSH into servers? Yeah it happens because not only do we work in Windows, but many of us support *nix systems and users. Go figure. Putty is the way to go for this, and it’s free as well.

Online Storage

The following aren’t necessarily apps, but these online storage services are useful for sharing code with peers:

I’ve also heard about a new service by Carbonite called Currents, which allows you to keep folders and files in sync. I’m considering Currents for keeping my desktop and laptops in sync.

More?

This is a pretty big list and as I was writing it I was floored by the number of apps I regularly use, but I’m even more curious about the number of apps I haven’t heard of yet. I hope this list helps some of you, and I also hope you contribute in the comments. I want to learn about cool new tools.

Nettuts+