In modern web development it's very important that your website is functional on mobile devices. There are a few options that you can use when testing how your website works on mobile devices.

Manually resize the browser
Use a mobile device emulator
Use a responsive tester tool
Upload to a server and test on the mobile device

The best solution that you have would be to try the website directly on the mobile device so you can not only see how the website looks but how it feels to interact with, i.e looking at how easy it is to click links on the site. When you are developing you don't want to be making changes then uploading to a server so you can view it on a mobile device. In this tutorial we are going to look at how you can view a localhost website on your mobile.

Viewing Localhost

In the following I'm going to assume that you are using Ubuntu but you can use the same approach on other operating systems. To view your localhost on your mobile device all you have to do is navigate to the IP address of the development machine. To find the IP address in Ubuntu open the terminal and type ifconfig, search for inet addr this value is your IP address, now navigate to this on your mobile device. You should then see the default localhost file if still located in /var/www/ on your development machine. But most likely you have your development websites in folders within the /var/www so you would want to set an alias for the website you want to view on your mobile device at http://192.0.0.1/test-website. On the command line open the /etc/apache2/sites-available/000-default.conf file and enter the following in the virtualhost.

Alias /test-website /path/to/website/root

<Directory /path/to/website/root>
    AllowOverride All
    Options All
</Directory>

Navigate to http://192.0.0.1/test-website on your mobile device and you will been able to view your development website.

Viewing Localhost Site On A Mobile Device

Viewing Localhost