GitLab と CircleCI の連携を試す

昨日、GitLab SaaS と CircleCI の連携が発表されたので試すー!

www.publickey1.jp

CircleCI でエンジニアとして働いてるけど、今日のこれは単に CircleCI のことが好きで触ってみて書いてる。趣味

参考ドキュメント

英語版は「プレビュー」の文字がなくなってるから、日本語版も近いうちに更新されるんじゃないかと思います! → (2022-07-29 追記) すでに更新されてました!はやいー!

ドキュメントを参考にしつつ、自分の好みの流れで書いてみる

1-1. GitLab のプロジェクトを作る

GitLab 使うの初めてだからドキドキしつつサインアップしてフリープランで

空のプロジェクトでもいいんだけどちょっとなんかある方がいいかなと思ったので Spring のテンプレートからプロジェクトを作った

このテンプレートだとデフォルトブランチが master なので main に変更しておいた。なんとなく

1-2. config.yml を作る

Web 上でごにょごにょできそうな雰囲気なので、そのまま .circleci/config.yml を作って最低限の情報を書いた

https://gitlab.com/bufferings/my-awesome-project/-/blob/main/.circleci/config.yml

version: 2.1
jobs:
  build:
    docker:
      - image: cimg/base:2022.07
    steps:
      - run:
          name: The First Step
          command: |
            echo 'Hello World!'

1-3. パーソナルアクセストークンを作る

GitLab がフリープランの場合、CircleCI との連携には現在のところ OAuth じゃなくてアクセストークンを使わないといけないみたいなので、GitLab でパーソナルアクセストークンを作る

https://gitlab.com/-/profile/personal_access_tokens

Select scopes のところは api だけを選んだ

2022-07-29 追記ここから =====

公式ドキュメントに次のように書いてありました:

アクセストークンを下記手順で使用する場合、 api スコープと write_permissions スコープを選択する必要があります。

write_permissions スコープも必要みたいです!すみません!

2022-07-29 追記ここまで =====

これで GitLab 側の準備は OK。次は CircleCI 側

2-1. CircleCI に GitLab 連携用の Organization を作る

GitLab 連携は新しい仕組みになってる

これまでは GitHub や BitBucket の Organization が反映されてたけど、GitLab 連携では自分で Organization を作る

CircleCI の画面の左上のプルダウンから Create New Organization を選択

"Hello GitLab" って名前にしといた

2-2. 作った Organization に Project を登録する

これも GitHub のときは、自動でその Organization 内のリポジトリがすべて表示されて設定ができたけど、GitLab 連携では自分で Project を登録する

画面左上のプルダウンからさっき作った Organization を選んだ状態で、左メニューから Projects を選択、Create Project をクリック

  1. Project 名を入力。普通はリポジトリの名前と同じにしておいたら良いと思うけど、今回は違う名前だとどう見えるのかを見たかったので違う名前にした
  2. GitLab フリープランなので、アクセストークンを選択
  3. 手順 1-3 で作ったパーソナルアクセストークンを入力
  4. Connect ボタンを押すと GitLab と連携をしてリポジトリ一覧が表示されるので
  5. さっき作った GitLab のリポジトリを選択して
  6. Create Project を押すと、プロジェクトのパイプライン一覧画面が開く

これで連携完了ヽ(=´▽`=)ノ

GitLab でリポジトリに変更を入れる

GitLab の画面から適当に更新コミットを入れると。。。

動いたー!

せっかく Spring のテンプレートを選んだけど、ちょっともう眠いからこれで良しとする!

知っておくと便利かもしれないこと

流れ

GitLab のリポジトリをプロジェクトとして登録するときに、こういう設定が自動で登録されている

Project Settings の

  • Configuration に GitLab のリポジトリの設定ファイルが登録されていて
  • Triggers に GitLab のリポジトリからの更新を受けて起動されるトリガーが登録されていて

GitLab 側の

  • Webhook に、そのトリガーの Webhook をキックする設定が登録されている

ふだんは特に意識しなくても良い部分だと思うけど、何か問題があったときにこの流れを知ってると便利かもしれない

新しいコンセプト

さっき少しふれたけど、Organization と Project にこれまでとはちょっと違うコンセプトが導入されている

  • Project
  • Organization
    • 複数のプロジェクトを管理する
    • ユーザーを管理することができる

Coming soon

まだサポートされていない機能があったりするので Coming soon な機能の一覧には目を通しておいたほうが良さそう

https://circleci.com/docs/ja/gitlab-integration#coming-soon

こんなところかな。GitLab 便利そうー!面白かった。