DEV Community

David Okonji
David Okonji

Posted on • Updated on

Remote Debugging in React Native

Coming from an Expo background in React Native development, remote debugging is an out of the box solution, as the Expo client provides one with the option of debugging react native applications over the network.

In this article, I would be explaining how to set up remote debugging for a react native application over a local network using Xcode and an IOS device.

With Xcode already installed and set up on your system, we would follow the steps highlighted below, In this article Xcode version 12.3 is being used.

Note: for the very first time you would need a cable to be connected to the phone you intend to use to test.

Step by Step guide

  • Ensure the system and the device which needs to be used to test are connected to the same Wi-Fi.

  • Open Xcode, proceed to the window menu option, select the Device and simulators option.
    Device and simulators

  • On selecting the option, a popup window comes up showing your existing simulators and device.
    Device and simulators dialog

  • Click on the Devices tab to see the connected devices to see your connected phone
    connect to network image
    Select the Connect via network checkbox and you are good to go. You can now unplug the phone from the system and test your apps over the network.

Debugging Issues

  • In a case where the device is not showing as connected when plugged in with a cable and does not run regularly when connected, you may need to update the version of Xcode to match the updates for the device.

  • In a case where the connect via network option does not come up, please check your connection and ensure the device and the system are connected to the same network, and try again.

To setup remote debugging for android devices a good guide to follow Get Started with Remote Debugging Android Devices.

Thanks for reading this far πŸ˜ƒ. Feedback is greatly appreciated.

Top comments (0)