ステップバイステップチュートリアル

10. デプロイメント

この最後のステップでは、サイトを本番環境の準備をします。

Gemfile

サイトにGemfileを用意しておくことをお勧めします。これにより、Jekyllやその他のgemのバージョンが、異なる環境間で一貫性を保ちます。

ルートにGemfileを作成します。ファイル名は「Gemfile」で、拡張子は付けないでください。Bundlerを使ってGemfileを作成し、jekyll gemを追加できます。

bundle init
bundle add jekyll

ファイルは次のようになります。

# frozen_string_literal: true
source "https://rubygems.org"

gem "jekyll"

Bundlerはgemをインストールし、Gemfile.lockを作成します。これは、今後のbundle installのために現在のgemバージョンをロックします。gemのバージョンを更新したい場合は、bundle updateを実行できます。

Gemfileを使用する場合は、jekyll serveのようなコマンドの前にbundle execを付けます。したがって、完全なコマンドは次のようになります。

bundle exec jekyll serve

これにより、Ruby環境はGemfileに設定されているgemのみを使用するように制限されます。

注：GitHub Pagesでサイトを公開する場合は、Gemfileでjekyllの代わりにgithub-pages gemを使用することで、Jekyllの本番環境バージョンと一致させることができます。このシナリオでは、GitHub PagesはGemfile.lockを無視するため、リポジトリからGemfile.lockを除外することも検討してください。

プラグイン

Jekyllプラグインを使用すると、サイト固有のカスタム生成コンテンツを作成できます。多くのプラグインが利用可能で、自分で作成することもできます。

ほぼすべてのJekyllサイトで役立つ公式プラグインが3つあります。

jekyll-sitemap - 検索エンジンがコンテンツをインデックス付けするのに役立つサイトマップファイルを作成します。
jekyll-feed - 投稿のRSSフィードを作成します。
jekyll-seo-tag - SEOに役立つメタタグを追加します。

これらを使用するには、まず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は設定が不要で、ビルド時にサイトマップを作成します。

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サーバーを再起動し、これらのタグが<head>に追加されていることを確認します。

環境

本番環境では出力するが、開発環境では出力しないものを出力したい場合があります。分析スクリプトが最も一般的な例です。

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

JEKYLL_ENV=production bundle exec jekyll build

デフォルトではJEKYLL_ENVはdevelopmentです。JEKYLL_ENVは、jekyll.environmentを使用してLiquidで使用できます。そのため、本番環境でのみ分析スクリプトを出力するには、次のようにします。

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

デプロイメント

最後のステップは、サイトを本番サーバーに配置することです。これを行う最も基本的な方法は、本番ビルドを実行することです。

JEKYLL_ENV=production bundle exec jekyll build

そして、_siteの内容をサーバーにコピーします。

サイトのビルド時に、出力先のフォルダはクリーンアップされます。

サイトのビルドプロセスで作成されないファイルやフォルダは、デフォルトで_siteの内容が自動的に削除されます。

keep_files設定ディレクティブで指定することで、一部のファイルを保持できます。アセットディレクトリにファイルを残しておくことで、他のファイルを保持することもできます。

CIまたはサードパーティを使用して、このプロセスを自動化する方法がより良いでしょう。

まとめ

これで、このステップバイステップチュートリアルの終わり、そしてあなたのJekyllの旅の始まりです！

コミュニティフォーラムに挨拶に来てください。
貢献して、Jekyllをより良くしましょう。
Jekyllサイトの構築を続けてください！

戻る