Vagrant for mobile web development

The problem: You code your mobile web apps on your desktop, and it’s hard to see the changes.

Until OS X Mavericks kills the feature, you used to be able to daisy chain your local WiFi off your ethernet connection, and serve your local environment to your mobile devices via WiFi. It was a sad day when they killed it. It made development so easy. I couldn’t find any other alternative that didn’t involve time consuming network hacks. The XIP service got me close, but it was unreliable when I was at a location with high network security.

All was hopeless until I found Vagrant Share.

Now this is my workflow.

  1. I code.
  2. I save.
  3. My local browser refreshes. My iPhone refreshes.
  4. Repeat.

Vagrant Share allows you to share your Vagrant environment with anyone in the world, enabling collaboration directly in your Vagrant environment in almost any network environment with just a single command: vagrant share.

Vagrant share has three primary modes or features:
HTTP sharing will create a URL that you can give to anyone. This URL will route directly into your Vagrant environment. The person using this URL does not need Vagrant installed, so it can be shared with anyone. This is useful for testing webhooks or showing your work to clients, teammates, managers, etc.

SSH sharing will allow instant SSH access to your Vagrant environment by anyone by running vagrant connect --ssh on the remote side. This is useful for pair programming, debugging ops problems, etc.

General sharing allows anyone to access any exposed port of your Vagrant environment by running vagrant connect on the remote side. This is useful if the remote side wants to access your Vagrant environment as if it were a computer on the LAN.

The quick & dirty install.

I highly encourage you to head over to the vagrant site and check out their docs. They’re pretty detailed and it’s important to get a solid grip on what’s going on. That said, if you plug this into your machine, you’ll probably be alright.

Go here & install Vagrant.

$ mkdir vagrant_getting_started

Read More»

Sublime Monoaki across Chrome & Terminal

I spend all day using tools like Chrome, Sublime Text, and Terminal. A few months ago I spent a few hours customizing them to make them easier on the eyes. Here are some of my best plugins.


I’ve really grown to love the Monoaki color scheme in Sublime Text. I found a plugin to make Terminal match. It’s a little thing, but somehow makes a big difference.

Download the Monokai.terminal theme here.

I’m also using a customization to the Bash prompt written by my friend Jesse Earle. My Bash prompt now shows me my current Git branch, and my current directory (so nice having it in front of you). It also uses funny emojis to separate the lines. bash_profile can be downloaded here.


Chrome DevTools

I found a theme for Chrome’s DevTools with a darker background and higher contract colors than default. It makes a lot of difference. It’s not exactly Monokai, but it’s a lot easier to look at than the default white.

The installation is a little tricky, but worth it.

Chrome DevTools

Category: Product #: Regular price:$ (Sale ends ) Available from: Condition: Good ! Order now!
Reviewed by on. Rating:
Read More»

Hammer.js for touch events in a browser.

Whenever I need to implement touch events on a web page, I reach forĀ Hammer.js. Hammer.jsĀ gives you key gestures like tap, doubletap, pan, swipe, press, pinch, and rotate. You can customize settings like velocity and timing to suit your needs.

It’s super light weight at 3.96k, and has no external dependencies. If you’re using Angular.js for mobile, the Hammer.js Angular directive is a must have. It lets you add events like ng-swipe.

Using it is this easy

var hammertime = new Hammer(myElement, myOptions);
hammertime.on('pan', function(ev) {

View the demo or browse the source on GitHub

Category: Product #: Regular price:$ (Sale ends ) Available from: Condition: Good ! Order now!
Reviewed by on. Rating:
Read More»