Casual Developers Note

エンジニアやデザイナー向けの技術情報・英語学習情報・海外留学情報・海外旅行情報を提供中。世界を旅して人生を楽しもう。

  • ホーム
  • 技術 Tips & Tutorials
  • 技術塾
  • ライフハック
  • 海外留学
  • 英語学習
  • コラム
  • お問い合わせ
現在の場所:ホーム / アーカイブdevops

2018年11月19日 By KD コメントを書く

爆速でJenkinsをマスターしよう(NodeJS編) ~ JenkinsセットアップからNodeJS自動テスト、Job DSLまで ~

爆速でJenkinsをマスターしよう(NodeJS編) ~ JenkinsセットアップからNodeJS自動テスト、Job DSLまで ~

DevOpsを実現するための最も有名なCI/CDツールはJenkinsです。今回はDocker環境を前提として、JenkinsのセットアップとNodeJSの自動テストを実施する方法を紹介します。

はじめに

継続的インテグレーション(CI)や継続的デプロイ(CD)の価値が一般的に認知され、DevOpsはアプリケーションの開発において必須の考え方となっています。このCI/CDを実現する方法としては、外部のサービスを使う方法と自前で専用のサーバーを用意して専用のツールを導入する方法があります。前者のサービスは、Travis CIやCircle CIなどのサービスが有名で、後者の専用のツールとしてはJenkinsが抜群に有名です。

今回はそんな有名なCI/CDツールであるJenkinsのセットアップからNodeJSの自動テストを実施する方法を紹介します。

前提

以下の準備が完了している必要があります。

  • Dockerがインストールされていること
  • NodeJSがインストールされていること
  • GitHubのアカウントがあること

Jenkinsのセットアップ

まずはJenkinsのセットアップからはじめましょう。

ベースを作る

必要なフォルダとファイルを作成します。

$ mkdir devops_jenkins_nodejs
$ cd devops_jenkins_nodejs/
$ touch Dockerfile
$ touch docker-compose.yml

Dockerファイルを作る

Dockerfile

Jenkinsの公式イメージはJenkinsのバージョンが古いため、最新化するためにDockerfileを作成します。

FROM jenkins

USER root

RUN cd tmp/ \
    && wget https://updates.jenkins-ci.org/latest/jenkins.war \
    && mv ./jenkins.war /usr/share/jenkins/

USER jenkins

docker-compose.yml

Jenkinsに設定した内容を記録できるようにボリュームを以下のように設定します。

version: "3"

services:
  jenkins:
    build: .
    ports:
      - 8080:8080
    volumes:
      - ./jenkins_home:/var/jenkins_home

Jenkinsの起動

Docker Composeを使ってJenkinsを起動します。

$ docker-compose up --build -d
$ docker-compose ps
             Name                            Command               State                 Ports
------------------------------------------------------------------------------------------------------------
devops_jenkins_nodejs_jenkins_1   /bin/tini -- /usr/local/bi ...   Up      50000/tcp, 0.0.0.0:8080->8080/tcp
$ docker-compose logs -f jenkins
...
jenkins_1  | *************************************************************
jenkins_1  | *************************************************************
jenkins_1  | *************************************************************
jenkins_1  |
jenkins_1  | Jenkins initial setup is required. An admin user has been created and a password generated.
jenkins_1  | Please use the following password to proceed to installation:
jenkins_1  |
jenkins_1  | 512ed9cfaf384d3fb7d75ee6c8b354d6
jenkins_1  |
jenkins_1  | This may also be found at: /var/jenkins_home/secrets/initialAdminPassword
jenkins_1  |
jenkins_1  | *************************************************************
jenkins_1  | *************************************************************
jenkins_1  | *************************************************************
...

この時、出力される初期化パスワード(今回は「512ed9cfaf384d3fb7d75ee6c8b354d6」)をメモします。

Jenkinsの初期設定

ブラウザで「localhost:8080」にアクセスします。

以下の画面が表示されるので、先程メモしておいた初期化パスワードを入力して「Continue」をクリックします。

NewImage

