The Tools I Use

The best tools in the world won’t make a mediocre web developer better at his job, but they can go a long way toward helping a a good developer work faster, smarter, and with more options. I (and I suspect most professional developers) am constantly adding to and refining my toolkit. If I see something new, I check it out and evaluate whether it might hold some value to my workflow. By that same token, I am constantly evaluating the tools I already use. Maybe they become outdated, maybe I find something better, or maybe they were never really that helpful in the first place. When it comes to tools, it pays to be curious, and it pays to never be too precious.

Here’s a brief look at some of the tools and services that make up my current workflow. Note that these are all pretty much workflow tools, and the list doesn’t include things like plugins, frameworks, libraries, or code generators. At some point, I will do a dedicated post covering those extensive topics.

Brackets

I’ve tried all sorts of IDEs and text editors for actually writing my code. Each has its own strengths, weaknesses, and quirks. Lately, I have really been enjoying Adobe Brackets, which I find to be simple and extensible, and I love the fact that it is open-source. On the other hand, it still lacks a couple of really important features – specifically syntax highlighting for PHP and SASS, but it is evolving fast and will no doubt gain those features in the very near future.

WordPress

The web proliferates with CMSs, but WordPress is by far the most dominant at this point. While I can’t say that I have tried them all, I have at least been around the block once or twice (Joomla, Drupal, Unify, anybody?), and, in all honesty, I find that WordPress is the clear winner. Often, the choice of CMS probably is mostly based on what is most familiar to you, but WordPress is easy to get to know because of its logical architecture and large, eager community.

WordPress is flexible enough and powerful enough that I have never had to tell a client, “no, it can’t be done.” And I have had some clients make some crazy requests. Half the time, there is a plugin or tutorial already on the web for whatever strange functionality I am trying to conjure up, and the other half, even if it takes a while sometimes, I can always achieve.

Now I don’t mean to indicate that I always use WordPress or any CMS. I actually love building websites the old fashioned way with pure HTML, CSS, and Javascript, especially for promotional sites or single-page scrollers. Building this way will always offer more control over every pixel than any CMS ever could. But most clients want the ability to make updates and posts to their sites without the need for a developer as an intermediary, and WordPress is my favorite tool for that job.

Instant WordPress

I admit it, in the past I have developed sites on live servers and made changes commando style. But really, doing things that way is a pretty terrible practice. With very few exceptions, local development is almost always a better way to go. But what if you are developing a WordPress site, which requires Apache, PHP, and an SQL database? If you are a Windows user, look no further than Instant WordPress.

Instant WordPress, with a one click install, will set up a local server, the database, and the entire WordPress install for you. Even better, the install is portable, so you can install it to a USB drive and take it with you. You can also install as many instances as you like, so you can go nuts and set up Instant WordPress for every site you administer.

For Mac users, I have it on good authority that MAMP is an excellent tool for local WordPress development. Much like its Windows counterpart, WAMP, the install simply runs a single local server with Apache, MySQL, and PHP upon which you can set up your WordPress installs.

SASS / Prepros

I’ve been something of a latecomer to the world of preprocessing, but now that I am developing with SASS (with Compass, of course) I can’t believe how much it has added to my workflow. If you have no idea what I am talking about, watch this hand screencast from CSS-Tricks.

While SASS purist will no doubt demand that running it through the command line is the only way to go, I am quite happy to let a GUI app do all of the work for me. Enter Prepros, a free, open source compiler. While it was, until recently Windows-only, version 2.1 comes with the introduction of an OSx version (a popular, Mac-only alternative is CodeKit).

Along with SASS, Prepros compiles LESS, Compass, Stylus, Jade, Slim, Markdown, Haml, and CoffeeScript, and will also minify your Javascript.

Typekit

In the dark ages of about two or three years ago, websites were pretty much limited to only a handful of typefaces. Flash forward to today and suddenly the internet abounds with fonts of every description. One of the driving forces behind the webfont revolution was Typekit. Now that they are owned by Adobe, I get the service as part of my Creative Cloud subscription at no extra charge.

There are plenty of other webfont services out there (WebInk, Fonts.com, Google Fonts), but Typekit provides a broad enough (and ever-growing) selection of fonts that I rarely feel a desire to reach for any other option. On the rare occasion that a client requires the use of a specific typeface not hosted on Typekit, I can just set them up with their own licence through whatever service happens to host that particular font.

