CircleCIでCI/CDを設定するための初心者ガイド

2024年12月17日 17:34

この記事は弊社のフルスタックエンジニア：Ashish Dhakalが作成した記事です。英語版はこちらをご覧ください。
Medium

CircleCIで最初のCI/CDパイプラインを構築することは、エキサイティングな経験になるでしょう。目標は、Node.js プロジェクトのビルドとテストのプロセスを自動化し、すべてのコードプッシュがテストによって検証され、デプロイ前に適切にビルドされるようにすることです。ここでは、CircleCI のセットアップからパイプラインの記述とトリガーまでのプロセスの詳細な内訳を説明します。

CircleCIを選ぶ理由

Jenkins、GitHub Actions、TravisCIなど、CI/CDのためのツールが数多くある中、CircleCIが選ばれる理由は以下の通りです：

シンプルな設定： 複雑な設定は必要ありません - 簡単なYAMLファイルだけです。
Dockerとの統合： ネイティブのDockerサポートを提供し、ビルド環境の分離を容易にします。
依存関係キャッシュ: 効率的なキャッシュメカニズムにより、冗長なインストールを回避してビルドを高速化します。
スケーラビリティと並列ジョブ： 複数のジョブの並列実行をサポートし、プロジェクトの成長に合わせてパイプラインの高速化を実現します。
無料ティア: コストをかけずにCI/CDを試すのに最適です。
GitHubとのシームレスな統合： GitHubリポジトリと簡単に接続し、最小限のセットアップでパイプラインを開始できます。

ステップ1：CircleCIの設定

アカウントの作成: はじめに、GitHubアカウントを使用してCircleCIにログインします。CircleCIからリポジトリへのアクセス許可が要求されるので、許可する必要があります。
プロジェクトの選択: ログイン後、Projectsタブに移動し、自動化するGitHubリポジトリを選択する。
パイプラインの設定: CircleCIは「Set Up Project 」を促すので、プロジェクトリポジトリ内に.circleci/config.ymlファイルを追加する。

ステップ 2: .circleci/config.yml をリポジトリに追加する

プロジェクトのルートに.circleciという名前のフォルダが作成され、その中にconfig.ymlファイルが追加される。ここに、コンフィギュレーションのために書かれた完全なコードがある：

version: 2.1

executors:
  node-executor:
    docker:
      - image: circleci/node:14 # Defines the Node.js environment

jobs:
  build:
    executor: node-executor
    steps:
      - checkout # Pulls the latest code from the repository

      - restore_cache:
          keys:
            - v1-dependencies-{{ checksum "package-lock.json" }}
            - v1-dependencies- # Fallback key if the main cache isn't found

      - run:
          name: Install Dependencies
          command: npm install

      - save_cache:
          paths:
            - node_modules
          key: v1-dependencies-{{ checksum "package-lock.json" }}

      - run:
          name: Build Application
          command: npm run build

  test:
    executor: node-executor
    steps:
      - checkout

      - restore_cache:
          keys:
            - v1-dependencies-{{ checksum "package-lock.json" }}
            - v1-dependencies-

      - run:
          name: Run Manual Test Cases
          command: node ./tests/sampleTestCases.js

workflows:
  version: 2
  build_and_test:
    jobs:
      - build
      - test:
          requires:
            - build

ステップ3：コンフィギュレーションを理解する

このファイルでは、ビルドとテストという2つのジョブと、それらをつなぐワークフローを定義しています。

エクゼキュータの設定

CircleCIでは、エクゼキュータがジョブの実行環境を定義します。すべてのジョブが一貫したNode.js環境で実行されるように、circleci/node:14というイメージのDockerコンテナが使用されました。

executors:
  node-executor:
    docker:
      - image: circleci/node:14

ビルドジョブ

このジョブはコードのチェックアウト、依存関係のインストール、キャッシュ、プロジェクトのビルドを行います。

チェックアウトします： リポジトリから最新のコードを取り出します。
restore_cache： ビルドを高速化するために、以前にインストールした依存関係のキャッシュを探します。
npm install： プロジェクトに必要な依存関係をインストールします。
save_cache： インストールした node_modules ディレクトリを将来のビルドのために保存します。
npm run build： ビルドプロセスを実行します（package.json 内にビルドスクリプトが必要です）。

