GitLab CI/CDで、デプロイする環境を構築してみた

シナプスの技術部システム開発課の蔵坪と申します。

CI/CDを初めて触る方向けに、GitLabのリポジトリに保存したMarkdownのドキュメントをMkDocsを使ってビルドし、公開サーバにアップする環境の構築手順を、社内勉強会で発表いたしましたので、そちらについて書きたいと思います。

どちらかというと、MkDocsでドキュメントの構築のお話ではなく、GitLab CI/CDの仕組みの話がメインになります。

GitLab CI/CDとは

CI (継続的インテグレーション)

継続的インテグレーションは、GitLabにプッシュするたびに、パイプラインを実行して、コードの変更をビルド、テスト、検証してから、メインブランチにマージします。

CD(継続的デリバリーとデプロイ)

継続的デリバリーとデプロイは、リポジトリのデフォルトブランチにプッシュするたびにアプリケーションを本番環境にデプロイします。

docs.gitlab.com

MkDocsとは

MkDocsは、プロジェクトドキュメントの作成を目的とした、高速でシンプルな静的サイトジェネレーターです。

www.mkdocs.org

フォルダ・ファイル構成

以下の構成になります。docsフォルダ配下には、Markdownのドキュメントを保存しています。

/root/
│  .gitlab-ci.yml        CIファイル
│  mkdocs.yml            mkdocsの定義ファイル
│  
├─docker                
│      Dockerfile        Dockerファイル
│      
├─docs                   ドキュメントフォルダ(Markdown)
│      
└─public                 ドキュメントの出力フォルダ(HTML)

デプロイまでの流れ

以下が、Dockerファイルが更新された時と、Markdownドキュメントが更新された時のフローになります。

f:id:mkuratsubo:20210728174426p:plain — CI

WWWサーバにデプロイするための設定

今回、WWWサーバへのデプロイは、rsyncを利用しました。rsyncは、SSH公開鍵認証で接続しますので、事前に鍵ペアを作成し、秘密鍵をGitLabサーバ（設定 > CI/CD > 変数）に登録しておく必要があります。

f:id:mkuratsubo:20210719174212p:plain — CI/CD設定

公開鍵は、デプロイするサーバの.ssh/authorized_keysに登録します。

.gitlab-ci.yml

今回は、ステージをシンプルのするため、buildステージの中で、buildとrsyncによるデプロイを実施していますが、本来はステージを分けべきだと思います。

image: $CI_REGISTRY_IMAGE:$CI_COMMIT_REF_NAME

stages:
  - docker-build
  - deploy

deploy:mkdocs:
  stage: deploy
  before_script:
  - chmod 0400 "$ID_RSA_DEPLOY"
  - eval $(ssh-agent -s)
  - ssh-add "$ID_RSA_DEPLOY"
  - mkdir -p ~/.ssh
  - chmod 700 ~/.ssh
  - ssh-keyscan -p22 -H $wwwホスト > ~/.ssh/known_hosts
  script:
  - mkdocs build --quiet --site-dir public
  - rsync -crlpzh -e ssh ./public/ $wwwユーザ@$wwwホスト:$ディレクトリ
  tags:
  - docker-runner
  only:
    changes:
      - docs/**/*
      - .gitlab-ci.yml
      - mkdocs.yml

push:docker:
  stage: docker-build
  image: docker:dind
  variables:
    IMAGE_TAG: $CI_REGISTRY_IMAGE:$CI_COMMIT_REF_NAME
  before_script:
    - docker login -u $CI_REGISTRY_USER -p $CI_REGISTRY_PASSWORD $CI_REGISTRY
  script:
    - cd docker
    - docker build -t $IMAGE_TAG .
    - docker push $IMAGE_TAG
  tags:
    - docker-host-shell   
  only:
    changes:
      - docker/**/*

Dockerfile

openssh関連は、rsyncで利用しています。pip関連のライブラリは、mkdocsの拡張ライブラリです。

FROM python:alpine

RUN apk add build-base
RUN apk add rsync
RUN apk add openssh
RUN apk add openssh-client
RUN apk add git

RUN pip install --upgrade pip \
  && pip install mkdocs \
  && pip install mkdocs-material \
  && pip install pymdown-extensions \
  && pip install pygments \
  && pip install mkdocs-autolinks-plugin \
  && pip install plantuml-markdown \
  && pip install mkdocs-git-revision-date-plugin \
  && pip install mkdocs-git-authors-plugin

WORKDIR /root
CMD ["mkdocs", "serve", "-a", "0.0.0.0:8000"]

mkdocs.yml

mkdocs.ymlになります。

site_name: シナプス 技術部 システム開発課
repo_url: https://XXXXXXX/-/ide/project/system/system-document
# GitLabのWeb IDE
edit_uri: edit/master/-/docs
site_url: http://XXXXXXX/
repo_name : GitLab
theme:
  name: 'material'
  language: 'ja'
  features:
    - navigation.instant
    - navigation.tabs
    - navigation.tabs.sticky
    - navigation.top
    - navigation.indexes
    - navigation.tracking
extra:
  search:
    language: 'jp'
extra_css:
  - stylesheets/extra.css
  - "https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css"
  - "//fonts.googleapis.com/earlyaccess/notosansjp.css"
  - "//fonts.googleapis.com/css?family=Open+Sans:600,800"  
markdown_extensions:
  - pymdownx.superfences
  - pymdownx.details
  - pymdownx.tabbed
  - pymdownx.tasklist
  - pymdownx.tilde
  - pymdownx.mark
  - pymdownx.emoji:
      emoji_index: !!python/name:materialx.emoji.twemoji
      emoji_generator: !!python/name:materialx.emoji.to_svg
  - admonition
  - attr_list
  - codehilite:
      linenums: true
      guess_lang: false
      use_pygments: false
      noclasses: true
  - footnotes
  - toc:
      permalink: true
      toc_depth: 3
  - plantuml_markdown:
      server: http://$プラントUMLサーバ
      format: svg
  - tables
  - attr_list
plugins:
  - search
  - autolinks
  - git-authors
  - git-revision-date

以上の設定で、docsフォルダ配下のMarkdownファイルが更新されると、自動的にCIが起動し、公開サーバにデプロイされます。

GitLabのCI/CD画面で、パイプラインの実行状況を確認できます。

さいごに

今回、はじめてGitLab CI/CDで本番サーバへのデプロイする環境を構築しました。SSHの公開鍵の設定等知らないことが多かったでしたが、ドキュメントがしっかりしていたので、ほとんど迷うことなく設定できました。

CIで何ができるか、まだまだ知らないことが多いですが、使いこなせるように、日頃から情報収集を意識しないといけないなと痛感しました。

シナプス技術者ブログ

シナプスの技術者公式ブログ。インターネットで、鹿児島の毎日を笑顔にします。