The Sweet Spot

Speeding up Rspec/Cucumber feedback times without sacrificing coverage

andrewhao — Sat, 28 Apr 2012 00:27:17 +0000

Rocket Fuelled Cucumbers

View more presentations from Joseph Wilk

One thing the Blurb devs have been discussing is how we can speed up our test feedback cycles without sacrificing coverage. There’s some good tips (mainly Rails+Rspec/Cucumber) in the presentation such as:

Don’t run all the tests when developing (tag your tests by function)
Parallelize, chunk tests over machines/cores using Testjour/Specjour, Hydra
Don’t run all the tests at once. Tests that never fail should nightly.
Instead of spinning up a browser for acceptance tests, can you use a js/DOM simulator (e.g. envjs via capybara-envjs, or celerity)

Backup, backup, backup

andrewhao — Mon, 23 Apr 2012 15:02:05 +0000

Well, the inevitable happened: I finally experienced a hard drive failure. It’s pretty incredible that in the twenty-odd years I’ve been around computers I’ve never had the horror of losing a drive.

Friday rolls around and my Macbook Pro decides to freeze up on me. Strange, I think to myself. It’s making a clicking noise. Crap.

Luckily, I’ve been fairly good about making backups and copies of my work. Here’s my general strategy:

Work/code: keeping local changes on a separate branch and pushing it to a remote Git branch every so often.
Everything else: I keep one local copy here with me in Oakland, and have another copy offsite. I rsync my files out to my server at home, which has a cronjob set up to sync with the offsite copy at my parents’ home (I run a Pogoplug with Archlinux and a couple of external drives connected to it — fantastic and totally recommended for a cheap and low-power server setup).

There was a minor scare this time around though — I had some photography work (and an engagement photoshoot!) lying around that almost didn’t make it to the first stage rsync with my local server. Fortunately, I had the foresight to keep my photos backed up to a random local hard disk, and the rest remained on the memory cards (and some even on a shared Dropbox folder that saved my butt!). Most frustrating thing was learning that I had forgotten to back up my Lightroom catalog, so all my edits were lost. At least I have the original shots.

One thing I think I’ll try doing from here on out — saving my Develop settings/presets directly to the DNGs themselves before backing up. That way if I ever lose my LR catalog, the edit settings are still embedded in the original files.

Jeff Atwood reminds us to keep backups around on multiple disks. With the price of storage so low, what’s your data worth to you? How are you keeping your backups?

HAML object references

andrewhao — Thu, 12 Apr 2012 21:40:09 +0000

Did you guys know that you can use the ‘[ ]’ brackets in HAML to automatically set the id and class on a tag, kind of like Rails’ tag helper?

# file: app/controllers/users_controller.rb

def show
  @user = CrazyUser.find(15)
end

-# file: app/views/users/show.haml

%div[@user, :greeting]
  %bar[290]/
  Hello!

is compiled to:


  
  Hello!

Keeps things nice, concise and DRY. See the HAML documentation.

RSpec order-agnostic array matching

andrewhao — Sat, 24 Mar 2012 01:09:40 +0000

What’s that? You want to write an expectation for an array but your method returns the Array in a nondeterministic ordering?

Simple. Write:

my_method.should =~

See the source.

Ohm gotchas

andrewhao — Sat, 21 Jan 2012 01:19:50 +0000

Here’s a list of things that have been annoying, or at least a bit frustrating using Ohm, the Redis ORM, in a Rails app. Beware to those who assume Ohm is ActiveRecord in new clothes. It is, but it’s not:

CRUD

Don’t make the mistake of treating your Ohm objects like AR:

ActiveRecord	Ohm
`destroy`	`delete`
`self.find(id)`	`self[id]`
`update_attributes`	`update`
`create`	`create`

