こんにちは。エンジニアの遠藤です。
ミルディアでは、 CI/CD のツールとして、 Bitrise を使うことが多いです。
https://bitrise.io/

元々は XCode でのビルドが必要なプロジェクトでよく使っていましたが、今では Web App のデプロイや serverless のデプロイなどにもバンバン使っています。

今回は、ミルディアで構築しているセルフホスティングの GitLab と接続して app を新規構築する手順を紹介します。
また、 Webhook の設定方法も合わせてご紹介いたします。

初期設定については、１プロジェクトにつき1回しか行わないため、よく忘れてしまうので、自分の備忘録と社内共有の意図が強いですが、同じような環境の方の参考になれば幸いです。

途中で、 Bitrise と Gitlab の画面を行ったり来たりするので、迷わないようにしましよう。

環境

Bitrise: https://bitrise.io/
GitLab: 15.5.2

事前準備

Gitlab はすでに構築済みで、連携したいプロジェクトが存在しているものとします。
また、 Bitrise のアカウントもすでに用意してください。

app の追加 （Bitrise）

https://app.bitrise.io/dashboard
ダッシュボードから、「Add new app」を選択

「Web UI」で進めます。

Workspace の設定 (Bitrise)

追加したい Workspace を選びます。

基本的に外部公開はしないので、「Only Workspace members」を選びましょう。

選んだら、「Next」で進みます。

Select repository (Bitrise)

「Enter URL manually」 を選びます。

「Select remote repository」の中に、「Self-hosted GitLab」がありますが、これは使いません。

Git repository (clone) URL (Gitlab)

ここで、 Gitlab に飛び、 URL をコピペしてきます。

SSH の URL を　Bitrise のURL欄に貼り付けたら、「Next」で進みます。

Setup repository access (Gitlab)

「Select repository」で SSH の URL を入力していると、ここでは公開鍵を登録する手順となります。
まずは「I need to」を選びます。

すると、公開鍵が表示されますので、コピーします。

Add an SSH key (Gitlab)

コピーした、 公開鍵を Gitlab のアカウントに追加します。
追加先のアカウントは、事前に準備したプロジェクトへアクセスする権限のあるユーザにしましょう。

「Edit Profile」

「SSH Keys」

「Add an SSH key」に先にコピーしていた公開鍵を貼り付け、「Add key」で追加します。
Title や Expiration date は適当な値を設定してください。

I've added the SSH key (Bitrise)

Gitlab に追加できたら Bitrise に戻り、 「I've added the SSH key」を押下します。

Choose Branch (Bitrise)

「Default Branch」 を入力します。

後で変更できるので、 Gitlab の Default Branch と一致させておくと良いでしょう。
Gitlab の Default Branch は　「Settings」 → 「Repository」 から確認、変更が可能です。

Scan branch to auto-detect configuration? (Bitrise)

• Yes, auto-detect configuration.
  • こちらを選択すると、プロジェクトの構成を自動でスキャンして、良い感じの設定をしてくれます。
• No, skip auto-detection and configure settings manually.
  • こちらを選択すると、自分でビルドする OS などを選ぶことになります。

モバイル系の開発をされていて、プロジェクト直下に、一つのアプリしかない場合などは、 auto-detect を選んでしまって良いと思います。
例えば、 XCode, Android, React Native, Flutter といったモバイル系などは自動で構成してもらって良いかと思います。
serverless, PHP, node.js などなど、バックエンドを含む場合は、手動で設定するのが良いかと思います。

今回は No を選択した前提で進めます。

Project build configuration (Bitrise)

ここで、何のプロジェクトなのかを選択します。

Android や、 Web のビルドをする場合は、「OTHER/MANUAL」を選びます。
また、特定の XCode バージョンを選択したい場合も「OTHER/MANUAL」を選びます。

今回は 「Android & Docker, on Ubuntu 20.04」 にしました。

OSを選んだら、「I'm ready」で進みます。

App icon (Bitrise)

ここは必要に応じて設定してください。
私は一度も設定したことがありませんが、視認性を高めるためには、わかりやすいアイコンを設定すると良いですね。

Webhook setup (Bitrise)

ここでの 「Webhook setup」 は無視します。

We've kicked off your first test build for you!

ここまでできたら、「We've kicked off your first test build for you!」を押下し、セットアップを完了します。

Webhook setup

ここまでの手順が終わると、手動でビルドを走らせることができます。
ただ、毎回手動でビルドは面倒なので、 Gitlab へ push が飛んだ際などに、自動でビルドしたいこともあると思います。
そこで必要になるのが、 Webhook の設定です。

App Settings (Bitrise)

Webhook の URL を確認するため、 App Settings へ飛びます。

「Integrations」 を確認します。

下の方にスクロールすると、「Incoming Webhooks」 があるので、「Set up webhook manualy」を選択します。

ダイアログが表示されるので、「Gitlab」を選びます。

「Webhook URL」が表示されるのでコピーしましょう。

Webhooks (Gitlab)

再び Gitlab に戻り、プロジェクトの「Settings」 → 「Webhooks」 と進みます。

「URL」に前の手順でコピーした URL を貼り付けて、トリガーにしたいイベントにチェックを入れます。

最後に、「Add Webhook」を押下すれば終わりです。
例えば、「Push events」にチェックを入れた状態で、このプロジェクトに適当な push を行うと Bitrise が走り出すのが確認できると思います。

終わりに

以上です。
全てWeb画面上で完結するので、特に難しいことはないのですが、私が初めて構築した時には結構迷子になりました。
どの画面からどうやって設定するのか？というのがピンポイントで検索で出てこないですし、こんな初期設定に時間を使うのは勿体無いので、記事としてまとめてみました。

Bitrise では初期構築以外にも、ビルドでハマることがちょこちょこあるので、これからも定期的に記事にまとめていきたいと思います。