Want to test a website on your local machine and on a variety of other devices before you host it? This post from Lullabot explains how you can serve up a site you’re working on locally with a service called xip.io.
Using xip.io
In a nutshell, xip.io runs a custom DNS server on the public Internet. When your computer looks up a xip.io domain, the xip.io DNS server extracts the IP address from the domain and sends it back in the response. Anyone on your local network can visit the site on any device with a web browser.
Debug and design in the browser
Debugging and refining your local site design is then a breeze on devices running the Android OS. Simply connect your Android device to your computer while in USB debugging mode and then go to Menu>Tools>Inspect devices and select your device. Next, load the Chrome browser on your device running Android and navigate to your local site.
You will then be able to debug and modify elements on the page with the inspector tool in your desktop browser and see the results update on your mobile device in real time. Here’s an indepth overview of the debugging process: Chrome Developer Tools - Remote Debugging
The debugging process is limited to the Chrome browser and is only compatible with devices running the Android OS. It’s not a complete debugging solution, but certainly a great tool to get you going in the right direction. What other tools do you like for debugging mobile sites and/or designing in the browser? Are there any similar tools for working with iOS?