次に推奨設定でプラグインをインストールします。必要なプラグインが自動でインストールされるので、特に理由がなければ推奨設定でよいでしょう。

NewImage

NewImage

プラグインのインストールが完了すると以下の画面になるので、管理者ユーザのユーザ名とパスワードを決めて設定し、「Save and Continue」をクリックします。

NewImage

JenkinsのURLはデフォルトで「http://localhost:8080」なので、必要があれば変更しましょう。今回はそのままで、「Save and Finish」をクリックします。

NewImage

最後に「Start using Jenkins」をクリックします。

NewImage

Jenkinsのホーム画面が表示されればOKです。

NewImage

これでJenkinsのセットアップが完了しました。

サンプルNodeJSアプリケーションの作成

CIの対象となるNodeJSアプリケーションを簡単に作成しましょう。

ベースを作る

必要なフォルダとファイルを作成し、テスト用のパッケージをインストールします。

$ mkdir devops_sample_nodejs
$ cd devops_sample_nodejs/
$ npm init -y
$ mkdir src test
$ touch src/index.js
$ touch src/utils.js
$ touch test/utis.spec.js
$ tree
.
├── package.json
├── src
│   ├── index.js
│   └── utils.js
└── test
    └── utis.spec.js
$ npm i -D jest

実装する

それでは簡単な四則演算のアプリケーションを作ります。

index.js

const { math } = require('./utils');

console.log(`Next year is ${math.add(2018, 1)}.`);
console.log(`${math.subtract(2020, 2018)} years until Tokyo Olympic.`);

utils.js

const math = {
  add: (x, y) => x + y,
  subtract: (x, y) => x - y
};

module.exports = { math };

utils.spec.js

const { math } = require('../src/utils')

describe('utils test', () => {
  describe('math test', () => {
    test('should be 3 when adding 1 and 2', () => {
      expect(math.add(1, 2)).toBe(3);
    });

    test('should be -1 when subtracting 2 from 1', () => {
      expect(math.subtract(1, 2)).toBe(-1);
    });
  });
});

package.json

{
  "name": "devops_sample_nodejs",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "start": "node src/index.js",
    "test": "jest"
  },
  "keywords": [],
  "author": "",
  "license": "ISC",
  "devDependencies": {
    "jest": "^23.6.0"
  }
}

完成です。

GitHubにPushする

後でJenkinsから利用できるようにGitHubにPushしておきましょう。

お決まりですが、GitHub上で以下のようにリポジトリを作ります。

NewImage

以下のようにしてPushしましょう。

$ git init
$ touch .gitignore
$ echo node_modules/ > .gitignore
$ git add .
$ git commit -m "initial commit"
$ git remote add origin https://github.com/{your-github-account}/devops_sample_nodejs.git
$ git push -u origin master

「{your-github-account}」は自分のGitHubアカウントに置き換えてください。

これでサンプルのNodeJSアプリケーションが完成しました。

Job DSLによる新しいジョブの追加

それではJenkinsに戻りましょう。

Job DSLとは?

ここで簡単にJob DSLを説明しておきます。Job DSLとはJenkinsの新しいジョブの設定をDSL(Domain Specific Language)で書いておき、それを読み込むだけでGUIを使わずに新しいジョブを作成する仕組みです。今はInfrastructure as code(IaC)と言われているように、インフラであっても人が手動で設定するのではなく、設定をソースコードにして自動的に設定されるべきです。そのためにJob DSLは有効な手段です。

GitHubのコミットを検知する方法

今回はGitHubのソースコードがコミットされたらそれを検知する設定をします。その設定方法は以下の2種類があります。

  • Pull型: GitHubリポジトリにJenkinsから数分単位でポーリングして、新しいコミットがあればビルドを実行する
  • Push型: GitHubリポジトリにJenkinsへのWebhookを設定しておき、新しいコミットが発生したタイミングでJenkinsに通知してビルドを実行する

