---
layout: post
title: Jekyll 3に対応した
categories: ruby css js
---
Jekyll 3がリリースされていたのでアップデートしたらビルドが失敗するようになり、直すついで色々いじくりまわしてみました。

## jekyll-paginateの引退と影響
[jekyll-paginate][jekyll-paginate]が引退を表明していて、それに驚いたと同時に自作プラグインで継承しているので困った。CategoryとArchiveのページはプラグインで出力している。しかしである。そもそも月1のペースで更新していく(気概でやってます)ので、ページ分けするほどの分量がないのだ。悲しいかなページ分け廃止しても問題なし。修正ついでにHTMLだけじゃなくjsonでカテゴリー別一覧、年別一覧を出力するようにして終了。

## 見た目
見た目バージョン3に。レイアウトはバージョン1のようにスタティックなサイドバーとコンテンツエリアに分けました。バージョンの違いがわかるのは私だけであろう。何のこっちゃである。このブログは「ただの文章である」というドクトリンを設定しているので、いずれのバージョンにおいても装飾は極力排除している。今回追加したロゴはsketchでパスをいじくりまわしているうちに完成。フォントは基本明朝、明朝が映えない環境ではゴシック体（メイリオ）に変更した。

## cssの設計
cssの設計は[rscss][rscss]を意識している。意識していると書いたのは掟破りをしているからである。いや、だいたい守っている。例えば「scssのネストは2レベルまでを推奨」は記述が冗長になっただけにしか感じなかった。「componentのclass名は二つの単語で表現」は命名規則に従うと`.logo`ではなく`.logo-area`、`.logo-box`、`.logo-frame`と適当な言葉を足した表現をしなければいけない。なんだそれ。そんなもん掟破りだ`.logo`で行くぞ。しかし、「component配下のelementは一つの単語で表現すること」にぶつかってしまうのであった。というわけで意識している。

試していないけど[csstyle][csstyle]で記述しても面白いかもしれない。rscssとcsstyleの規約は名称こそ違えど共通している。多分上手くはまると思うんだけどなー。

## 関連記事を出す
関連記事と言っても表示している記事と同じカテゴリ最新n件を表示しているだけ。ここで地味にReactを使っている。サーバーにあるjsonを取得して表示するだけ。関連記事の部分は検索エンジンにインデックスされる必要もないのでサーバーサイドレンダリングでカバーすることはやってない。というかS3でホスティングしているのでサーバーサイドレンダリングは出来ないのだ。

このブログ、サーバーサイドで何かやりたくなった時にどうするかが課題である。

[jekyll-paginate]: https://github.com/jekyll/jekyll-paginate
[rscss]: http://rscss.io/
[csstyle]: http://www.csstyle.io/