メインコンテンツにスキップ
CI/CD

Github を使用した自動ビルドとリリースアプリ

Github アクションを自作して無料でCI/CDパイプラインを作成し、Ionic Capacitor JS アプリを毎回メインにプッシュしたときに自動でデプロイする

マーティン・ドナディュー

マーティン・ドナディュー

コンテンツマーケティング

Github を使用した自動ビルドとリリースアプリ

GitHub ホスティングに焦点を当てたこのチュートリアルですが、CI/CD プラットフォームのいずれかに適応するにはわずかな調整で使用できます。

序文

Capacitor アプリを Capgo に追加することを確認してください。このチュートリアルはアップロードフェーズに焦点を当てています。 Capgo にアプリを追加する必要がある場合は、このチュートリアルに従ってください。 チュートリアル

コミット規約

まずコミット規約に従う必要があります。 「`conventional commits`」を実行すると、バージョン番号のアップグレードを理解するのに役立つツールが使用できるようになります。5分で学べます。https://capgo.io/docs/adding-app-to-capgo

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@v6
        with:
          fetch-depth: 0
          filter: blob:none
          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

メインブランチのコミットごとにタグをリリースし、メインブランチのコミットごとに changelog エントリを追加します。 CHANGELOG.md.

このファイルが必要ない場合は心配しないでください。自動で作成されます。

この機能を実現するには、 PERSONAL ACCESS TOKEN GitHub に追加してください: シークレット このことはCIが変更履歴をコミットすることを許可する必要があります。 PERSONAL_ACCESS_TOKEN.

トークンを作成するときは、期限切れの日数を選択してください。

スコープを選択してください。 never 最後に、ファイル内のバージョンを設定し、Nativeバージョン番号と同期してください。これにより、次のステップが簡単になります。 repo.

これは最初の時のみ必要です。ツールは以降のバージョンを自動的に更新します。 package.json この両方のファイルをコミットし、__CAPGO_KEEP_0__で最初のタグが表示されることを確認してください。

NativeとWebプラットフォームの両方で、各コミットごとにバージョン番号が自動的に増分されます。

GitHubのビルドアクション

このパスにファイルを作成してください。

GitHub actions for build

これは最初の時のみ必要です。以降のバージョンは自動的に更新されます。 .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@v6
      - 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 }} # Example 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

This will install and build your dependency before sending it to Capgo.

buildコマンドが異なる場合は、ステップを変更してください。 build_code To make this work, you need to get your __CAPGO_KEEP_0__ key for __CAPGO_KEEP_1__, add it in the

To make this work, you need to get your API key for Capgo, add it in the secret of your GitHub repository You can now commit this both files and see your first tag appear in __CAPGO_KEEP_0__! CAPGO_TOKEN.

You can now commit this both files and see your first tag appear in GitHub!

You should add your test in the build step to ensure your __CAPGO_KEEP_0__ is working.

Go To your code dashboard and check your build who just appeared, you now have your CI/CD system.

Go To your Capgo dashboard and check your build who just appeared, you now have your CI/CD system.

You can also add the native build of your Ionic __CAPGO_KEEP_0__ JavaScript app by following this tutorial 👇 public.

You can also add the native build of your Ionic Capacitor JavaScript app by following this tutorial 👇

自動ビルドとリリースアプリからGithubアクションで進めます

CI/CD自動化を計画している場合、__CAPGO_KEEP_0__ CI/CDに接続してください CI/CD自動化のワークフローでGithub CI/CDを使用します ネイティブビルドのワークフローで__CAPGO_KEEP_0__ Native Buildsを使用します ネイティブビルドのワークフローでCapgo Native Buildsを使用します 統合のワークフローでCapgo Integrationsを使用します 統合のワークフローでCapgo Integrationsを使用します for the product workflow in Capgo Native Builds, CI/CD自動化を計画している場合、Capgo CI/CDに接続してください CI/CD自動化のワークフローでCapgo CI/CDを使用します ネイティブビルドのワークフローで__CAPGO_KEEP_0__ Native Buildsを使用します 統合のワークフローで__CAPGO_KEEP_0__ Integrationsを使用します GitHub Actions Integration GitHub Actions Integration

リアルタイムの更新をCapacitorアプリに提供

ウェブ層のバグが生じた場合、Capgoを通じて修正を配信し、アプリストアの承認待ちの日数を待たずに済みます。ユーザーはバックグラウンドで更新を受け取り、ネイティブの変更は通常のレビュー経路を通じます。

Get Started Now

ブログの最新記事

Capgoは、プロフェッショナルなモバイルアプリを作成するために必要な最良の洞察を提供します。