React Native + GiitHub Actions에서 Android 애플리케이션 개발

개요

React Native+GiitHub Actions에 안드로이드 앱을 구축해 Deploy Gate를 업로드하는 방법을 총괄했다.

규격.

DeployGate를 구축하고 추출합니다.

개발자 지점과 Staging 지점으로 추정되는 시간에 실행됩니다.

develop 지점과 staging 지점으로 읽는 환경 변수를 변경합니다.

DeployGatemessage와distribution_name

message: 단축 산열 값은git

distribution_name: 분기 이름

전제 조건

구축된 코드는 다음과 같은 디렉터리 구조를 가지고 있다.

.
├── App.tsx
├── README.md
├── android # Androidアプリ
├── app.json
├── assets
├── babel.config.js
├── index.js
├── ios # iosアプリ
├── jest.config.js
├── metro.config.js
├── package.json
├── react-native.config.js
├── src # コード
├── .env.development # 開発時に使用する環境変数
├── .env.staging # 検証時に使用する環境変数
├── .env.production # 本番時に使用する環境変数
├── tsconfig.json
└── yarn.lock

코드

deploy-android.yml

name: Deploy android app
on:
  push:
    branches:
      - develop
      - staging
    paths:
      - ".github/workflows/deploy-android.yml"
jobs:
  deploy-android:
    runs-on: ubuntu-latest
    container: reactnativecommunity/react-native-android
    steps:
      - name: checkout
        uses: actions/checkout@v2

      - name: Extract branch name # 説明1
        shell: bash
        run: echo "::set-output name=branch::${GITHUB_REF#refs/heads/}"
        id: extract_branch

      - name: copy env staging # 説明2
        if: ${{ steps.extract_branch.outputs.branch == 'staging' }}
        run: cp .env.staging .env
      
      - name: copy env develop # 説明2
        if: ${{ steps.extract_branch.outputs.branch == 'develop' }}
        run: cp .env.development .env

      - name: yarn install
        run: yarn --frozen-lockfile

      - name: Build Android Debug # 説明3
        run: ./gradlew assembleRelease

      - name: Deploy App # 説明4
        working-directory: ./android
        run: |
          curl \
            -H "Authorization: token ${{secrets.DEPLOY_GATE_API_KEY}}" \
            -F "file=@app/build/outputs/apk/release/app-release.apk" \
            -F "message=$(git rev-parse --short HEAD)" \
            -F "distribution_name=${{ steps.extract_branch.outputs.branch }}" \
            -v "https://deploygate.com/api/users/${{secrets.DEPLOY_GATE_USER_NAME}}/apps"

설명 1

분기 이름을 기록합니다.DeployGate에서 디자인할 때 사용합니다.::set-output에 관해서는 이곳을 참고하세요.
https://docs.github.com/ja/actions/using-workflows/workflow-commands-for-github-actions ${GITHUB_REF#refs/heads/}에서 분기 이름을 가져옵니다.

설명 2

분기 변경을 통해 읽기.env.
개발자 지점이면 구축할 때 읽기 .env.developstaging 지점이라면 구축할 때 읽기 .env.staging.

설명

구축 구현./gradlew assembleRelease명령을 실행할 수 있는 것은 읽었기 때문이다reactnativecommunity/react-native-android.
https://hub.docker.com/r/reactnativecommunity/react-native-android

설명

구축 파일을 DeployGate로 프로그래밍합니다.DEPLOY_GATE_API_KEY에서 DeployGate의 계정 설정->간략한 설정->간략한 하부API key를 설정합니다.

DeployGate에 등록된 사용자 이름을 DEPLOY_GATE_USER_NAME에 설정합니다.$(git rev-parse --short HEAD)에서 짧은 해시치를 얻었다.
API에 대한 자세한 내용은 여기를 참조하십시오.
https://docs.deploygate.com/reference/upload

총결산

의외로 간단하다.
지점에 합병될 때마다 설계를 실시하고 사용자가 바로 확인할 수 있어 매우 편리하다.
distribution을 분기 이름으로 설정하면 어떤 코드가 이동하는지 쉽게 알 수 있습니다.