jobs:
  build:
    executor: node-executor
    steps:
      - checkout
      - restore_cache:
          keys:
            - v1-dependencies-{{ checksum "package-lock.json" }}
      - run:
          name: Install Dependencies
          command: npm install
      - save_cache:
          paths:
            - node_modules
      - run:
          name: Build Application
          command: npm run build

テストジョブ

このジョブはコードを取り出し、依存関係をキャッシュから復元し、手動でテストスクリプトを実行します。

チェックアウトします： 最新のコードが利用可能であることを確認します。
restore_cache： キャッシュされた依存関係をリストアします。
テストケースの実行： tests/sampleTestCases.js にある Node.js スクリプトを使用して、手動テストケースを実行します。

  test:
    executor: node-executor
    steps:
      - checkout
      - restore_cache:
          keys:
            - v1-dependencies-{{ checksum "package-lock.json" }}
      - run:
          name: Run Manual Test Cases
          command: node ./tests/sampleTestCases.js

ワークフローの設定

ワークフローは、ジョブの接続方法を定義する。このセットアップでは、ビルドジョブが正常に完了した後にのみテストジョブが実行されます。

workflows:
  version: 2
  build_and_test:
    jobs:
      - build
      - test:
          requires:
            - build

ステップ4：テストケースの作成

ダミーのテストケースをtests/sampleTestCases.jsというファイルに追加した。これらのテストは基本的な機能を検証するもので、パイプラインの一部として簡単に実行できるように設計されています：

const assert = (description, condition) => {
    if (!condition) throw new Error(`Test failed: ${description}`);
    console.log(`Test passed: ${description}`);
};

// Manual Test Cases for Sample Functions
const sum = (a, b) => a + b;
const isPositive = (num) => num > 0;

// Test Cases
assert("sum(2, 3) should be 5", sum(2, 3) === 5);
assert("sum(-2, -3) should be -5", sum(-2, -3) === -5);
assert("isPositive(5) should be true", isPositive(5) === true);
assert("isPositive(-5) should be false", isPositive(-5) === false);

これらのテストでは、単純なアサート関数を使用して条件が満たされているかどうかをチェックします。テストが失敗した場合はエラーがスローされます。パスした場合は成功のメッセージが表示されます。

ステップ 5: パイプラインのトリガー

.circleci/config.ymlファイルとテストケースを追加した後、変更をコミットしてGitHubリポジトリにプッシュした。CircleCIは新しい設定を検出し、自動的にパイプラインをトリガーしました。

パイプラインの監視

CircleCIのダッシュボードから、ビルドとテストの両方のジョブが表示され、実行されていた。ビルドは正常に完了し、続いてテストジョブがエラーなしでダミーのテストケースを実行した。

最終的な感想

CircleCIでこのCI/CDパイプラインをセットアップすることは素晴らしい経験だった。現在、新しいコードがプッシュされるたびに、CircleCIは自動的に次のことを行う：

最新の変更をプルする。
依存関係をインストールし、プロジェクトをビルドする。
テストを実行し、すべてが期待通りに動作することを確認する。

この自動化されたパイプラインは時間を節約し、コードが常にデプロイ可能であることを保証する。プロジェクトが成長するにつれて、リンティングやデプロイメントステップなどのジョブをパイプラインに追加することができます。このセットアップを導入すれば、すべての変更が前に進む前に徹底的にテストされ、ビルドされるという確信が得られる。
Happy Coding!! 🎉

協業開発及び開発パートナーをお探しのお客様へ

弊社は、ネパールに海外拠点を持ち、生成AI、モバイルアプリ、システム開発を中心に事業を展開する企業です。

自社サービスの開発経験を活かし、クライアント様と共に事業を創造することを重視し、創業以来、スタートアップから中小企業、大手企業、自治体まで、幅広い開発実績があります。プロダクトはユーザーが使いやすいように設計しており、企画から開発、保守運用まで対応しています。開発技術を厳選し限定することで、セキュリティ、プロダクトの品質向上に努めており、事業開発に関する課題を深く理解し、最適なご提案が可能です

お問い合わせはこちらから：
お問い合わせフォーム：https://readytowork.jp/

直通番号：080-8940-7169