Step by Step チュートリアル

10. Deployment

この最後のステップでは、サイトの公開準備をします。

Gemfile

サイトのGemfileを用意することは、よい経験になります。これにより、Jekyllや他のgemのバージョンが異なる環境でも、一貫していることが保証されます。

rootに以下のGemfileを作ります。

source 'https://rubygems.org'

gem 'jekyll'

ターミナルでbundle installを実行します。これでgemをインストールし、後々bundle install時に現在のgemのバージョンをロックしておくためのGemfile.lockを作成します。gemのバージョンを更新したいときは、bundle updateを実行してください。

Gemfileを使用すると、jekyll serveの様なコマンドはbundle execを前につけて実行します。ですので、フルコマンドは次のようになります。

bundle exec jekyll serve

これは、Gemfileで設定されたgemだけを使用するようにRuby環境を制限します。

プラグイン

Jekyllプラグインは、サイトに固有のカスタムコンテンツを生成することができます。沢山の利用可能なpluginsがありますし、自分自身で作ることもできます。

多くのJekyllサイトで便利な公式のプラグイン3つを紹介します。

jekyll-sitemap - 検索エンジンがコンテンツをインデックスに加えるのを助けるsitemapを作成します。
jekyll-feed - ポストのRSSフィードを作成します。
jekyll-seo-tag {:target=”_blank”}- SEO用のmetaタグを追加します。

これらを使用するには、まずGemfileに追記します。jekyll_pluginsに配置すれば、自動でJekyllに要求されます。

source 'https://rubygems.org'

gem 'jekyll'

group :jekyll_plugins do
  gem 'jekyll-sitemap'
  gem 'jekyll-feed'
  gem 'jekyll-seo-tag'
end

次に以下の行を_config.ymlに追加します。

plugins:
  - jekyll-feed
  - jekyll-sitemap
  - jekyll-seo-tag

では、bundle updateを実行して、これらをインストールしましょう。

jekyll-sitemapはこれ以上のステップを必要とせず、構築時にsitemapを作成します。

jekyll-feedとjekyll-seo-tagは_layouts/default.htmlにタグの追加が必要です。

<!doctype html>
<html>
  <head>
    <meta charset="utf-8">
    <title>{{ page.title }}</title>
    <link rel="stylesheet" href="/assets/css/styles.css">
    {% feed_meta %}
    {% seo %}
  </head>
  <body>
    {% include navigation.html %}
    {{ content }}
  </body>
</html>

Jekyll serverを再起動して、これらのタグが<head>に追加されていることを確認しましょう。

Environments（環境）

作品に出力したいけれど、まだデプロイにないものに出会うこともあるでしょう。例としては、Analyticsスクリプトです。

これを行うには、environmentsを使用します。JEKYLL_ENV変数を使用して、コマンド実行時に環境を設定します。例えば、

JEKYLL_ENV=production bundle exec jekyll build

デフォルトではJEKYLL_ENVはデプロイです。JEKYLL_ENVはjekyll.environmentでLiquidで使用できます。

{% if jekyll.environment == "production" %}
  <script src="my-analytics-script.js"></script>
{% endif %}

デプロイ

最後のステップではsiteをサーバーに上げます。最も基本的な方法は、production buildを実行することです。

JEKYLL_ENV=production bundle exec jekyll build

そして、_siteのコンテンツをサーバーにコピーします。

更によい方法は、このプロセスをCIや3rd partyの利用による自動化です。

最後に

これで、このstep-by-stepちょーとリアルはお終いです。ですが、あなたのJekyllの旅は始まったばかりです！

community forumsに行き挨拶しましょう。
貢献でJekyllをより良くするのを手伝ってください。
Jekyllサイトを作り続けてください。

Back