React Native에서 CodePush 배포 자동화 구축기

문제 상황

프로덕션 앱에서 긴급 버그가 발견됐는데, 앱스토어 심사 대기 시간이 최소 1~2일이었다. JavaScript 번들만 변경하면 되는 상황이었기에 CodePush 도입을 결정했다.

CodePush 설정

App Center CLI로 앱을 등록하고 배포 키를 발급받았다.

npm install -g appcenter-cli
appcenter login
appcenter apps create -d MyApp-iOS -o iOS -p React-Native
appcenter apps create -d MyApp-Android -o Android -p React-Native

app.json에 CodePush 설정을 추가했다.

import codePush from 'react-native-code-push';

const App = () => {
  // ...
};

const codePushOptions = {
  checkFrequency: codePush.CheckFrequency.ON_APP_RESUME,
  installMode: codePush.InstallMode.ON_NEXT_RESUME,
};

export default codePush(codePushOptions)(App);

GitHub Actions 자동화

develop 브랜치는 Staging으로, main 브랜치는 Production으로 자동 배포되도록 워크플로우를 작성했다.

name: CodePush Deploy

on:
  push:
    branches: [main, develop]

jobs:
  deploy:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v3
      - name: Setup Node
        uses: actions/setup-node@v3
        with:
          node-version: 18
      - run: npm ci
      - name: Deploy to CodePush
        run: |
          if [ "${{ github.ref }}" == "refs/heads/main" ]; then
            appcenter codepush release-react -a MyOrg/MyApp-iOS -d Production
          else
            appcenter codepush release-react -a MyOrg/MyApp-iOS -d Staging
          fi
        env:
          APPCENTER_ACCESS_TOKEN: ${{ secrets.APPCENTER_TOKEN }}

주의사항

CodePush는 네이티브 코드 변경에는 사용할 수 없다. Info.plist나 AndroidManifest.xml 수정, 네이티브 모듈 추가 시에는 여전히 스토어 배포가 필요하다.

또한 mandatory 옵션을 남발하면 사용자 경험이 나빠진다. 치명적인 버그가 아니면 optional 업데이트로 배포하는 게 낫다.

결과

핫픽스 배포 시간이 1~2일에서 10분 이내로 단축됐다. 다만 업데이트 적용률을 모니터링하며, 필요시 강제 업데이트 여부를 판단하는 프로세스가 필요했다.