One procedural dilemma that I am having with webfonts is how to deal with clients who want to use fonts that are hosted on Typekit. Typekit caps monthly pageviews at 500,000. I haven’t approached that limit yet, but each client using fonts from my account moves me a bit closer. Should I simply provide their fonts from my Typekit account, or should I require them to purchase their own Typekit subscriptions? Or perhaps I should provide access to my Typekit account, but charge a small monthly fee? What do you think? Let me know in the comments.

IcoMoon

With high-resolution displays and responsive websites on the rise, crisp scalable graphics are increasingly important. SVG is a great format, but browser implementation still isn’t perfect (thanks again, IE8) and certain servers seem to have trouble with the MIME type. This is where icon fonts can be a great tool – You get to serve vector graphics as part of a font set, which you can easily scale, color, transform, etcetera with CSS.

For browsing icon sets, adding your own SVG graphics, and creating custom icon fonts, IcoMoon is a great tool. If you need to provide PNG fallbacks for some reason, it also generates sprite-sheets of your icons. I use the Chrome app, which works offline.

Alternatives include Fontello and We Love Icon Fonts. We Love Icon Fonts hosts the icon fonts as well, similar to how Typekit hosts type fonts.

GistBox

I don’t know about you, but I have amassed a pretty huge collection of code snippets. Instead of rewriting code that I have already written a hundred times before, I simply save a snippet that I can reuse whenever. Even more useful are the less routine snippets – If you’ve ever had to spend hours googling for just the right solution to an obscure problem, you don’t want to ever have to go through the same trouble again. Save a snippet, and the solution is yours forever.

The problematic part of using snippets is how to manage them. Many IDEs have built-in snippet management, but what happens if you switch to another program? What if you switch computers or your machine craps out? What about categorization and searching – most IDEs don’t include them. The perfect solution that I was delighted to stumble upon one day is a Chrome app called GistBox.

GistBox is a web-based app that saves your snippets as gists (simple git repositories) and syncs them with your GitHub account. Doing so takes care of backup and portability – All of your snippets live safely in the cloud. It also includes categorization, search, code-highlighting, and other handy features like sharing.

I have been offering alternatives for most of the items in this list, but I know of no comparable tools. Know of one? I’d love to hear about it in the comments.

GitHub for Windows

Version control is a must, especially for anyone working as part of a team. But also especially for everyone. Version control ensures that you can always recover lost code or roll back any change you have made, and GitHub is my go-to. (I use SVN for my WordPress plugins, but the user experience makes me want to punch my own face.)

Again the purists and sticklers will cry out the I should be handling git through the command line, but to them I say, “And just why should I do that?” I am not at all averse to rolling up my sleeves and digging into the command line if the situation really calls for it, but I find GUI apps to be much more friendly and easy to use most of the time. And the Windows and Mac GitHub apps are great, especially for a fairly basic user like me.

FileZilla

There is a lot of talk about deployment these days, and a lot of people favor rolling in deployment with version control. Apps such as Beanstalk and FTPloy exist to make this possible, but frankly I don’t see that these apps provide enough added value over old fashioned FTP to justify the monthly subscription. Maybe for large teams or huge projects it makes sense, but I really don’t mind dragging a folder from left to right whenever I am ready to deploy to the web.

FTP clients abound, but I have a happy relationship with FileZilla. Their website looks like 1997’s vomit, but FileZilla is free, feature-rich, easy to use, and very stable. If you are using preprocessors and version control, it is easy to set up filters that tell FileZilla to ignore the extra files entirely.

What do you think?

Are there any tools that you can’t live without or have revolutionized your workflow? Tell us about them!

2 Responses to “The Tools I Use”

  1. Frédéric Bolduc

    Great article, I’ve found that I use most of the tolls you also use. I didn’t know about Adobe Brackets, I will definitely check that out, although I’m currently very happy with Sublime Text.

    As for your TypeKit problem, my solution to that was just to steer clear from TypeKit and use Google Fonts instead. I’ve never really had issues finding a great font there, and you can’t beat the low low price of free. Were I be in your shoes, I think I’d either bundle a one-time fee in the initial invoice or either setup a yearly fee, monthly seems too nagging for such a small amount. You probably do some yearly maintenance of some sort on your websites anyway, you could also bundle the fee there. I find customers are much less annoyed to recurring fees when they don’t have to pay them as often, and even less when they’re not the only fee being paid.

    Reply

Leave a Reply