How to access and test localhost from your devices over your wi-fi network
I have been thinking about how to access to my localhost in windows from Android/Apple devices. Every now and then, web developers bump into the problem of accessing localhost sites/apps from their mobile devices.
As a general practice, all files of a website are uploaded to remote server (generally under a subdomain named "demo") and tested using various devices and browsers. Whenever any file goes under any change, it is again uploaded to remote server for testing. This is certainly time consuming and tiresome task.
I develop my all sites, static or dynamic, on my personal computer, with the help of XAMPP 5.6.3 (32-bit).
Recently, I have learned about accessing localhost over Wi-fi from a tutorial.Through this process, now I can access my localhost from mobile devices, test my sites locally to meet cleint's demands with ease!!! This new method has made my development process faster and easier.
My Networking Setup
Fig. 1 and Fig. 2 shows a general picture of my networking setup. My PC is connected to my Wi-fi router using RJ-45 cable and my mobile phone and Samsung tab also connect to the Internet through Wi-fi. First thing is to get the IP address of my localhost. Open command-line box using "cmd" command from Windows Run and type "ipconfig". ipconfig gives me IP address of localhost (PC) which is "10.0.0.101".
Figure 1: Network diagram
Figure 2: Finding IP address of PC
This is it. This is minimum setup for you to access your websites which resides in your “localhost”.
Now to test the setup. Take up your Android device or iOS device and fire up your browser. Type in the address of your localhost in the address bar, http://10.0.0.101 and tap on the “Go” button. You should see the content of the localhost, like the following:
I have been using this setup now and quite happy that it’s working for me well. I hope that this model will come handy in your case too.
Well, how do you test your web projects from your devices for responsiveness? Please express your thoughts in the comment section and share the information with us. Thank you for reading!
- Category: Webmaster