DEV Community

Cover image for How to preview a Next.JS app on a mobile device
timreach
timreach

Posted on

How to preview a Next.JS app on a mobile device

So you're building a mobile web app and you want to view it on an actual phone not a virtual one in your dev tools? No, you don't have to deploy! If you've ever used Create React App, running developer mode gives you simple instructions for doing this, however Next.JS $ yarn dev does not! Fear not, it is very simple...

1. Get your machine's IP address

# Linux/Mac
$ ifconfig

# Or Windows...
$ ipconfig
Enter fullscreen mode Exit fullscreen mode

2. Run your project

$ yarn dev
Enter fullscreen mode Exit fullscreen mode

3.Open browser on your phone

  • If your machine's IP is 192.168.0.69...
  • ...navigate to 192.168.0.69:3000 on your phone

It's as easy as that!

Top comments (4)

Collapse
 
mohamedalimahmoud profile image
Mohamed Ali

it works like a charm

Collapse
 
empflow profile image
empflow

make sure your computer and phone are connected to the same network (wifi, ethernet)

Collapse
 
eduardowaof profile image
Eduardo Fortuna • Edited

In Windows, use the IP in the "IPv4 Address" label.

Collapse
 
savics407 profile image
Victor Adighibe

This is not working for me