The latest articles on DEV Community by Luiz Fernando (@thelittleluiz). https://dev.to/thelittleluiz https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F1777475%2F6327b9f5-ce67-408f-b230-b427f39a045b.jpg https://dev.to/thelittleluiz en Luiz Fernando Thu, 01 Aug 2024 23:33:30 +0000 https://dev.to/thelittleluiz/tips-to-debug-under-android-3kfh https://dev.to/thelittleluiz/tips-to-debug-under-android-3kfh <p>Hello, I'm Luiz, a 26-year-old Software Engineer from São Paulo, Brazil. Today, I want to share some essential tips for debugging Android apps using React Native and ADB (Android Debug Bridge). Whether you're an experienced developer or just starting out, these tips will help make your debugging process more efficient. Let's dive in!</p> <h2> ADB </h2> <p>What is ADB? ADB, or Android Debug Bridge, is a versatile command-line tool that allows developers to communicate with and control Android devices. It facilitates a variety of device actions, such as installing and debugging apps, and provides access to a Unix shell that you can use to run various commands on a device.</p> <h2> Connect your device over WiFi to install or debug </h2> <p>ADB, has a feature that will allow us to connect our android device over wi-fi so this way we can debug without the need of a cable connected to the device.</p> <p>To make this happen make sure that you follow the steps</p> <ol> <li><p>Make sure that your device and your computer are under the same wi-fi network, ADB Debugging and Wireless Debugging are enabled in the Android Device's Developer options</p></li> <li><p>Get the IP Address of the Device, Searching for IP address on the device settings or by connecting via USB and running this command <code>adb shell "ip addr show wlan0 | grep -e wlan0$ | cut -d\" \" -f 6 | cut -d/ -f 1"</code></p></li> <li><p>Now if you have any cables connected remove from the device and run <code>adb connect &lt;ip_address&gt;:5555</code></p></li> </ol> <h2> Redirecting ports </h2> <p>Sometimes, Android and React Native encounter issues fetching <code>localhost</code> URLs. What does this mean? It indicates that Android is unable to find the ports on your machine. To resolve this, you can use some commands to proxy the ports to your computer to the Android Device:<br> </p> <div class="highlight js-code-highlight"> <pre class="highlight shell"><code>adb reverse tcp:PORT tcp:PORT adb <span class="nt">-d</span> reverse tcp:PORT tcp:PORT adb <span class="nt">-e</span> reverse tcp:PORT tcp:PORT </code></pre> </div> <p>Typically, this issue arises with the React Native bundler. To fix it, you just need to replace <code>PORT</code> with <code>8081</code>:<br> </p> <div class="highlight js-code-highlight"> <pre class="highlight shell"><code>adb reverse tcp:8081 tcp:8081 adb <span class="nt">-d</span> reverse tcp:8081 tcp:8081 adb <span class="nt">-e</span> reverse tcp:8081 tcp:8081 </code></pre> </div> <h2> Control your device with your computer </h2> <p>There is a Tool that you can install and control devices that are connected over ADB on your computer, called <a href="https://github.com/Genymobile/scrcpy" rel="noopener noreferrer"><code>scrcpy</code></a>:</p> <ul> <li><p><a href="https://github.com/Genymobile/scrcpy/blob/master/doc/macos.md" rel="noopener noreferrer">Install on Mac</a></p></li> <li><p><a href="https://github.com/Genymobile/scrcpy/blob/master/doc/linux.md" rel="noopener noreferrer">Install on Linux</a></p></li> <li><p><a href="https://github.com/Genymobile/scrcpy/blob/master/doc/windows.md" rel="noopener noreferrer">Install on Windows</a></p></li> </ul> <p>To start the application just run type on your terminal<br> </p> <div class="highlight js-code-highlight"> <pre class="highlight shell"><code>scrcpy </code></pre> </div> <h2> Thats all Folks </h2> <p>Debugging Android apps with React Native and ADB can make your life a lot easier. Using features like wireless debugging, port redirection, and tools like scrcpy helps you stay connected and fix issues without hassle. Keep experimenting and stay updated with new tools to make your debugging process smooth and efficient. Happy coding!</p> reactnative android adb