[React Native] 핸드폰(device)에서 실행하는법

Android 기기에서 앱 실행하기

1. USB 디버깅 활성화

대부분의 android 기기는 기본적으로 google play에서 다운로드한 앱만 설치 및 실행할 수 있습니다. 개발 중에 앱을 설치하려면 기기에서 USB 디버깅을 활성화해야 합니다.

USB 디버깅을 활성화하려면 먼저 개발자 옵션 메뉴를 활성화해야 합니다. 설정 -> 휴대전화 정보 -> 소프트웨어 정보로 이동한 후, 빌드 번호 항목을 7번 누릅니다. 그런 다음 설정 -> 개발자 옵션으로 들어가서 USB 디버깅을 활성화합니다.

2. 기기를 USB로 연결

이제 react native 프로젝트를 실행할 android 기기를 연결합니다. 그런 다음 adb(android debug bridge)가 기기를 제대로 인식하는지 확인합니다.

adb devices
emultaor-5554 offline # Google 에뮬레이터
S3D3494FCC device # 실제 기기

오른쪽에 device로 표시되면 기기가 연결된 것입니다. 여러개의 기기를 연결할 수 있지만 하나의 기기만 연결하는 게 편합니다.

앱 실행

프로젝트 루트에서 다음 명령어를 실행하여 기기에 앱을 설치하고 진행합니다.

npm run android

개발 서버에 연결하기

개발 중인 컴퓨터에서 실행 중인 개발 서버에 연결하여 기기에서 빠르게 반복 작업을 수행할 수 있습니다. USB 케이블 또는 Wi-Fi 네트워크를 사용하여 여러가지 방법으로 이 작업을 수행할 수 있습니다.

1. adb reverse 사용

android 기기가 USB 디버깅이 활성화가 되어있으며 USB로 개발 컴퓨터에 연결된 경우 사용할 수 있습니다.

adb -s <device name> reverse tcp:8081 tcp:8081

보통 metro로 포트가 8081여서 8081로 연결시킵니다. 연결된 기기 이름을 찾으려면 다음 adb 명령어를 실행합니다.

adb devices

이제 dev 메뉴에서 라이브 리로딩을 활성화할 수 있습니다. javascript 코드가 변경될 때마다 앱이 다시 로드됩니다.

2. wi-fi로 연결

와이파이를 통해 개발 서버에 연결할 수 있습니다. 먼저 USB 케이블을 사용하여 기기에 앱을 설치해야 하지만, 한 번 설치한 후에는 무선으로 디버깅할 수 있습니다. 이를 위해 개발 컴퓨터의 IP 주소가 필요합니다.

명령 프롬프트를 열고 ipconfig를 입력하면 컴퓨터의 IP 주소를 찾습니다.

노트북과 휴대전화가 동일한 와이파이 네트워크에 연결되어 있는지 확인합니다.

react native 앱을 기기에서 엽니다.

빨간 화면에 오류가 표시될 것입니다. 그럴 때 앱 내 dev 메뉴를 엽니다.

dev 설정 -> debug server host & port for device로 이동합니다.

로컬 개발 서버의 IP 주소와 포트를 입력합니다.(예:10.0.1.1:8081)

이제 dev 메뉴에서 라이브 리로딩을 활성화할 수 있습니다. javascript 코드가 변경될 때마다 앱이 다시 로드됩니다.