DEV Community

Mehul Lakhanpal
Mehul Lakhanpal

Posted on • Originally published at Medium

Live preview of react-app on mobile

Apps can be tested on browsers using the responsive view. The preview of the app can be observed from any width to any height. But to test it out on a real mobile, the app has to be deployed somewhere.

Note: This method would also work for apps created using other ways. I have used react hence the title.


The application running on your development machine can be tested out instantly on a mobile device.

  1. Both the computer and mobile device must be connected to the same wifi network.

  2. Get the local IP address of the computer. My local IP address, in this case, is 192.168.29.217
    Local IP address on Ubuntu
    I am using ifconfig to get the IP address on ubuntu.

    Search for Find local ip address for your specific os.

  3. Get the port on which the react-app is running. ex., My app is running on localhost:3000

  4. Go to the browser in the mobile device and enter : For me, it would be 192.168.29.217:3000

Done!


Thanks for reading 💙

Follow @codedrops.tech for daily posts.

InstagramTwitterFacebook

Micro-Learning ● Web Development ● Javascript ● MERN stack ● Javascript

codedrops.tech

Top comments (3)

Collapse
 
kretaceous profile image
Abhijit Hota • Edited

Whoa! I just checked it and it works like a charm. HMR is also working!

Thanks dude! Why didn't I know about this earlier?!

Note: If you're on Windows, you should do ipconfig in command prompt and note the IPv4 Address under the Wireless LAN adapter Wi-Fi section.

Collapse
 
ml318097 profile image
Mehul Lakhanpal

Awesome 🔥🎉

Collapse
 
rehankkk profile image
rehan khan

not working