Mobile Development and Local Environments

Lately at work I have been doing a lot of mobile optimization of our new UI. This has created a lot of back and forth between writing code on my desktop and then testing the result on a mobile device. I know there are emulation tool in Chrome, and I have been using them, but there are a lot of issues that just don’t reveal themselves with that kind of emulation. Alternatively I could be using the iOS emulator in XCode but again you are not really getting the same experience a user would particularly when it comes to touch interaction.

The way our development environment is set up we have the UI code running in a Vagrant based VirtualBox VM which is on my local machine. There are then hosts file updates which point to that server. This is great for developing locally, you make a change to the code and since the VM is actually reading from code on your computer the updates appear instantly. The problem with this setup however is that we are relying on the hosts file to route an arbitrary host name to the correct VM IP address. Normally I could just test this on the mobile device by opening port 80 on my computer, forwarding it to port 80 of the VM, and hitting the IP directly. However, our application relies on the host name to function correctly. Unless you have a “jailbroke” device you are not able to make hosts file changes on mobile devices and so we can’t route the host name to the correct IP.

The solutions I have found are to either run a DNS server or an HTTP proxy server which will route the host name to the correct IP. Either way you have to setup the server on your local machine and configure your mobile device to use that server.

Personally I have found the proxy server route to be the simplest. On my Mac I am using a utility called SquidMan which is a wrapper for the Squid proxy server. It was very easy to configure and so far everything is working fine.

If you are working on a Windows machine, as many of my coworkers are, there are a number of alternatives you could use including Apache HTTP Server with mod_proxy enabled.