Fun Done Run

yazawa's tech blog

CircleCI ではじめてのビルドを成功させる

f:id:yazawa_tech:20190720171857p:plain

自動化や効率化が大好きではあるものの、CI/CD のためのツールを今までJenkins 以外使用したことがなかったため、有名な CircleCI を試してみた。簡単な導入までのハンズオンの手順をまとめておく。

CircleCI とは

CI(Continuous Integration) を支援するためのツールで、特定のイベントに基づいたテストの実行や、指定した環境へのオートデプロイなど、開発のサイクルに必要なタスクを一部自動化し、使い方によっては開発効率を大幅に上げてくれる。

f:id:yazawa_tech:20190713201641p:plain

実際に使ってみる

使用するに当たって事前にサインアップが必要で、GitHubBitbucket でログインする必要がある。今回はGitHub でログインしてリポジトリと連携させてみる。

f:id:yazawa_tech:20190713201928p:plain

初回にGitHub でログインするボタンを押すと、自身のGitHub アカウントとCircleCI の連携を許可するか確認する画面が出てくるので、「Authorize circleci」をクリックして認証する。

f:id:yazawa_tech:20190713202324p:plain

認証が完了すると、GItHub アカウントでのログインが完了し、GitHubリポジトリが表示されているCircleCI のダッシュボードに移動する。

f:id:yazawa_tech:20190709061303p:plain
ログイン後の画面

ここでCircleCI で管理したいリポジトリ(= CI を導入したいリポジトリ)を選択して「Follow」ボタンをクリックする。

f:id:yazawa_tech:20190709061717p:plain

すると最初のビルドが実行されるが、Job の実行に失敗している。

f:id:yazawa_tech:20190709061827p:plain

これはdevelop ブランチの最新のコミットに対してビルドが実行されているが、恐らくGitHub の対象のリポジトリのデフォルトに設定されているブランチを対象にしていると思われる。

f:id:yazawa_tech:20190713203657p:plain
develop ブランチに「Default」が設定されている

上記のエラー画面の「#1」のリンクをクリックすると、ビルド実行時のログを見ることができる。

f:id:yazawa_tech:20190709061941p:plain

ここでは「CircleCI の設定が不足しているため」という意味合いのエラーが出ているため、ログに表示されているドキュメントページを参照しながら設定ファイルを書き換えていく。

hello-build

今回はもっとも簡単な例として、hello-build というOrb を使ってビルド時にHello yazawatech という文字列を出力させてみる。手順は以下のように実施する。

  1. Git 管理されているプロジェクトのルートディレクトリに .circleci/config.yml ファイルを作成
  2. hello-build orb をインポートする記述と共に設定ファイルを記述
  3. Git のリモートリポジトリへプッシュ

1. Git 管理されているプロジェクトのルートディレクトリに .circleci/config.yml ファイルを作成

$ mkdir .circleci
$ touch .circleci/config.yml

2. hello-build orb をインポートする記述と共に設定ファイルを記述

Orb とは「CircleCI を手早く使い始めるためのコンフィグパッケージ」のことで、 CircleCI Orbs レジストリでさまざまなOrb が公開されている。

circleci.com

今回はhello-build を使用するため、以下のように記述する。

version: 2.1

orbs:
    hello: circleci/hello-build@0.0.7 # uses the circleci/buildpack-deps Docker image

workflows:
    "Hello Workflow":
        jobs:
          - hello/hello-build

この状態でコミットとプッシュをすると、ビルドが実行されて、hello-world が出力される。

$ git add .circleci/config.yml
$ git commit -m 'Add circle ci config file'
$ git push

プロジェクトのダッシュボードを見てみる。

f:id:yazawa_tech:20190709064207p:plain
ビルドが成功している

f:id:yazawa_tech:20190709064412p:plain

無事にビルドに成功し、 Hello yazawatech という出力がされていることがわかる。

まとめ

  • 今回はCI ツールであるCircleCI を初めて触ってみた
  • CI ツールでは「特定のブランチにプッシュしたらデプロイする」といったイベントごとの制御ができるので、色々試したい