Derek Jones's avatar

Easy Multi-device Local Development with

by: Derek Jones on: 12/30/2016 | Read in 4 minutes

You are building a site locally and you’d like to quickly check your work on your iPad, iPhone, another computer, or maybe a client’s laptop. You could pay for a dynamic DNS service, setup a DNS server on your local network, or setup a proxy server perhaps. But there’s an easier way. The key is a “magic domain” service,, which lets you give meaningful names to your local IP addresses.

In this example, we will make my local available to others on my network, including my client’s iOS devices.

How to do it

I have my Apache VirtualHost and /etc/hosts file on my iMac configured to use for local development. I’ll add the special address as a ServerAlias, using the local IP address of my iMac (

DocumentRoot /Users/derek/Sites/AwesomeSite

I’m keeping the prefix so I can use this naming system with all my projects and make it clear which VirtualHost I’m accessing. If you’re using MAMP Pro, just go to your Hosts tab and click the + button under the “Aliases” box to add the address as an alias. Notice that addresses follow the simple pattern of your domain name, followed by your local IP address, followed by

Now to make sure that links and asset requests go to the right URLs, at the bottom of my config.php file in ExpressionEngine, I add the following:

if (preg_match('/.*\.xip\.io$/', $_SERVER['HTTP_HOST']))
	$config['base_url'] = "http://{$_SERVER['HTTP_HOST']}/";

This block of code tells ExpressionEngine to use the address as the basis for URLs, but only if the request came from a address. The preg_match() conditional validates the HTTP_HOST header for us in this case.

Use the special {base_url} variable in all of your URL settings which keeps your site ultra-portable. If you do not, then you will need to override site_url, cp_url, theme_folder_url, and upload_preferences for each Upload Destination.

Never use HTTP_HOST without validating it! It is a request variable, which means it can be faked, and you can’t trust it. If you use it without validation, you run the risk of a cache poisoning attack. That means an attacker could cause all generated links to point to their own servers for people who access your site after they do. If they copy your design, they have an effective phishing attack on your site’s visitors. Always validate the HTTP_HOST header before using it! If you’re using a multi-environment config, make sure yours does this! Exclamation mark!


Make sure to restart your web server after updating your VirtualHost, then anytime you want to pull up your local site on any device on your network, just key the address into the browser, in my case Then I can work on my iMac and check it instantly on my phone, iPad, or Macbook Air, or let a client spin it up on their device.

There are many ways to do this; is just one of the easy and seamless options.

Derek Jones's avatar

Derek Jones

Son of a master craftsman. I help make ExpressionEngine. Amateur cyclist and skate-skiier.

Have ideas on how to improve this article? .(JavaScript must be enabled to view this email address) or share your feedback with @ellislab on Twitter.

.(JavaScript must be enabled to view this email address)

ExpressionEngine News!

#eecms, #events, #releases