Warning: 2014-5-15 このページの情報は古くなっています。
jekyll-s3
のメンテが中止されて、新しくs3_website
となり使い勝手が変わっています。気が向いたらアップデートの記事を書きます。こちらの記事は参考程度としてくださいm(_ _)m
Jekyllで生成したウェブページをAmazon Web ServiceのS3上にデプロイしてホームページを作成してみました。これがものすごく簡単だった(かつ、管理がやりやすい)ので是非オススメしたいと思って記事を書きます。
尚、S3を使うことで多少のコストは発生しますが、Jekyllで作ったページをGitHub Pages
上にホスティングすれば完全無料のウェブページを公開することができます。(今回はアクセスが少ないのですが商用ページだったためS3を利用しました)
Jekyllとは
JekyllはWebページののジェネレータです。MarkdownやTextile,Liquidのようなよくある形式で静的なページをパブリッシュします。難しくないので利用方法公式ページを参照いただくと簡単に理解できると思います。
Jekyllへ移行のコツ
今回は、既存のウェブページからの移行でしたので、既存のコンテンツを傷つけないように作業をする必要がありました。まず、jekyllのディレクトリのトップに、_originalのディレクトリを作成しここに既存のコンテンツをすべて展開、git add _original
とgit commit
してリポジトリに格納します。Jekyllテンプレートを作成しながら、jekyll -d ./_original build
として、コンテンツを生成後git status
やgit diff
で差分を確認→修正を繰り返す。これで既存のコンテンツを変えてしまう事無くJekyll化することができました。
AWS S3の準備
AWSのマネージドコンソールにアクセスして、まだS3を使ったことがなければサインアップ。その後旧形式のアクセスキーを取得する必要があります。アクセスキーIDとシークレットアクセスキーはこの後使います。
AWS S3にパブリッシュ
jekyll-s3 というgemを利用します。Gemfileに以下のように書いて
source :rubygems
group :development do
gem "jekyll", "~> 1.1.2"
gem "jekyll-s3", "~> 3.2.0"
end
bundler
の実行をします
$ bundle
jekyll-s3
がインストールされるとjekyll-s3
というコマンドが実行できるようになるので、実行します
jekyll-s3
すると、_jekyll_s3.yml
が生成されるので、修正します。
s3_id: YOUR_AWS_S3_ACCESS_KEY_ID
s3_secret: YOUR_AWS_S3_SECRET_ACCESS_KEY
s3_bucket: your.blog.bucket.com
このYAMLはERBでパースされているので、ファイルに書きたくない人は環境変数にキーを入れて、以下のように書くこともできます。
s3_id: <%= ENV['AWS_S3_ACCESS_KEY_ID'] %>
s3_secret: <%= ENV['AWS_S3_SECRET_ACCESS_KEY'] %>
s3_bucket: your.blog.bucket.com
s3_endpoint: ap-northeast-1
もし、東京以外のS3のリージョンを使うなら、Regions and Endpointsから適切なリージョンを選んでs3_endpoint
に書いてください。
あとは、以下のコマンドで、S3をセットアップします。バケツも自動で作ってくれます。
configure-s3-website --config-file _jekyll_s3.yml
これで次のようなURLでウェブサイトが公開されるようになりますので、http://www.example.com.s3-website-ap-northeast-1.amazonaws.com
独自ドメインを使いたい場合は、このホスト名をCNAMEに設定します。設定方法は各DNSサービスのドキュメントを御覧ください。
www.example.com CNAME www.example.com.s3-website-ap-northeast-1.amazonaws.com
以降コンテンツの更新は
jekyll build
ローカルで確認したいときには
jekyll server
S3へのアップロードは
jekyll-s3
簡単ですね。