Pull型の方が昔からあるのでメジャーな方法ですが、基本的にはどちらでも問題無いでしょう。どちらかと言うと、Jenkinsを配置するネットワーク環境に応じてどちらを使うかが変わります。例えば、プライベートネットワーク上にJenkinsを構築してVPNでJenkinsを使用している場合、Webhookは使用できないのでPull型の方法を選択することになります。一方で、AWSなどのパブリッククラウド上でVPC内にJenkinsを構築している場合は、ファイアーウォール(Security Group)からGitHubを許可すればWebhookが使えるので、Push型の方法を採用できます。

今回はPull型の方法で進めていきます。

NodeJSプラグインを入れる

JenkinsからNodeJSを実行するためにNodeJSプラグインをインストールしましょう。

ホーム画面から「Jenkinsの管理」をクリックします。

NewImage

「プラグインの管理」をクリックします。

NewImage

「NodeJS」を選択して、「ダウンロードして再起動後にインストール」をクリックします。

NewImage

「インストール完了後、ジョブがなければJenkinsを再起動する」をクリックします。

NewImage

Jenkinsが再起動したら完了です。

NodeJSをJenkinsにインストールする

NodeJSをインストールしましょう。

「Jenkinsの管理」から「Global Tool Configuration」をクリックします。

NewImage

「NodeJS追加」をクリックし、任意の名前(今回は「nodejs_v11」)をつけて、「自動インストール」にチェックを入れいます。「Save」をクリックします。

NewImage

これでJenkinsにNodeJSがインストールされました。

Job DSLプラグインを入れる

JenkinsでJob DSLを使用するにはJob DSLプラグインが必要です。

NodeJSプラグインを入れた時と同じように、「Jenkinsの管理」から「プラグインの管理」でインストールできます。

NewImage

Jenkinsが再起動されれば完了です。

Job DSLを作成する

それでは新しいジョブ用のDSLファイルを作成します。

$ pwd
/Users/you/devops_sample_nodejs
$ touch nodejs.groovy

nodejs.groovy

DSLは以下のようにします。

job('NodeJS Job') {
    scm {
        git('https://github.com/{your-github-account}/devops_sample_nodejs.git') {  node ->
            node / gitConfigName('DSL User')
            node / gitConfigEmail('jenkins-dsl@example.com')
        }
    }
    triggers {
        scm('H/5 * * * *')
    }
    wrappers {
        nodejs('nodejs_v11')
    }
    steps {
        shell("npm install")
        shell("npm test")
    }
}

「{your-github-account}」は自分のGitHubアカウントに置き換えてください。

DSLの内容は、対象Gitリポジトリの指定、5分毎のポーリング設定、NPMのテスト実行、です。

このDSLをGitHubにPushしておきます。

$ git add .
$ git commit -m 'Add DSL'
$ git push origin master

これでJob DSLの作成は完了です。

Job DSLから新しいジョブの作成

Job DSLをGitHubから読み込んで新しいジョブを作成しましょう。

Jenkinsのホーム画面から、「新しいジョブ」をクリックします。

NewImage

任意のジョブ名(今回は「seed_project」)を入力し、「フリースタイル・プロジェクトのビルド」を選択し、「OK」をクリックします。

NewImage

