![]() ![]() ![]() On Windows, run ipconfig in a terminal window. So the next question is, what is the laptop's local IP address? On a Mac, open System Preferences, then select Network, then select the WiFi connection - the IP address will be shown under the Status. This means that an address entered in the phone's browser like will work. The key here is that your laptop's internal IP address can be seen by your phone if both are on the same network. These IP addresses are only seen by other computers in your local network and not by computers connected to an external network, such as the Internet. The Computer Hope website has a clear definition of what an internal IP address is:Īlternatively referred to as the local IP address, the internal IP address is the address that is assigned by your local network router that often begins with .x. something like So now the question is, what is mylaptop? It turns out, when multiple devices (laptop, phone, tablet, etc.) are all on the same WiFi network, they can communicate with each other via an internal IP address. What's needed, is to provide the phone an address of the laptop where the development server is running, i.e. This means that if you enter on a phone, it's going to look for a web server running on the phone, which does not exist. Using the loopback interface bypasses any local network interface hardware. It is used to access the network services that are running on the host via the loopback network interface. In computer networking, localhost is a hostname that refers to the current computer used to access it. Here's the formal definition from Wikipedia: This is because localhost refers to the hostname of the computer it's running on. To access the website running on this local dev server, you open a browser tab on the same laptop that server is running on and navigate to an address such as However, trying to enter this same address in a browser on a phone will not work. This server is responsible for serving up the files (html, css, and javascript) on a certain port, watching those files for changes, possibly running them through a build step (eg: transform JSX, convert sass to css etc.), and refreshing the browser or hot module reloading so the changes can be seen right away. When developing locally, the usual process is to have a development server running on a laptop. This post will show how to do that, with whatever devices are on hand. To get a more accurate experience, testing should be done on a real physical device. However, all of these are only approximations of how your site will look and behave on another device. There are several pure software ways to do this, including Device Mode in Chrome developer tools, and Browserstack which is a paid service with a free option for open source. A common occurrence when developing a new website or app is that you'd like to see what it will look like on your phone, tablet, or other device. ![]()
0 Comments
Leave a Reply. |
AuthorWrite something about yourself. No need to be fancy, just an overview. ArchivesCategories |