MkDocs 静的サイト CI/CD デプロイメントパイプライン(GitHub × CircleCI2.0 × Amazon S3)構築

10312 ワード
MkDocs GitHub CircleCI2.0 S3 AWS GitHub テキストリンク

はじめに

GitHub に MkDocs のドキュメントを push したタイミングで CircleCI2.0 が走り静的ドキュメントを生成(mkdocs build)、AWS S3 に公開するまでの CI/CD パイプラインを構築します。

静的サイトをデプロイする Amazon S3 バケットを準備

  1. S3 バケット作成

  2. S3 Web サイトホスティング関連の設定

  • プロパティタブ

    • Static website hosting
      • ON
      • インデックスドキュメントとエラードキュメントを設定

Amazon S3 に PUT する用の CircleCI IAM ユーザーを作成

  1. ポリシー作成
   {
     "Version": "2012-10-17",
     "Statement": [
       {
         "Effect": "Allow",
         "Action": ["s3:PutObject", "s3:DeleteObject", "s3:ListBucket"],
         "Resource": ["arn:aws:s3:::{S3バケット名}"]
       }
     ]
   }
  1. IAM CircleCI ユーザを追加、アクセスの種類：プログラムによるアクセス
  2. アクセスキーとシークレットアクセスキーをメモる
  3. ユーザーの ARN をメモる

Amazon S3 バケットに CircleCI ユーザのアクセス権限を付ける

  1. アクセス権限タブ
  • バケットポリシーを設定する
   {
     "Version": "2012-10-17",
     "Statement": [
       {
         "Effect": "Allow",
         "Principal": "*",
         "Action": "s3:*",
         "Resource": "arn:aws:s3:::{S3バケット名}/*",
         "Condition": {
           "IpAddress": {
             "aws:SourceIp": [
               "XXX.XXX.XXX.XXX/32" ← S3に対してアクセスできるIPを指定
             ]
           }
         }
       },
       {
         "Sid": "forCircleCi",
         "Effect": "Allow",
         "Principal": {
           "AWS": "arn:aws:iam::{メモった ユーザーのARN}"
         },
         "Action": ["s3:PutObject", "s3:ListBucket", "s3:DeleteObject"],
         "Resource": [
           "arn:aws:s3:::{S3バケット名}"
         ]
       }
     ]
   }

CircleCI 設定ファイル 準備

  1. .circleci/config.yml ファイル を作成する
version: 2
jobs:
  mkdocsbuild:
    docker:
      - image: circleci/python:3.7
    working_directory: ~/repo
    environment:
      - AWS_S3_BUCKET_NAME: { S3バケット名 }
    steps:
      - checkout
      - run:
          name: Install mkdocs
          command: sudo pip install mkdocs
      - run:
          name: mkdocs build
          command: sudo mkdocs build
      - run:
          name: Install awscli
          command: sudo pip install awscli
      - run:
          name: Deploy to S3
          command: aws s3 sync ~/repo/site s3://${AWS_S3_BUCKET_NAME}/ --exact-timestamps --delete # ← 削除ファイルも反映するように

workflows:
  version: 2
  mkdocs:
    jobs:
      - mkdocsbuild:
          filters: # ← masterブランチのみS3へUP
            branches:
              only:
                - master

CircleCI プロジェクト設定

  1. CircleCI dashboard へアクセス

  2. CircleCI AWS アクセスキーとシークレットアクセスキーを環境変数として追加する。

    アクセスキー ID を AWS_ACCESS_KEY_ID という変数、

    シークレットアクセスキーを AWS_SECRET_ACCESS_KEY という変数に格納

これで GitHub に push すれば CircleCI が走り、S3 で静的ドキュメントが公開される