RN으로 개발해서 iOS 는 safari로 바로 디버깅이 가능하다
혹시나 문제가 있다면 아래와 같은 문제인지 체크해보길 바란다.
https://choq.tistory.com/47 : 검색할 수 있는 응용프로그램 없음....
자 그럼 안드로이드는 어떻게 할까?
크게 2파트로 나눌 수 있겠다.
1. 코드 설정
2. 기기 설정
1. 코드설정
안드로이드는 약간 코드 부분에서 추가가 필요하다.
android/app/src/main/java/co/{projectName} 아래에
MainApplication.java 파일을 찾아서 아래와같이 추가해준다.
1. import 새로 추가
2. onCreate 클래스 내부에 Webview 추가해
// MainApplication.java
import android.webkit.WebView;
...
public void onCreate(){
...
WebView.setWebContentsDebuggingEnabled(true);
...
}
2. 기기 설정 (개발자 옵션)
이제 코드 설정은 끝났다.
디버깅을 위해서 안드로이드 폰을 "개발자모드"를 활성화 할 필요가 있다.
안드로이드 기기에서 [설정] 페이지에서 가장 하단에 [개발자 옵션]이 없다면
아직 활성화 되지 않은것이다.
그렇다면 설정 하단부에
[휴대전화정보] -> [소프트웨어 정보]로 들어가서
"빌드번호" 를 여러번 눌러준다.
그러면 개발자 모드 활성화에 대한 알림이 등장한다!
그러고 나면 이제 설정 최하단부에 개발자 옵션이 켜진다.
개발자 옵션에 들어가서 USB디버깅 모드 설정을 ON해주면~
모든 준비 끝이다.
3. 디버깅
이제 앱을 안드로이드 기기에서 실행해준다.
$ adb devices
통해서 기기 ID를 체크하고
$ yarn android -deviceId=기기ID
실행해주면 프로젝트가 실행된다.
후에 크롬을 실행하고
chrome://inspect/#devices
로 접속하면
Remote Target 파트에 해당 웹뷰가 표시되어있는걸 확인할 수 있다.
해당 웹뷰를 inspect 클릭하면
웹개발시 크롬에서 F12눌러서 개발자모드킨것과 같이
콘솔, 요소 등을 확인할 수 있다!
이제? 열코딩만 하면된다.