Automating Gmail

One of Gmail’s hidden treasures is how easily it can be automated. Its filtering system is widely known, but the real treat is script.google.com, which lets you script Gmail. The scripts are written in a language called “Google Apps Script” (which is more or less JavaScript), and there is a wide-ranging API that lets you control almost all of your Google services (Drive, Analytics, Calendar, etc). These tasks can be run periodically, in response to triggers, or ad-hoc.

An example: automatically mark emails as read

If your inbox has thousands of unread emails that are unlikely ever to be read, and you are anxious about this, you might benefit from automatically managing your unread email count. I’ve created a script which, on weekdays, marks as read any unread email older than 24 hours. This lets me skim the subject lines in my inbox, open the emails that seem interesting, and ignore the rest, which will quietly vanish a day later.

Combined with Priority Inbox, this script helps me have a high ratio of “effectiveness at email” to “attention spent on email”, which I lack if I have to read every single message in my inbox. Despite how risky this approach seems, it hasn’t caused me to miss out on anything important.

You can see my “Mark All As Read” script here.

Development

Scripting Gmail is very approachable. The API covers lots of functionality, and the documentation is comprehensive. You don’t need an in-depth knowledge of JavaScript. Google even provides a little web-based IDE in which to edit and debug your scripts. My one complaint is that there is no mock environment for testing - you have to develop your scripts on a real inbox. If this is a problem for you, you can use a dummy email account for development.

In conclusion

In the future, I’d be interested to try script.google.com to automate my use of other Google services. For now, it’s proven extremely useful at managing my email, and I strongly recommend it.

How to Replace a Roland Micro Cube Speaker

Micro Cube Speaker Connection

A few years ago I dropped my Roland Micro Cube guitar amplifier and ripped the speaker cone. As a result, it would make terrible farty noises if played above a certain volume. Last week I replaced the speaker - here are the steps I followed.

Tools needed: a screwdriver, a phone, and a credit card. No soldering iron required.

  1. Call Roland Customer Support and ask for a replacement Micro Cube speaker, model number W120FP70-00C. It costs about $30 with tax and shipping. Mine arrived after about two weeks.

  2. When you have the new speaker, set the Micro Cube down with its grill facing up. Unscrew the grill, then unscrew the old speaker from the mount.

  3. Gently remove the old speaker from the mount, so its connectors are visible.

  4. Pull the connectors out of the old speaker - they’ll slide off with a little force, as shown in the above photo - and connect them to the new speaker. The connectors are different sizes, so don’t worry about connecting them incorrectly.

  5. Mount the new speaker and reattach the front grill.

  6. Plug in your guitar and rock out.

This is the most straightforward method I’ve seen to replace a Micro Cube’s speaker. If you want to try a non-Roland speaker, there are tutorials for that online too. Happy jamming!

A Simple Image Slider without jQuery

I’ve used jQuery since I began my web development career, but I sometimes feel like it makes life too easy. In the spirit of rejecting complacency, I wrote a simple JavaScript image slider without jQuery or other libraries.

You can find a demonstration of the image slider here, and the Github repo is here.

It was illuminating to see how much I take jQuery for granted. For example, I wanted to add a button to the page. jQuery makes this very easy:

container.append('<button>text</button>');

Without jQuery, however, you have to be a little more verbose:

var button = document.createElement('button');
button.innerHTML = 'text';
container.appendChild(button);

I wanted to add a wrapper element to my group of <img> tags. This is a breeze with jQuery:

outer.find('img').wrapAll('<div />')

Without jQuery, you have to flex your JavaScript muscles:

var wrapper = document.createElement('div');
var outer = document.getElementById('whatever');

var nodes = outer.childNodes;
var elementsWidth = 0;
for (var i = 0; i < nodes.length; i++) {
  if (nodes[i].nodeType === Node.ELEMENT_NODE
    && nodes[i].tagName === 'IMG'
  ) {
    elementsWidth += nodes[i].width;
    wrapper.appendChild(nodes[i]);
  }
}
outer.appendChild(wrapper);

I looked at jQuery’s source code after I finished the exercise to see how $.wrapAll was implemented, and unsurprisingly their implementation is very elegant. I think the average web developer can learn a lot from reading the jQuery source; for an excellent introduction, check out this screencast by Paul Irish.

This proved to be a fun and educational task, and it renewed my appreciation for jQuery’s simplicity and effectiveness. If you want to better understand the gifts jQuery gives you, I strongly recommend you try a little project without it.

My Mac Setup

Getting a new Mac is a lot of fun, but it can be tedious to install all your favourite software packages, especially if you’re a developer who uses lots of them. There’s something to be said for keeping a list of URLs to your usual tools, so that you can set up a development environment faster. Also, who knows - perhaps it would be fun in the future to look back at your toolset and reminisce.

Without further ado, here is the software I’ve installed on my work-issued MacBook Pro:

The Basics

Homebrew Packages

Assorted Productivity

Web Browsers

(I hardly use the non-Chrome browsers now that Web Inspector is so good, but you’ve gotta keep them around.)

Miscellaneous Steps

That’s pretty much everything. I’m sure that in a few years this list will look incredibly outdated, but right now, these are my favourite utilities with which to make websites. Thanks for reading!