Hack Your Design!

Jekyllでgit pushをフックしてGithub Pagesへ自動デプロイするようにした

(image)Jekyllでgit pushをフックしてGithub Pagesへ自動デプロイするようにした

本ブログはJekyllを使って構築しているのですがgit pushしたときにTravisCIと連携してTravis上でビルドしてGithub Pageへとデプロイするように変更してみました。作業にあたっては下記ブログを参考にさせていただきました。

OctopressとTravis CIを連携させてBlog生成を自動にする

上手順において2点、注意点があります。

  • brew install travisでtravisコマンドはインストールできなくなっているっぽいのでgem install travisで対応すること。
  • 上記では公開鍵暗号方式を使っているが、OAuth Access Tokensを使ったほうが手間がかからなくて楽です。

ということで公開鍵暗号方式ではなくOAuth Tokenを使うようにします。その場合は下記が参考になります。

Middleman で作った web サイトを Travis + GitHub pages でお手軽に運用する

デプロイまでの流れ

デプロイまでの流れとしてはこんな感じです。

  1. githubにエントリをpushする
  2. pushをフックしてTravisCI起動(事前にService HooksでTravisと連携するように設定してある)
  3. Travis上でスタティックサイトをビルド
  4. TravisからgithubへとToken通してpushする

結果的に作成した.travis.yml,Rakefileはこんな感じです。

.travis.yml

sudo: false
language: ruby
cache: bundler
rvm:
  - 2.6.3

before_install:
  - gem install bundler
before_script:
  - rake setup
script:
  - bundle exec jekyll build
after_success:
  - ./deploy.bash

env:
  global:
    - secure: "Gfz3Y4s2..."
    - GIT_COMMITTER_NAME="Toshimaru via TravisCI"
    - GIT_COMMITTER_EMAIL="me@toshimaru.net"
    - GIT_AUTHOR_NAME="Toshimaru via TravisCI"
    - GIT_AUTHOR_EMAIL="me@toshimaru.net"

Rakefile

REPOSITORY =
  if ENV['GH_TOKEN']
    'https://$GH_TOKEN@github.com/toshimaru/blog.toshimaru.net.git'
  else
    'git@github.com:toshimaru/blog.toshimaru.net.git'
  end

define_method(:build_jekyll_pages) { sh 'bundle exec jekyll build' }
define_method(:cleanup_deploy_dir) { sh 'rm -rf _deploy/*' }
define_method(:put_pages_into_deploy_dir) { sh 'cp -R _site/* _deploy' }

desc 'Clone blog repository to _deploy directory and checkout gh-pages branch'
task :setup do
  sh 'rm -rf  _deploy'
  sh "git clone #{REPOSITORY} _deploy"
  cd('_deploy') { sh 'git checkout gh-pages' }
end

desc 'deploy static pages to gh-pages automatically via Travis-CI'
task :autodeploy do
  build_jekyll_pages
  cleanup_deploy_dir
  put_pages_into_deploy_dir
  cd '_deploy' do
    sh 'git add -A'
    sh 'git commit -m "Update via Travis"'
    sh "git push --quiet #{REPOSITORY} gh-pages 2> /dev/null"
  end
end

このように設定しておけばGitHub上のエディタだったりprose.ioみたいなサービス使ってWEB上でも記事を投稿できてグッドですね(実際はローカル上のエディタでの編集が慣れているのでWEB編集画面は使わないけど…)。

  • このエントリーをはてなブックマークに追加