名刺のデータ化システムを支えるCI基盤への取り組み/GEES and CircleCI

by Sansan

Slide 1

Slide 1 text

名刺のデータ化システムを⽀える CI基盤への取り組み

Slide 2

Slide 2 text

Sansan Builders Box Agenda - ⾃⼰紹介 - なぜ CI が必要なのか - GEES について - GEES が抱えていた問題 - CircleCI への移⾏⼿順 - CircleCI デバッグ⽅法 - まとめ

Slide 3

Slide 3 text

໦ా ༔Ұ࿠（Yuichiro Kida） ೥ ݄ ૣҴాେֶ ࣾձՊֶ෦ࣾձՊֶՊ ଔۀ ೥ ݄ גࣜձࣾ෋࢜௨ιʔγΞϧαΠΤϯεϥϘϥτϦೖࣾ جװۀ຿γεςϜͷઃܭɾ։ൃɾςετ ೥ ݄ גࣜձࣾδϯδϟʔΞοϓೖࣾ γεςϜ։ൃձࣾʹग़޲͠ɺ3VCZPO3BJMTͰͷ։ൃ ೥ ݄ 4BOTBOגࣜձࣾೖࣾ &JHIUࣄۀ෦ʹͯϝϯγϣϯػೳͷ։ൃ ೥ ݄ %40$ʹҟಈ (&&4ʢ໊ࢗσʔλԽγεςϜʣͷ։ൃɾӡ༻ ৽نϓϩμΫτ։ൃ DSOC Development Group エンジニア

Slide 4

Slide 4 text

なぜ CI が必要なのか

Slide 5

Slide 5 text

Sansan Builders Box Continuous Integration ʢܧଓతΠϯςάϨʔγϣϯʣ ⇓ ܧଓతʹࣗಈςετΛ࣮ߦ͢Δ͜ͱ CI とは

Slide 6

Slide 6 text

Sansan Builders Box ιϑτ΢ΣΞʹมߋΛՃ͑Δ౓ʹɺ ϦάϨογϣϯςετΛ ࣗಈͰߦ͏͜ͱ͕Ͱ͖Δ CI 導⼊のメリット

Slide 7

Slide 7 text

Sansan Builders Box リグレッションテストを⾃動で⾏うことで開発速度が向上する

Slide 8

Slide 8 text

Sansan Builders Box リグレッションテストを毎回⾏うことでソフトウェアのデグレを防ぐことができる

Slide 9

Slide 9 text

GEES について

Slide 10

Slide 10 text

Sansan Builders Box GEES とは - 名刺のデータ化システム - Sansan と Eight の名刺のデータ化を担う - ⽉に数千万枚の名刺をデータ化している

Slide 11

Slide 11 text

GEES が抱えていた問題

Slide 12

Slide 12 text

Sansan Builders Box Jenkins ⾟い問題 - EC2 で⾃前でホスティング > サーバーのメンテナンスコストがかかる - テストがランダムで落ちる > 並⾏でテストを実⾏しているから？

Slide 13

Slide 13 text

Sansan Builders Box Jenkins ⾟い問題 CI でテストを通すために時間が取られていた

Slide 14

Slide 14 text

Sansan Builders Box CircleCI のメリット - マネージドサービス > サーバーのメンテナンスが不要 - 実⾏環境がコンテナで独⽴ > 平⾏でテストをしても安定するはず

Slide 15

Slide 15 text

CircleCI への移⾏⼿順

Slide 16

Slide 16 text

Sansan Builders Box 前提条件 - 他の CI ツールを使っているが、CircleCI への移⾏を検討している - ⾃動テストは書いているが、CI ツールは使っていない ※ ⾃動テストを導⼊していない場合、まず初めに、できるところからテストを⾃動化していきましょう。

Slide 17

Slide 17 text

Sansan Builders Box CircleCI への移⾏⼿順 1. CircleCI へログインする > 移⾏したいリポジトリの権限がある GitHub アカウントが必要 2. CircleCI 上で設定する 3. リポジトリに設定ファイルを追加する

Slide 18

Slide 18 text

CircleCI 上での設定

Slide 19

Slide 19 text

Sansan Builders Box CircleCI へログインする

Slide 20

Slide 20 text

Sansan Builders Box Add Projects から Set Up Project をクリック

Slide 21

Slide 21 text

Sansan Builders Box ⾔語を選択し、Start Building をクリック

Slide 22

Slide 22 text

Sansan Builders Box Only build pull requests を On にする - デフォルトでは、PR を⽴てていないブランチも、 Push するたびにテストが⾛ってしまう - PR が出ているブランチに Push された時のみ、テストが⾛るように変更する

Slide 23

Slide 23 text

Sansan Builders Box Advanced Settings から Only build PRを On にする

Slide 24

Slide 24 text

Sansan Builders Box user key が必要な場合 - 通常は⾃動で追加される deploy key だけで⼤丈夫 - プライベートリポジトリのライブラリを使⽤している場合は、 user key が必要 > 必要なリポジトリの Read 権限のみを持った GitHub ユーザーを作ると良い > このユーザーで CircleCI にログインし、Add user key する

Slide 25

Slide 25 text

Sansan Builders Box Checkout SSH Keys から user key を追加する

Slide 26

Slide 26 text

設定ファイルの追加

Slide 27

Slide 27 text

Sansan Builders Box 設定ファイルの追加 - .circleci/config.yml をリポジトリに追加する - 中⾝は CircleCI のサンプルを参考にする > Ruby の場合 https://circleci.com/docs/2.0/language-ruby/ - プロジェクトに合わせて設定を調整 - PR を出して、CircleCI 上でテストが通れば OK - ビルドに失敗しても、エラーメッセージを⾒て⼀つずつ解決していく

Slide 28

Slide 28 text

GEES の設定例

Slide 29

Slide 29 text

Sansan Builders Box MySQL 5.6 を使⽤ - 公式の Database Configuration Examples を参考 - `- image: circleci/mysql:5.6`

Slide 30

Slide 30 text

Sansan Builders Box Redis を使⽤ - Redis のコンテナを追加する > `- image: circleci/redis:latest` - CircleCI 公式の Docker イメージは https://hub.docker.com/u/circleci/ から確認できる

Slide 31

Slide 31 text

Sansan Builders Box ブラウザテストに PhantomJS を使⽤ - legacy が付いた PhantomJS ⼊りのイメージを使う > `- image: circleci/ruby:2.5.1-node-browsers- legacy` - 早く Headless Chrome に移⾏しましょう！

Slide 32

Slide 32 text

CircleCI のデバッグ⼿法

Slide 33

Slide 33 text

ローカルで CircleCI を実⾏する

Slide 34

Slide 34 text

Sansan Builders Box ローカルで CircleCI を実⾏する - .circleci/config.yml を修正する度に Push して動作確認をするのは⼤変 - ローカルで確認してから、CircleCI 上で確認する - Web+DB PRESS vol.107 が参考になります

Slide 35

Slide 35 text

Sansan Builders Box Mac の場合 - インストール : `brew install --ignore-dependencies circleci` - Docker をインストールしていない場合 => `brew install circleci` - 設定ファイルのバリデーション : `circleci config validate` - ローカル実⾏ : ` circleci local execute `

Slide 36

Slide 36 text

スクリーンショットを取って確認する

Slide 37

Slide 37 text

Sansan Builders Box CircleCI 上でもスクリーンショットを取って確認できる - ブラウザテストが CircleCI 上でのみ落ちる場合 - CircleCI 画⾯の Artifacts タブからスクリーンショットを確認できる

Slide 38

Slide 38 text

Sansan Builders Box Capybara の場合 - `save_screenshot nil, full: true` でフルサイズのスクリーンショットを取得できる - 指定しない場合、スクリーンショットは `tmp/capybara/` に保存される

Slide 39

Slide 39 text

Sansan Builders Box スクリーンショットを Artifacts に保存する version: 2 jobs: build: parallelism: 3 docker: - image: circleci/ruby:2.5.1-node-browsers-legacy （略） steps: - checkout （略） - run: name: Run rspec in parallel command: | bundle exec rspec ＼ $(circleci tests glob "spec/**/*_spec.rb" | circleci tests split --split-by=timings) - store_artifacts: path: tmp/capybara/ .circleci/config/yml

Slide 40

Slide 40 text

Sansan Builders Box CircleCI 上の Aritifacts タブから確認できる

Slide 41

Slide 41 text

CircleCI のコンテナに SSH 接続する

Slide 42

Slide 42 text

Sansan Builders Box CircleCI のコンテナに SSH 接続する - ビルド画⾯右上の Rerun job with SSH をクリック - `ssh -p xxxxx xxx.xxx.xxx.xxx` と表⽰される

Slide 43

Slide 43 text

Sansan Builders Box CircleCI のコンテナに SSH 接続する - ターミナルから SSH 接続できる > GitHub に登録している秘密鍵を指定する $ ssh -p xxxxx xxx.xxx.xxx.xxx -i ~/.ssh/id_rsa_github

Slide 44

Slide 44 text

まとめ

Slide 45

Slide 45 text

Sansan Builders Box まとめ - CI によってデグレを防ぎ、開発速度を上げる - CircleCI 移⾏のコツ > 設定ファイルは公式サンプルを参考 > まずはローカルでビルドしてデバッグする > エラーは⼀つずつ潰してく > CircleCI 上のエラーは SSH 接続やスクリーンショットで確認する

Slide 46

Slide 46 text

No content