こんにちは!チームのデプロイ速度を劇的に上げ、深夜の障害対応からエンジニアを救い出すのが生きがいのインフラお兄さんだよ。
今日はいよいよ、モダン開発の必須スキルである「CircleCI」の扉を叩く。
「CI/CDってなんだか難しそう…」「YAMLファイルを見るだけでアレルギーが出る…」そんな風に思っていないかい?
大丈夫。今日ここで僕と一緒に一歩を踏み出せば、あなたのGitHubリポジトリは「コードをプッシュするだけで、自動でテストし、ビルドしてくれる賢い相棒」に生まれ変わる。これをマスターすれば、手動テストのし忘れに冷や汗をかく夜とはお別れだ。さあ、一緒に最高にエキサイティングな自動化の世界へ行こう!
—
1. そもそもCircleCIとは? なぜ僕たちは使うのか
まずは「敵を知り、己を知る」だ。CI/CDという言葉、なんとなく耳にしたことがあるかもしれない。
- CI(Continuous Integration:継続的インテグレーション)
開発者がコードを書くたび(=こまめに統合するたび)に、自動でテストを実行し、バグを早期に発見する仕組み。
- CD(Continuous Delivery/Deployment:継続的デリバリー/デプロイ)
テストを通過した健全なコードを、自動でステージング環境や本番環境に届ける仕組み。
CircleCIは、このCI/CDをクラウド上で爆速かつ手軽に実行してくれる最高峰のSaaSツールだ。
「自分の手元のパソコンでは動いたのに、本番サーバーだと動かない…」という、エンジニアなら誰もが泣いたことのある悪夢を、クリーンなコンテナ環境で完全に防いでくれる。
—
2. 【5分で完了】GitHubアカウントとの連携ステップ
百聞は一見にしかず。まずはCircleCIと君のGitHubを繋ぎ、第一歩を踏み出そう。
ステップ1:アカウントの作成
1. [CircleCIの公式サイト](https://circleci.com/ja/)にアクセスする。
2. 右上の 「Sign Up(登録)」 または 「無料で始める」 をクリック。
3. 「Log In with GitHub」 を選択し、GitHubのアカウントで認証を行う。
(※この時、CircleCIがパブリック/プライベートリポジトリにアクセスする権限を求めてくるので、許可して進めよう)
ステップ2:プロジェクトのフォロー(連携)
ログインすると、CircleCIのダッシュボードが表示される。
1. 左側メニューの 「Projects(プロジェクト)」 をクリック。
2. 自分が管理しているGitHubのリポジトリ一覧が表示される。
3. 今回自動化したいリポジトリの横にある 「Set Up Project(プロジェクトを設定)」 ボタンを押す。
これで、CircleCIがあなたのGitHubリポジトリを監視する準備が整った!
—
3. 魔法の呪文:最初の `config.yml` を書こう
CircleCIの頭脳は、リポジトリの直下に置く `.circleci/config.yml` という1つの設定ファイルだ。
ここに「コードが来たら、こういう順番でこういう作業をしてね」と指示を書き込む。
難しく考えなくていい。まずは「世界一シンプルな挨拶」をするパイプラインを作ってみよう。
ディレクトリ構造
リポジトリのルートに、以下のようにディレクトリとファイルを作成してほしい。
my-project/
└── .circleci/
└── config.yml <-- これを作る!
魔法の設定ファイル (`config.yml`)
以下のコードをそのままコピーして `config.yml` に貼り付けてみてほしい。
CircleCIのバージョンを指定(常に最新の2.1を使おう)
version: 2.1
「ジョブ」= 実際に実行する作業の単位
jobs:
# buildという名前のジョブを定義
build:
# 実行環境(今回は手軽な軽量Linux環境:Dockerの軽量イメージを使用)
docker:
- image: cimg/base:2023.03
# 実行するステップ(上から順番に実行される)
steps:
# 1. GitHubからソースコードをチェックアウト(ダウンロード)する
- checkout
# 2. ターミナルでコマンドを実行する
- run:
name: 挨拶のメッセージを表示する
command: |
echo “====================================”
echo ” こんにちは、CircleCIの世界へようこそ!”
echo ” 自動化の第一歩が今、始まった!”
echo “====================================”
たったこれだけだ!
- docker で「どんなパソコン(環境)で動かすか」を決め、
- steps で「何をするか(チェックアウトして、文字を表示する)」を命じている。
プログラミング言語が何であれ、この構造の基本は変わらない。
—
4. いざ初陣!最初のビルドを成功させよう
設定ファイルを書き終えたら、いよいよ極上の瞬間だ。
1. 作成した `.circleci/config.yml` をGitでコミットし、GitHubへプッシュする。
git add .circleci/config.yml
git commit -m “feat: 初めてのCircleCI設定を追加”
git push origin main
2. ブラウザで CircleCIのダッシュボード に戻る。
3. 左メニューの 「Pipelines(パイプライン)」 を覗いてみよう。
…どうだ!?
見事に自分のリポジトリ名が表示され、その右側でビルドが走り始めているはずだ。
ステータスが 「Running(実行中)」 から、鮮やかな緑色の 「Success(成功)」 に変わる瞬間を見届けてほしい。
そのジョブをクリックして詳細を開き、「挨拶のメッセージを表示する」のステップを展開してみてくれ。
そこに、君が書いたメッセージが誇らしげに出力されているはずだ。おめでとう!君の最初のCIパイプラインは、今、完全に成功した!
—
5. 先輩からのアドバイス:ここから先の世界へ
お疲れ様!CircleCIの基本の「き」をマスターしたね。
これを覚えた君なら、今後は以下のようなことも簡単にできるようになる。
- `npm test` や `pytest` を仕込んで、テストが失敗したらマージできないようにする
- ビルドが成功したら、自動でAWSやVercelなどの本番サーバーにデプロイする
- Slackと連携させて、「ビルドが失敗したらチームにメンションを飛ばす」
「これをマスターすれば、毎日の作業が劇的に楽になりますよ」。
手作業でやっていた退屈なデプロイやテストはすべてCircleCIに任せて、僕たちは「よりクリエイティブで面白いコードを書くこと」に集中しよう。
の躓いたところや、「もっとこういう言語で動かしたい!」というリクエストがあれば、いつでも先輩に聞いてくれよな。次のステップへ進む準備ができたら、また声をかけてくれ。Happy Coding!