CI/CD

Github actions를 사용한 자동 빌드 및 앱 릴리스

Github actions를 사용하여 무료로 나만의 CI/CD 파이프라인을 만들고, main 브랜치에 푸시할 때마다 Ionic Capacitor JS 애플리케이션을 배포하세요.

Martin Donadieu

Martin Donadieu

콘텐츠 마케터

Github actions를 사용한 자동 빌드 및 앱 릴리스

이 튜토리얼은 GitHub 호스팅에 중점을 두고 있지만, 약간의 수정으로 다른 CI/CD 플랫폼에도 적용할 수 있습니다.

서문

먼저 Capacitor 앱을 Capgo에 추가했는지 확인하세요. 이 튜토리얼은 업로드 단계에만 중점을 둡니다. Capgo에 앱을 추가해야 하는 경우 이 튜토리얼을 따르세요.

커밋 규칙

먼저 conventional commits 커밋 규칙을 따라야 합니다. 이는 도구가 버전 번호를 어떻게 업그레이드할지 이해하는데 도움이 됩니다. 배우는데 5분이면 충분합니다.

Conventional commits

태그를 위한 GitHub 액션

그다음 자동으로 빌드하고 태그를 생성하는 첫 번째 GitHub 액션을 만들어야 합니다.

다음 경로에 파일을 생성하세요: github/workflows/bump_version.yml

다음 내용으로:

name: Bump version
on:
push:
branches:
- main
jobs:
bump-version:
if: "!startsWith(github.event.head_commit.message, 'chore(release):')"
runs-on: ubuntu-latest
name: "Bump version and create changelog with standard version"
steps:
- name: Check out
uses: actions/checkout@v4
with:
fetch-depth: 0
token: '${{ secrets.PERSONAL_ACCESS_TOKEN }}'
- name: Git config
run: |
git config --local user.name "github-actions[bot]"
git config --local user.email "github-actions[bot]@users.noreply.github.com"
- name: Create bump and changelog
run: npx capacitor-standard-version
- name: Push to origin
run: |
CURRENT_BRANCH=$(git rev-parse --abbrev-ref HEAD)
remote_repo="https://${GITHUB_ACTOR}:${{ secrets.PERSONAL_ACCESS_TOKEN }}@github.com/${GITHUB_REPOSITORY}.git"
git pull $remote_repo $CURRENT_BRANCH
git push $remote_repo HEAD:$CURRENT_BRANCH --follow-tags --tags

이것은 main 브랜치의 모든 커밋에 대해 태그를 릴리스하고 main 브랜치의 각 커밋에 대한 changelog 항목을 CHANGELOG.md에 추가합니다.

이 파일이 없어도 걱정하지 마세요. 자동으로 생성됩니다.

이를 작동시키려면 PERSONAL_ACCESS를 생성하고 GitHub secretPERSONAL_ACCESS_TOKEN으로 추가하세요.

이는 CI가 changelog를 커밋할 수 있도록 하는데 필요합니다.

토큰을 생성할 때 만료를 never로, 범위를 repo로 선택하세요.

마지막으로 package.json 파일의 버전을 설정하고 네이티브 버전 번호와 동기화하세요. 이는 다음 단계를 용이하게 합니다.

이는 처음에만 필요하며, 이후에는 도구가 자동으로 업데이트합니다.

이제 두 파일을 커밋하고 GitHub에 첫 번째 태그가 나타나는 것을 확인할 수 있습니다!

네이티브와 웹 플랫폼 모두 각 커밋 후에 버전 번호가 증가합니다.

빌드를 위한 GitHub 액션

다음 경로에 파일을 생성하세요: github/workflows/build.yml

다음 내용으로:

name: Build source code and send to Capgo
on:
push:
tags:
- '*'
jobs:
deploy:
runs-on: ubuntu-latest
name: "Build code and release"
steps:
- name: Check out
uses: actions/checkout@v4
- name: Install dependencies
id: install_code
run: npm i
- name: Build
id: build_code
run: npm run build
env: # Remove both lines if you don't need it
FIREBASE_CONFIG: ${{ secrets.FIREBASE_CONFIG }} # Exemple of env var coming from a secret
- name: Create Release
id: create_release
run: npx @capgo/cli@latest bundle upload -a ${{ secrets.CAPGO_TOKEN }} -c production

이것은 Capgo로 보내기 전에 의존성을 설치하고 빌드합니다.

빌드 명령어가 다르다면 build_code 단계에서 변경할 수 있습니다.

이를 작동시키려면 Capgo API 키를 받아서 GitHub 저장소의 secretCAPGO_TOKEN으로 추가해야 합니다.

이제 두 파일을 커밋하고 GitHub에 첫 번째 태그가 나타나는 것을 확인할 수 있습니다!

커밋을 추가하면 프로덕션 채널용 새로운 빌드가 생성됩니다.

코드가 작동하는지 확인하기 위해 빌드 단계에 테스트를 추가해야 합니다.

Capgo 대시보드로 가서 방금 나타난 빌드를 확인하세요. 이제 CI/CD 시스템이 구축되었습니다.

모든 사용자가 업데이트가 가능할 때마다 받을 수 있도록 하려면, 채널로 가서 public으로 설정하세요.

다음 튜토리얼을 따라 Ionic Capacitor JavaScript 앱의 네이티브 빌드도 추가할 수 있습니다 👇

CapacitorJS 앱을 위한 즉시 업데이트

앱 스토어의 지연 없이 CapacitorJS 앱에 즉시 업데이트, 수정 사항 및 기능을 푸시하세요. Capgo를 사용하여 원활한 통합, 종단 간 암호화 및 실시간 업데이트를 경험해 보세요.

지금 시작하세요

최신 뉴스

Capgo는 진정으로 전문적인 모바일 앱을 만드는 데 필요한 최고의 인사이트를 제공합니다.

Capacitor 앱에서의 양방향 통신
Development,Mobile,Updates
April 26, 2025

Capacitor 앱에서의 양방향 통신

피해야 할 5가지 일반 OTA 업데이트 실수
Development,Security,Updates
April 13, 2025

피해야 할 5가지 일반 OTA 업데이트 실수