フォルダ構造

jekyllフォルダ構造

ここで説明するフォルダ構造はjekyllの基本的なフォルダ構造以外にも、私たちが使ってるテーマ(Clean Blog theme)のフォルダ構造も一緒に説明してます。私たちが使ってるテーマが気になる方は以前のブログ、テーマ設定を見てください。

基本フォルダ構造

jekyllのホームページに親切にも基本フォルダ構造の説明が詳しく書いています。
jekyllのホームページ: https://jekyllrb.com/docs/structure/
ここには基本フォルダ構造と私たちが使ってるフォルダ構造を説明します。

基本フォルダ構造

|-- _config.yml
|-- _data
|   |-- members.yml
|-- _drafts
|   |-- begin-with-the-crazy-ideas.md
|   |-- on-simplicity-in-technology.md
|-- _includes
|   |-- footer.html
|   |-- header.html
|-- _layouts
|   |-- default.html
|   |-- post.html
|-- _posts
|   |-- 2007-10-29-why-every-programmer-should-play-nethack.md
|   |-- 2009-04-26-barcamp-boston-4-roundup.md
|-- _sass
|   |-- _base.scss
|   |-- _layout.scss
|-- _site
|-- .jekyll-metadata
|-- index.html

ファイル/フォルダ	説明
_config.yml	jekyllブログを構成するための基本的な設定が書いています。詳細についてはjekyll設定を参考してください。
_data	データファイルを保存する場所です。 `.yml`, `.yaml`, `.json`, `.csv`または`.tsv`ファイルを保存すれば良いです。私たちはこのフォルダは使ってないんです。私たちもブログの下に表示するブログのリストをjsonタイプで保存して非同期でローディングするが、管理上の理由でjsonをここに保存してないんです。
_drafts	まだ、公開してないブログのポストを保存するフォルダです。私たちは実際、ブログのポスト作成とgithubへ公開するブログを別々管理してるので、このフォルダは使ってないんです。私たちがgithubをどうやって活用してるかはgithub連動で紹介します。
_includes	jekyllもpugのように共通コンポーネントを作って挿入する機能があります。(`{% include ファイル名 %}`)の機能を使う時、含まれるファイルを保存する場所です。(ex> footer.html / header.html) 私たちはページ単位の共通コンポーネントを`_includes`フォルダへ保存して、ブログのポスト単位の共通コンポーネントは`{% include_relative フォルダ/ファイル名 %}`を使ってブログのポストフォルダ下へフォルダをつくって管理してます。(ex> code.md / link.md)
_layouts	テンプレートファイルを保存するフォルダです。(ex> default.html / folder.html)
_posts	ブログのポストを保存する場所です。ファイル名を`YEAR-MONTH-DAY-title.md`で保存して管理します。私たちは多言語機能を使うのでこのフォルダ下へフォルダを作って管理します。多言語については多言語プラグインを参考してください。
_sass	デザインのためのsassファイルを保存するフォルダです。
_site	jekyllによってビルドされたファイルが保存されるフォルダです。私たちはこのフォルダをgithubへアップロードしてブログを作成しています。(参考: github連動)
.jekyll-metadata	jekyllが変更された内容だけビルドするため管理してるファイルです。 `.gitignore`へ追加することをおすすめします。
index.html	トップページに変換されるファイルです。
これ以外のファイル/フォルダ	上記に書いていないファイル、フォルダたちはビルドする時`_site`フォルダ下にコピペされます。ビルドする時、コピペされたくないファイル/フォルダは`_config.yml`のファイルの`exclude:`項目に記録します。(参考): jekyll設定)

上記に書いてる.html/.mdファイルはお互いに交換可能です。つまり、index.htmlをindex.mdでYEAR-MONTH-DAY-title.mdをYEAR-MONTH-DAY-title.htmlで作成出来ます。

私たちが使ってるフォルダ構造

私たちはプラグインを使って多言語、ページネーションなどを使ってます。そのため、フォルダ構造が基本フォルダ構造とちょっと違います。違うというよりは、管理のための構造を持ってます。

|-- _config.yml
|-- _includes
|   |-- footer.html
|   |-- header.html
|-- _layouts
|   |-- default.html
|   |-- post.html
|-- _posts
|   |-- jekyll
|   |   |-- 2018-09-10-directory-structure
|   |   |   |-- common
|   |   |   |-- 2018-09-10-index-en.md
|   |   |   |-- 2018-09-10-index-ja.md
|   |   |   |-- 2018-09-10-index-ko.md
|-- _sass
|   |-- _base.scss
|   |-- _layout.scss
|-- _site
|-- categories
|   |-- jekyll
|   |   |-- json
|   |   |   |-- index-en.md
|   |   |   |-- index-ja.md
|   |   |   |-- index-ko.md
|   |   |-- index-en.md
|   |   |-- index-ja.md
|   |   |-- index-ko.md
|-- contact
|   |-- index-en.md
|   |-- index-ja.md
|   |-- index-ko.md
|-- home
|   |-- index-en.md
|   |-- index-ja.md
|   |-- index-ko.md
|-- 404.md
|-- sitemap.xml

ファイル/フォルダ	説明
_config.yml	基本フォルダ構想と同じ
_includes	ページ単位の共通コンポーネントを`_includes`フォルダへ保存します。(ex> footer.html, head.html, navbar.htmlなど)
_layouts	私たちが使ってるテーマの基本テンプレートが保存されてます。私たちが使ってるテーマが気になる方は以前のブログ(テーマ設定)を見てください。
_posts	ポストフォルダは下にカテゴリー別フォルダを持ってます。カテゴリー別フォルダはポスト別フォルダを持ってます。ポスト別フォルダは多言語のためのファイルと多言語ファイル中で共通で使ってる部分を保存するフォルダで構成されてます。ソースコード、上記に表示してるフォルダ構造など多言語とは関係なく共通で活用できる部分を`common`フォルダへ保存してます。(参考: 多言語プラグイン)
_sass	基本フォルダ構想と同じ
_site	基本フォルダ構想と同じ
categories	ブログをカテゴリ別で管理するため、別のページを作りました。블로그를 카테고리별로 관리하기 위해 별도의 페이지를 제작했다. 初めには`_posts`フォルダで管理したけど、カテゴリーとして作成しページもブログのポストで認識される問題があって、現在は別のフォルダで管理してます。また、カテゴリーのフォルダ下へ`json`フォルダを作って今見てるページ下の`posts`リストを表示するためのjsonデータを作るページを保存してます。
contact	お問い合わせページの多言語を対応するためのページを保存してます。
home	トップページの多言語を対応するためのページを保存してます。
404.md	`404ページ`多言語の対応が出来なくって一つのファイルで管理してます。. jekyllは404エラーが発生したら、404ページを表示するがこのページは一つしか対応してくれません。(私たちが設定する方法を分からないかも)
sitemap.xml	Search Engineのためサイトマップを生成するファイルです。詳細についてはSEO対応を見てください。