Yesterday, I said that today we’d look at more advanced layouts with CSS Grid. Unfortunately, I ran out of time to write that article, so it will have to wait until tomorrow.
Today, we’re going to look at how to test a website or web app that’s setup locally on your computer on other devices.
One of my students shared this with me (shared with permission):
Hey all I just figure out with a bit of troubleshooting how to test something I built locally on Mac to test on mobile - bit of poking around found that there is a way on Windows, too.
Here is how:
- You need to have the website running on
localhoston your computer, on some port (like
8080). You can use a package like live-server for a static site.
- Make sure your computer and phone are on the same wifi network.
- Find the IP address of your computer.
- On macOS, use command
ipconfig getifaddr en0in the terminal.
- On Windows, use the comand
ipconfigin the command line, then find the IPv4 address.
- On both platforms, the IP looks has this format:
- On your phone, open the browser at the IP address from step 3, on the port you’re using. Example:
My student credited Jonas Schmedtmann’s newsletter for this one (they figured out how to make it work on Windows, too).
If you’d rather use a GUI, MAMP is also a good option.
One last detail: you need to use the terminal command above to get your IP address. Visiting one of the “what’s my IP address?” websites will get your public IP, not the one specific to your machine.