Also note that Ohm’s update_attributes behaves differently from Rails` — it doesn’t persist the updates to DB. That owned me for the good part of the day.

Callbacks

Thankfully, these are ActiveRecord-like with the addition of ohm/contrib.

Associations

ActiveRecord	Ohm
`has_a` or `belongs_to`	`reference`
`has_many`	`collection`

Read this article if you’re considering creating associations from AR objects to Ohm objects and the other way ‘round.

Now at Blurb

andrewhao — Mon, 21 Nov 2011 19:12:53 +0000

I should have mentioned this long ago, but I started work at Blurb in early August. It’s been a quick ramp-up and I’m loving it there, surrounded by smart engineers and great designers. I do Rails/JS work there, and I’m building a lot of chops around Agile/TDD methodologies.

Anyways, they had me do a Camera Thursdays blog post, which I wrote about my Nikon/1.8 camera combo:

mmtss, a collaborative loop station

andrewhao — Sun, 02 Oct 2011 17:53:45 +0000

mmtss is a loop station built for live performances.

Let’s make music together! This project simplifies a traditional loop tracking station and is designed for interactive collaborative music performances.

The idea: Everybody adds or modifies one “part” of a 32-bar loop. The user gets to play an instrument over the existing mix and record the 32-bar phrase when she or he is ready. Once the person is finished, the project selects another instrument at random for the next viewer to record.

It’s an Ableton Live controller serving a Webkit view, backed by node.js on the backend and socket.io + RaphaelJS on the front. Communication is done through a LiveOSC Live plugin via sockets.

Displayed at the Regeneration “We Collaborate” art show in Oakland, CA. 9/24/2011.

Screenshots

mmtss in practice/playback mode. Here the user is able to practice/mess around with the current instrument to prepare to record the next track.

Pressing “record” puts the user in a wait state. They are prompted to begin recording when all the black boxes count down and disappear.

mmtss in record mode.

More screenshots: http://www.flickr.com/photos/andrewhao/sets/72157627640840853/

Source code

Github: http://www.github.com/andrewhao/mmtss.

MIT/GPL-sourced for your coding pleasure.

Installation

Make sure you have npm installed: http://www.npmjs.org
Copy lib/LiveOSC into /Applications/Live x.y.z OS X/Live.app/Contents/App-Resources/MIDI\ Remote\ Scripts/ folder
Set it as your MIDI remote in the Ableton Live Preferences pane, in the “MIDI Remote” tab.

Running it

Open Mmtss_0.als as a sample Live project.
Install all project dependencies with npm install from the project root.
Start the Node server with node app.js from the root directory.
Open a Web browser and visit localhost:3000

Modifying the sample project

You can modify this project to suit your own needs. Note that there are two sets of tracks; instrument (MIDI input) tracks and loop tracks that actually store clips.

For n tracks, you can add or remove your own instruments. Just make sure that instrument at track x corresponds to track x + n.

Credits

Design and architectural inspiration taken from vtouch, a HTML5/Node/Canvas Ableton controller.
Original LiveOSC source is found at: http://monome.q3f.org/browser/trunk/LiveOSC. We use a different fork of the project at:http://github.com/vnoise/vtouch.
Super sweet CSS3 rocker widgets courtesy of Simurai: UmbrUI

License

MIT and GPLv3 licensed. Go for it.

You will, however, need to get a license for Ableton Live yourself.

The handsome collaborators

Andrew Hao: http://www.g9labs.com
David Luoh: http://www.inkproj.com

Introducing Boink, a photobooth for the rest of us.

andrewhao — Wed, 10 Aug 2011 16:25:10 +0000

My friends were complaining that wedding photobooths were too expensive to rent. Could we make one for them?

Glen and I from the Porkbuns Initiative stepped up in full armor, ready to help.

What is it? It’s a self-running photobooth that uses your Mac for brains and DSLR for eyes and a Webkit browser for its clothes and a photo printer for… a printer. You can connect an iPad as the frontend for a nice visual touch (pun intended).

We built it on a backend Rails instance, pushing SVG+HTML5 in the frontend and using the gphoto4ruby gem as a camera library wrapper.

All dressed up and ready to go.

An early UI prototype.

This comes out of the printer.

Try it out

Check it out on Github.

Chat App – Frontend Prototype

andrewhao — Sat, 02 Jul 2011 01:21:05 +0000

Some UI work I did for a stealth startup in early ‘11. Responsible for look & feel and frontend chat interactions. jQuery/UI communicating to a CakePHP/nodejs backend.

We developed this prototype with statecharts, a concept commonly found in event-driven programming and with which I first learned from Sproutcore. I found it really helped map out all the complex user interactions we had to deal with on the page.

See more screenshots from the set.

BRUTE LABS UX project: StudentsConnect

andrewhao — Wed, 15 Jun 2011 16:01:42 +0000

I’m on a team with BRUTE LABS, a volunteer-led design agency working on StudentsConnect, a prototype project making chatroulette-style interactions connecting students from the global North and South. Here’s a UX flow we worked on:

BRUTE LABS - StudentsConnect UX

View more presentations from Andrew Hao