Tools of the trade

It’s been awhile since I’ve posted anything overly technical here, but it strikes me that a “snapshot” of what I do (for work) and how I do it (the tech) might be useful to some.

What I do is web development for Smart Solutions here in Bend. Smart Solutions is a web and software development company and the company essentially has three main divisions: custom software development, SEO (search engine optimization—I know, that’s another post), and web development. All these “divisions” work pretty closely with each other—there’s a lot of line-blurring, actually—but for the most part developing websites for clients is what I do.

The platform we develop for is Pixelsilk—the custom Content Management System (CMS) that Smart Solutions developed from the ground up (and is still developing). The marketing pitch is, it’s SEO-optimized, gives you full control of your HTML, gives you all the tools you need to interact with social media, etc. etc. etc. Move past all that and get to the meat of it, and the primary things I really like about Pixelsilk is that you interact with all of your content and data inside of the system (rather that working with offline files that need to be FTP’d to various places), there’s a powerful and comprehensive Javascript API (giving me the capability to extend the system in new ways), it gives you the ability to re-use code and libraries, and that it’s entirely web-based—-meaning I can work on a site from any browser.

I’m also the company’s defacto WordPress developer—yes, we host WordPress blogs in addition to Pixelsilk sites—and a few other PHP applications so I still get a chance to flex my PHP muscles every now and again. (Smart Solutions is otherwise a Microsoft and .NET shop.)

Of course, I use a number of additional tools to develop for the web, and that’s what this post is really about.

What I use is a mishmash of online and offline tools. In the “offline” category I make use of:

• The GIMP, open-source graphics software. Free to download, and fairly powerful, there’s still a lot I’m learning about it, but I do most of the graphics work I need to accomplish with it. (Photoshop is the standard for the company, but I’m not versed in it.)
• Microsoft Visual Studio, various flavors. Sometimes moving the HTML/Javascript/CSS into an editing tool is easier to deal with, and I frankly like the Visual Studio editing environment best of the various programs I’ve tried for these types of files.
• PHP Designer. I actually use the (older) free version because, well, it’s free and does what I need, it’s fairly lightweight, and it has the same kind of keyboard mappings and editing environment as Visual Studio.
• Notepad. Yes, a stripped-down plain text editor. You’d be amazed at how much I have this open.
• FileZilla. Yes, sometimes you still need an FTP client, and FileZilla is a good free Windows client.
• PuTTY. A great free SSH client, because I spend a non-insignificant amount of time on a *nix command line.
• Apache/PHP/MySQL: Installed on my Windows boxen as test environments. Pretty critical especially when developing WordPress themes.

Online:

• Google Chrome and Mozilla Firefox as my primary browsers. I actually use Chrome as my primary while at work and Firefox while at home; these are both highly standards-compliant web browsers and I know if I can get something to work properly in them, then that is in fact how it should work. Chrome has some great built-in development and inspection tools; in Firefox I employ a number of extensions.
• Web Developer (Firefox plugin): A variety of pretty essential additions in toolbar format for all aspects of web development.
• Firebug (Firefox plugin): Probably the #1 plugin I would recommend; it adds code inspection, network information, Javascript debugging and inspection, and all manner of incredibly useful tools—you can’t be a proper web developer without this installed. (Chrome’s built-in tools come pretty close to this.)
• Page Speed (Firebug add-on): A fantastic add-on to Firebug that analyzes the overall page performance (using Google’s recommended benchmarks/tests) and gives you hints on what you can improve.
• Header Spy (Firefox plugin): Shows HTTP headers on the status bar, useful for troubleshooting server information.
• AFOM (Firefox plugin): Incredibly useful plugin for the Windows version of Firefox which fixes the memory leak prone to Windows Firefox.
• Internet Explorer: Of course, you can’t develop for the web without checking your work in IE, and IE8 has a decent set of developer tools built-in—including the ability to switch between IE7, IE8, and Quirks modes.
• W3C Validator: Because you want to make sure your site code validates and works properly, right?
• jQuery: The best Javascript library out there. If I’m doing anything in Javascript these days, 99% of the time it’s using jQuery.

There is of course other tools I use that fall primarily under the heading of “my own sites” and are not necessarily web development per se: Google Analytics and Google AdSense are two examples. That’s probably another post.

This list is likely incomplete—I may have missed an item or two or three, and if I think of any I’ll update it. But this gives an idea of the various tools I’m employing currently and to a large extent what I’d consider the minimum number any good web developer should be using these days.