How to Test React 18 App Locally on Mobile and Web Browsers

Last Updated on by in React JS

In this guide, we will teach you how to create a new React app, run a React application on a local server, and test and view the React app on Mobile and web browsers.

ReactJS is an intuitive JavaScript framework for developing seamless user interfaces.

The majority have adopted it in recent years because of its efficiency, ease of use, and flexibility. We hope this guide will help you understand React better.

It helps build seamless functionalities under a robust environment.

Running or viewing React app on a web browser is simple. You have to execute the npm start command; after the server is invoked, the app opens on the browser automatically.

However, in the development phase, developers need to check the React app functionalities on mobile devices constantly.

In this tutorial, we will enumerate certain steps to enhance your knowledge regarding viewing the React app on a mobile device on a local server.

First, make sure you have Node installed on your development machine.

If you haven’t installed it yet, you can still go ahead and download it directly from the official website: https://nodejs.org/en/download/

Hope you are ready and ready to upgrade your knowledge about react development.

Hence, open your terminal or command prompt and execute the following command.

Note: If you want, you can replace react-demo with the name of your choice.

npx create-react-app react-demo

You will have to wait for the installation process to finish. It will take few minutes.

Then, move into the React framework folder:

cd my-react-demo

While building a React app, you have to make sure that your mobile device and app development system are on the same network.

npm start

After running the above command, your app is compiled.

View your terminal screen; you will see the instruction something like the one below.

Compiled successfully!

You can now view react-demo in the browser.

  Local:            http://localhost:3000
  On Your Network:  http://192.168.1.3:3000

Open a web browser on your mobile device and enter the IP address provided by the React development server, followed by the port number on which your React app is running.

For example, if your IP address is 192.168.1.3 and your React app runs on port 3000, enter 192.168.1.3:3000 in the address bar.

Now, you can easily test the app on the browser and on a mobile device.

How to Test React App Locally on Mobile and Web Browsers