React Native 앱 제작기 #5 | 플레이 스토어(playStore) 배포 TIP (MultiDex , Proguard )

안녕하세요? 바울랩 '오현규' 연구원 입니다.

이번에는 각 OS별 스토어에 제작한 앱을 배포하는 과정 중 알아낸 쓸만한 꿀팁들을 말씀드릴게요~

 

먼저 android 배포 TIP입니다!

플레이 스토어(PlayStore)

배포할때 가장 중요한 앱 정보 등록 구간입니다. (홍보와도 직결되니까요!)

이 과정에 대해서는 자료가 방대하니 넘어가도록 하겠습니다.

이번 회차는 플레이스토어에 등록할 APK 추출&등록 과정을 더 중요시 다뤄보려고 합니다!

제작한 APK 등록 화면

※등록전에 봐주세요!

출시 전 Release버전으로 테스트 후 이상이 없는지 확인 후 등록해주세요!

릴리즈 모드 실행 방법은 아래 명령어를 사용해주세요.

npx react-native run-android --variant=release

테스트 완료하셨으면!

업로드할 파일을 추출해보실까요? 🤷‍♀️

 

그전에 아셔야 할게있어요!

 

APK vs App Bundle?

앱 번들 쓰세요 무조건..! ( 앱의 용량이나 최적화 면에서도 앱 번들이 좋습니다!)

 

하지만,,

React-Native ≥ 0.60기준은 APK로 추출합시다.

App Bundle로 추출 후 업로드 시 FireBase 기기 테스트가 전부 실패하네요. 화면 조차 안나옵니다!

뭐가 문제인지 여럿 서치를 해봤지만 해결이 안됐고, Rn v 0.60 버전 이상 사용자들이 .aab(앱 번들)파일 업로드시 실행이 안되는 이슈있다는걸 발견했네요. ( Facebook은 얼른 해결해달라..!)

 

그래서 APK로 빌드하고 업로드를 하니 테스트도 전부 통과하고 프로덕션 실행까지 완료!! 😊

(이후에 App Bundle 업로드 성공하신분들 말씀해주시면 감사하겠습니다. 얼른 바꾸게..! )

 

그럼 본격적으로 APK 추출 방법을 알아보겠습니다.

Android Studio 실행 - 본인 프로젝트 루트에 있는 android 폴더선택 - 열기

 

메뉴 창 - Build - Generate Signed Bundle / APK ...

RN 0.60버전 이상이신 분들은 일단 APK를 선택해줍니다!

근데 잠깐!

"앱에 서명(sign)을 한다고??"

개발자가 소유한 업로드 키를 사용해 업로드 시 구글에서 앱에 대해 서명을 해주는 방식입니다.

즉, 업로드 키가 일치 하지않으면 업로드가 실패하게 됩니다.

그러면 개발자는 업로드 키만 관리하면 되겠죠? ( 팀원들끼리 같은 upload키를 사용하면됨)

앱 서명 방식

업로드 키 생성 방식은 아래 공식문서에서 자세히 확인 가능합니다!

Sign your app | Android Developers

앱 서명  |  Android 개발자  |  Android Developers

업로드키 생성이 완료되었으면 패스워드 입력 후 Next!

debug, release모드 APK가 생성될 경로 지정 후 Finish!

 

짜잔, 이렇게 .apk파일이 생성된 것을 볼 수가 있습니다!

앱 등록시 arm64 , armeabi 두 개 파일을 업로드 하시면 됩니다!

이제 기분 좋게 앱 등록하러 가볼까요~

이렇게 업로드 완료하고 검토 후 출시하시면 Firebase Test를 시작할 것 입니다!

테스트 결과도 보여주고 문제 발생시 로그캣도 보여주니 출시 전 이슈해결까지 가능합니다!

프로덕션 버전 출시 전 다른것은 몰라도

내부 테스터 정도는 출시하고 테스트 해보시고 정식 출시 하시는것을 추천드립니다!

 

마지막 꿀팁하나 남기고 포스팅을 마치겠습니다.

아마 개발하면서 라이브러리를 사용하시다보면 multidex error와 마주할 것 입니다.

64K가 넘는 메서드가 사용이 되어서 그런데요

64K가 넘는 메서드의 앱에 관해 multidex 사용 설정 | Android 개발자 | Android Developers

64K가 넘는 메서드의 앱에 관해 multidex 사용 설정  |  Android 개발자  |  Android Developers

아마 많은 분들이 구글링을 통해서 이런식으로 해결을 보실겁니다.

build.gradle

하지만, 멀티덱스를 활성화시켜도 해결이 안되시는 분들이 있으실 겁니다.

대체 Dex가 뭔데??

직접 보시는게 이해가 빠를거라 생각합니다.

build - Analze APK - .apk파일 선택(arm, armeabi 둘중 하나 택)

이렇게 생성한 .apk 파일에 대한 구성파일들을 살펴 볼 수 있습니다.

multiDex 옵션이 true가 되어있어서 .dex파일이 3까지 생성되어있네요.

( 메소드수가 적지 않다는 것을 알 수 있겠죠? )

구글 서비스 쪽에서 사용되는 메소드 비중이 크네요!

해결법은 바로 'Proguard' 입니다!

프로가드는 앱 내의 미사용 코드, 리소스 등을 삭제 시켜서 .Dex를 축소시키는 작업입니다.

적용방법은 정말 간단합니다.

 

android/app/build.gradle파일에서

 

enableProguardInReleaseBuilds = true 해주시면 됩니다.

-- 중략 --

메소드 수가 현저히 줄었네요 앱의 용량도 1~2MB정도 줄었습니다( 이런 꿀 기능이..!!!)

이렇게 하면 multiDex Error지옥에서 벗어날 수 있으실겁니다!!

 

아래는 프로가드에 자세한 내용입니다.

앱 축소, 난독화 및 최적화 | Android 개발자 | Android Developers

앱 축소, 난독화 및 최적화  |  Android 개발자  |  Android Developers

앱 개발이라는게 기능구현 보다는 배포과정과 배포 후 관리가 더욱 중요하다는걸

새삼 느낌니다..😂😂

이것으로 마치겠습니다. 끝까지 봐주셔서 감사합니다!