React Native - CodePush 실습

Microsoft AppCenter라는 플랫폼이 있다.

당연히 Microsoft사에서 모바일 앱 생태계를 먹어보려는 야심찬 계획 하에 만들어졌고...

안타깝게도 Windows Mobile은 이제 더 이상 세상에 없지만(? 없어지고 있지만?? 없어질 듯 하지만???)

세상을 양분하고 있는 두 OS - 즉, Android, iOS 앱에서도 충분히 활용 가능하다.

 

활용 가능한 대표적인 것 두 개만 꼽아 보자면,

먼저 APNS나 FCM 같은 Push 알림 통합 서비스가 있고,

다른 하나가 이제 간단히 언급하려는 CodePush 서비스다.

 

Push 알림 통합 서비스는... 그런데, 쓸모가 없어졌다!

구글 FCM에서 APNS를 지원해 버리는 순간부터. FCM을 쓰지 누가 대체...

 

다른 하나인 CodePush는 지금 현재도 유효하고, 굉장히 매력적인 서비스다!

앱을 버전업 해서 스토어에 다시 배포하지 않고도 손쉽게 업데이트할 수 있게 해 주기 때문이다.

단, 네이티브 앱 자체는 안된다. Javascript나 이미지, 동영상 같은 자산ASSETS 파일들만 된다.

(애초에 Microsoft에서 열심히 밀었던, 그러나 Windows Mobile처럼 역시 모바일 앱 생태계에서 점차

사라져 가고 있는 Xamarin이나 Cordova 하이브리드 앱을 타겟으로 만들어진 서비스이기 때문에...

다행히 이 하이브리드 앱이라는 측면에서는 React Native도 똑같으므로 똑같이 지원된다.)

 

 

각설하고,

 

 

Microsoft의 AppCenter를 통한 CodePush는 크게 보면 아래의 절차대로 진행된다.

1. AppCenter 계정 생성(https://appcenter.ms/)
2. AppCenter에서 앱 등록, 기존 앱 업로드(iOS/Android 두 개로 나눠서 진행)
3. AppCenter 앱 배포 키 정보 획득
4. AppCenter CLI 설치
5. React Native CodePush 설치 및 설정(iOS/Android)
6. CodePush 지원 앱으로 빌드해서 배포
7. 이후... 앱 업데이트 시 CodePush로 배포
8. 또... 앱 업데이트 시 CodePush로 배포

 

아래 사이트들을 참고했다.

 

>> 참고1: docs.microsoft.com/en-us/appcenter/distribution/codepush/

Use CodePush to update your app live - Visual Studio App Center

>> 참고2: velog.io/@dlrmsghks7/learncodepush

React-Native CodePush 알아보기!

 

제대로 하려면 위 참고1 사이트의 공식 문서들을 다 읽고 거의 그대로 따라해야 하지만,

(2. CodePush-ify your app 절차[별도 링크]가 제일 중요한데, 좀 길다... ㄷㄷ)

우선 이해도를 올리기 위해서는 위 참고2 사이트만 봐도... 나름 쉽고 간략하게 잘 정리가 되어 있어 좋다.

 

위에서 절차를 정리한 6단계까지는 위 두 사이트에 거의 다 나와 있으므로 생략하고,

7단계, 실제 앱 업데이트 시 CodePush를 통한 배포를 어떤 절차로 진행하면 되는지만 정리해 본다.

 

먼저, 앱이 업데이트되어 배포할 준비가 되었다고 치고,

appcenter CLI를 이용하여 AppCenter에 로그인부터 해야 한다.

Mobile.test %> appcenter login

그러면 웹 브라우저가 뜨고, 로그인을 완료하고 나면 인증 토큰을 보여준다.

해당 인증 토큰을 복사해서 콘솔 창 입력하라는 부분에 넣어주면 끝.

 

다음으로는 업데이트된 앱을 CodePush에 배포하는 건데, 명령어가 좀 복잡하다.

그래서 먼저 명령어를 간단하게 줄이기 위해 set-current 명령으로 배포할 앱을 사전 지정해 두는 방식을 써봤다.

한번 하고 말 것이 아니라면 이 방식이 훨씬 편리하다.

 

지정된 앱이 있는지 확인:

Mobile.test %> appcenter apps get-current

 

배포할 앱 지정:

: appcenter apps set-current [계정 이름]/[앱 이름]
Mobile.test %> appcenter apps set-current Thermidor/Mobile.test.ios

 

배포 목록 조회:

Mobile.test %> appcenter codepush deployment list

 

앱 업데이트 배포(Production으로):

Mobile.test %> appcenter codepush release-react -d Production

 

그러면, 이미 배포되어 실행 중이던 앱은 CodePush 설정에 따라

앱이 실행될 때 또는 백그라운드에서 전환될 때 AppCenter 서버를 통해 업데이트를 확인/다운로드하게 되고

다음 앱 실행 시 또는 백그라운드 전환 시에 업데이트를 진행하게 된다. (즉시 업데이트되게 하는 옵션도 있다.)

 

끝.