Hugo + AsciidocでGitHub Pages上にブログを公開するまで その2

はじめに

前回の続きです．

前回はHugoの導入と静的サイトの生成方法まで書きました． 今回はHugoで生成した静的サイトをGitHub Actions [1] を使用してGitHub Pages [2] で公開する方法まで書きます．

構成

GitHub上に以下の2つのレポジトリを作成して運用しています．

  • Hugoのファイルを置く非公開レポジトリ (以下 blog-data)

  • Hugoで生成したファイルを置く公開用レポジトリ(以下 blog)

Hugo側を非公開にする理由も特にないのですが…​

設定方法

GitHub Actionsの設定

  1. GitHub上で blog-data を開き，
    Actions → set up a workflow yourself をクリックします．

    02

  2. 編集ページでワークフローファイルを記述します．

    04

    実際に使用しているワークフローファイルを載せます(説明は次節で)．

    name: deploy github pages

on:
  push:
    branches: 
      - master

jobs:
  build:
    runs-on: ubuntu-18.04
    steps:
      - uses: actions/checkout@v1
        with:
          submodules: true
      - uses: actions/setup-ruby@v1
        with:
          ruby-version: '2.6'
      - run: gem install asciidoctor
      - name: Setup Hugo
        uses: peaceiris/actions-hugo@v2
        with:
          hugo-version: '0.62.2'
          extended: true
      - name: Build
        run: hugo --minify

      - name: Deploy
        uses: peaceiris/actions-gh-pages@v3.0.2
        with:
          personal_token: ${{ secrets.PERSONAL_TOKEN }}
          external_repository: deankh/blog
          publish_branch: master
          publish_dir: ./public

アクセストークンの設定

GitHub Actions上から公開用レポジトリにpushするための認証にアクセストークンを使用します．

  1. GitHubのPersonal Access Tokensのページ から，Generate new token をクリックします．

  2. 今回はpublicレポジトリへのアクセス権があればいいのですが，面倒なのでrepoにチェックを入れてgeneate tokenをクリックします．

  3. 生成されたトークンをコピーします．

  4. GitHub上で blog-data の Settings → Secrets を開き，New repository secret をクリックします．

  5. Nameに PERSONAL_TOKEN と入力し，Valueに先程コピーしたトークンを貼り付けます．

    06
    ℹ
    		 トークンの名前は，ワークフロー内の以下の変数名と対応関係にあります．
    personal_token: ${{ secrets.PERSONAL_TOKEN }}

これで設定は完了です．

使用しているワークフローについて

以下のアクションを使用しています．

実際にGithub Pagesに公開されるまでの手順は以下の通りです．

  1. Hugoのファイルを blog-data の master ブランチにpushする．

  2. actions/checkout でレポジトリがチェックアウトされる．

  3. actions/setup-ruby でasciidoctorがインストールされる．

    run: gem install asciidoctor

  4. peaceiris/actions-hugo でHugoが実行され，静的サイト用のファイルが ./public 以下に生成される．

    run: hugo --minify

  5. peaceiris/actions-gh-pages で blog の master ブランチへpushが行われる．

    external_repository: deankh/blog
publish_branch: master
publish_dir: ./public

  6. GitHub Pagesに反映される．

おわりに

書き切るまでNヶ月…​

最近はお仕事の方でJenkinsおじさんになっていますが，Pipelineﾜｶﾗﾝ．

markup  blog