「ソースコード管理」で「Git」を選択し、「リポジトリURL」(今回は「https://github.com/{your-github-account}/devops_sample_nodejs.git」)を入力します。

NewImage

「ビルド」から「Process Job DSLs」をクリックします。

NewImage

「Look on Filesystem」を選択し、「DSL Scripts」にDSLファイルのパスを入力します。「保存」をクリックして完了です。

NewImage

このDSLを実行するには承認プロセスが必要です。「Jenkinsの管理」から「In-process Script Approval」をクリックします。

NewImage

対象のDSLのところに表示されている「Approved」をクリックしてDSLファイルを承認します。

NewImage

NewImage

「seed_project」に戻り、「ビルド実行」をクリックします。

NewImage

以下のようにSUCCESSになればビルドが完了です。

NewImage

ホーム画面に戻ると、以下のように新しいジョブが作成されています。

NewImage

新しいジョブの中身を見てみましょう。「設定」をクリックします。

NewImage

「ソースコード管理」に正しくGitHubリポジトリが設定されています。

NewImage

「ビルド・トリガ」に「SCMポーリング」の設定が5分単位でポーリングするように設定されています。ちなみに、この設定はcronと同じ記述方法です。

「ビルド環境」にNodeJSプラグインでインストールしたNodeJSバージョン11の環境が指定されています。

NewImage

「ビルド」に自動テストのためのシェルスクリプトが設定されています。

NewImage

DSLの内容が正しく設定されていることが確認できました。

これで新しいジョブの追加が完了しました。

CIの動作確認

最後にCIの動作確認をしていきましょう。

ジョブの実行による自動テスト

それでは「ビルド実行」をクリックしてビルドを開始します。

NewImage

テストが正しく実行されています。

NewImage

OKですね。

GitHubへコミットをトリガーとして自動ビルド

それでは、ソースコードを変更してコミットしてみましょう。

utils.jsには足し算と引き算の関数だけがありましたが、掛け算と割り算を追加しましょう。

index.js

const { math } = require('./utils');

console.log(`Next year is ${math.add(2018, 1)}.`);
console.log(`${math.subtract(2020, 2018)} years until Tokyo Olympic.`);
console.log(`The tax of 100 yen is ${math.multiply(100, 0.1)} yen if the tax rate is 10%.`);
console.log(`I baked 10 cookies. There're 5 people here so you can eat ${math.divide(10, 5)}.`);

utils.js

const math = {
  add: (x, y) => x + y,
  subtract: (x, y) => x - y,
  multiply: (x, y) => x * y,
  divide: (x, y) => x / y
};

module.exports = { math };

utils.spec.js

const { math } = require('../src/utils')

describe('utils test', () => {
  describe('math test', () => {
    test('should be 3 when adding 1 and 2', () => {
      expect(math.add(1, 2)).toBe(3);
    });

    test('should be -1 when subtracting 2 from 1', () => {
      expect(math.subtract(1, 2)).toBe(-1);
    });

    test('should be 12 when multipying 3 by 4', () => {
      expect(math.multiply(3, 4)).toBe(12);
    });

    test('should be 4 when dividing 8 by 4', () => {
      expect(math.divide(8, 2)).toBe(4);
    });
  });
});

これをコミットします。

$ git add .
$ git commit -m 'Add multiply and divide functions'
$ git push origin master

しばらくすると(5分以内)、以下のようにJenkinsがコミットを検知して自動的にビルドが開始されます。

NewImage

テストが正しく実行されています。

NewImage

これで全て完了です。

最後に

いかがでしたか?これでJenkinsを爆速でマスターできたのではないでしょうか。CI/CDを実施して、継続的に品質の高いアプリケーションを生み出していきましょう。それでは。

環境

  • Docker: 18.06.1-ce, build e68fc7a
  • NodeJS: v11.0.0
  • Jenkins: 2.151

カテゴリ : 技術 Tips & Tutorials タグ : cicd, devops, docker, jenkins, jenkins-job-dsl, nodejs

  • « 前のページ
  • 1
  • 2

ブログ更新情報や海外の関連情報などを配信する無料メルマガ

Sponsored Links

About Author

KD

世界を旅し日本を愛するエンジニア。大学でコンピュータサイエンスの楽しさを学び、日本の大手IT企業で働く中で、新しい技術やスケールするビジネスが北米にある事に気づく。世界に挑戦するための最大の壁が英語であったため、フィリピン留学およびカナダ留学を経て英語を上達させた。現在は日本在住でエンジニアとして働きつつ、次の挑戦に備えて世界の動向を注視している。挑戦に終わりはない。このブログでは、エンジニアやデザイナー向けの技術情報から、海外に留学したい人向けの留学情報、海外に興味がある人向けの海外旅行情報など、有益な情報を提供しています。

https://casualdevelopers.com/

最近の投稿

  • 2020年JS周辺のバックエンド寄りの注目技術!ネクストNodeJSの「Deno」と分散型パッケージレジストリの「Entropic」の紹介

    2020年JS周辺のバックエンド寄りの注目技術!ネクストNodeJSの「Deno」と分散型パッケージレジストリの「Entropic」の紹介

    2020年1月13日
  • 今さら聞けないJavaによる関数型プログラミング入門 ~ラムダ式、ストリーム、関数型インターフェース~

    今さら聞けないJavaによる関数型プログラミング入門 ~ラムダ式、ストリーム、関数型インターフェース~

    2019年11月4日
  • ReactのためのEslintおよびPrettierの設定方法 ~Airbnb JavaScript Style Guideの適用~

    ReactのためのEslintおよびPrettierの設定方法 ~Airbnb JavaScript Style Guideの適用~

    2019年10月30日
  • BashからZshに移行する方法(Mac編)

    BashからZshに移行する方法(Mac編)

    2019年10月21日
  • Create React Appを使わないでゼロからReactの開発環境を構築する方法(Webpack/Docker編)

    Create React Appを使わないでゼロからReactの開発環境を構築する方法(Webpack/Docker編)

    2019年9月30日

カテゴリ

  • 技術 Tips & Tutorials (100)
  • 技術塾 (6)
  • ライフハック (26)
  • 海外留学 (12)
  • 英語学習 (3)
  • コラム (6)

アーカイブ

最高の学習のために

人気記事ランキング

  • MySQLで「ERROR 2003 (HY000): Can't connect to MySQL server」と怒られた時の対処法
    MySQLで「ERROR 2003 (HY000): Can't connect to MySQL server」と怒られた時の対処法
  • SAKURAのメールボックスで独自ドメインのメールを設定し、Gmail経由で送受信する方法
    SAKURAのメールボックスで独自ドメインのメールを設定し、Gmail経由で送受信する方法
  • Expressで「Cannot set headers after they are sent to the client」と怒られた時の対処法
    Expressで「Cannot set headers after they are sent to the client」と怒られた時の対処法
  • AWS ECRとECSの入門(EC2編) ~ ECSのEC2版を使ってReactのDockerアプリケーションをAWS上で稼働させる方法 ~
    AWS ECRとECSの入門(EC2編) ~ ECSのEC2版を使ってReactのDockerアプリケーションをAWS上で稼働させる方法 ~
  • 爆速でJenkinsをマスターしよう(GitHubアカウント統合編) ~ JenkinsのGitHub Organizationの設定方法 ~
    爆速でJenkinsをマスターしよう(GitHubアカウント統合編) ~ JenkinsのGitHub Organizationの設定方法 ~
  • Amazon EC2インスタンスにSSHできなくなった時の対処法
    Amazon EC2インスタンスにSSHできなくなった時の対処法
  • バンクーバー留学豆知識:バンクーバーのATMで日本の銀行のキャッシュカードを使ってお得にお金を引き出す方法
    バンクーバー留学豆知識:バンクーバーのATMで日本の銀行のキャッシュカードを使ってお得にお金を引き出す方法
  • [tips][bat] バッチで明日の日付を計算する。
    [tips][bat] バッチで明日の日付を計算する。
  • Jupyter Notebookで「The kernel appears to have died. It will restart automatically.」というエラーが出た場合の原因と対処法
    Jupyter Notebookで「The kernel appears to have died. It will restart automatically.」というエラーが出た場合の原因と対処法
  • [tips][perl] Perlで文字コードをいい感じに処理する方法
    [tips][perl] Perlで文字コードをいい感じに処理する方法

Bitcoin寄付 / BTC Donation

Bitcoinを寄付しよう

BTC
Select Payment Method
Personal Info

Donation Total: BTC 0.0010

このブログの運営のためにBitcoinでの寄付を募集しています。お気持ち程度の寄付を頂けると管理者の励みになります。

Bitcoin寄付について知りたい方はこちらの記事へ

ビットコイン取引ならここ

  • ホーム
  • 技術 Tips & Tutorials
  • 技術塾
  • ライフハック
  • 海外留学
  • 英語学習
  • コラム
  • サイトマップ
  • タグ一覧
  • プライバシーポリシー
  • お問い合わせ

Copyright © 2023 KD - Casual Developers Notes