DEV Community

Cover image for Run Your Ionic App on an Android Phone Step By Step: Using Your Phone as a Wireless Emulator with Wi-Fi Debugging Only
Chabba Saad
Chabba Saad

Posted on • Updated on

Run Your Ionic App on an Android Phone Step By Step: Using Your Phone as a Wireless Emulator with Wi-Fi Debugging Only

first we need to turn our phone to Mode developer and we should have android studio and Ionic installed in our machine

follow those step to rach our goal and run our app direclty in our phone :

**

wirless debuging

**

for using wirless debuging we need to install scrcpy

if you don't have it yet in your machine

now go to github and Download

scrcpy

open your powershell :

iex (new-object net.webclient).downloadstring('https://get.scoop.sh')
Enter fullscreen mode Exit fullscreen mode

Image description

scoop install scrcpy
Enter fullscreen mode Exit fullscreen mode

Image description

Image description

scoop install adb
Enter fullscreen mode Exit fullscreen mode

Image description

and go to path and add adb C:\Users\Huawei\Downloads\scrcpy-win64-v2.0 (1)\scrcpy-win64-v2.0

to run mobile with your laptop go in powershell :

connect your phone first using USB Debugging

adb  tcpip 5555
Enter fullscreen mode Exit fullscreen mode

Image description

now disconnect your phone ( removing USB )

go to about in phone and get ip adress connected to wifi

adb connect ipaddresswifi:5555
Enter fullscreen mode Exit fullscreen mode

Image description

then run :

scrcpy
Enter fullscreen mode Exit fullscreen mode

scrcpy

now let open our ionic project in vs Code and run the following Command Line :

ionic build --prod
Enter fullscreen mode Exit fullscreen mode

ionic build --prod

npm install @capacitor/android --force
Enter fullscreen mode Exit fullscreen mode

Image description

Run the following command to add the Android platform to your project:

 npx cap add android
Enter fullscreen mode Exit fullscreen mode

Image description

Next, run the following command to synchronize your project with the added platform:

This will ensure that the necessary files and dependencies are updated in your Android project.

npx cap sync android
Enter fullscreen mode Exit fullscreen mode

Once the synchronization is complete, you can proceed with opening your Android project in Android Studio by running the following command:

npx cap open android
Enter fullscreen mode Exit fullscreen mode

Image description

npx cap open android

trust project

waiting

In Android Studio, click on the "Run" menu and select "Run 'app'".

Result

I hope you find this tutorial helpful.

Top comments (0)