その後の経過
静的ブログジェネレータをぼちぼち作っていて、ようやく一通りの機能が実装できた。といっても完璧ではなく、今後もバグ修正・改善・改良は必要だが、ここまでの成果をログとして残しておくことにする。
ちなみにコードはレポジトリの以下のフォルダに格納している。
www/wwwmaker at master · sfpgmr/www
全体構成
全体の構成は以下の図を参照。
コンテンツマネジメントはgitをベースとしている。コンテンツの公開はVPSサーバー(ubuntu)上のnginxで行っている。 コンテンツの生成やgitの操作はnode.jsでコードを書いて実施する。 node.jsで書いたコードは2つのスクリプトに分かれている。
- build-blog.js
- webhook.js
build-blog.js
は、.mdファイルからコンテンツを生成し、githubレポジトリにpushする。生成するコンテンツは上図のとおりである。コンテンツを効率よく生成するためにentries.jsonというファイルを使用している。当初NeDBを使用していたが、不要だとわかりただのJSONファイルとなった。webhook.js
はWebサーバー上で常駐しており、githubレポジトリにpushされた時、webhookで更新通知を受け取り、Webサーバー上のコンテンツを更新する。さらにコンテンツをnginxのgzip_staticを使用できるようにgzip圧縮する。
.mdファイルについて
.mdファイルはmarkdown形式をベースとしているが、投稿日時などの属性を表現できるように独自拡張している。
- ファイルの1行目はタイトルを記述する。
2行目にはjsonデータで属性を記述する。jekyllの「YAML Front-matter 」に相当する。属性の内容はschema.orgのBlogPostingに準じている。
- datePublishedに
draft
と記述することで下書きとなる。 - 記述がMustな項目はない。ほとんどの属性はコンテンツ生成時に自動的に付与・更新される。意図的に内容を変更したい場合(例えば公開日時等)にのみ必要な属性を記載すればよい。
- datePublishedに
記事内容はjsonデータいかに空行を1行挟み、記述する。記事内容は、はてな記法風の独自タグ
[hoge:xxxx]
も使用できる。さらに「\TeX
」で囲むことによりTeX記法で数式を記述できる。TeX表示はMathJaxを使用し、SVGにレンダリングしている。
.mdファイルの記述例は以下の通りである。
# タイトル
<script type="application/json" id="sfblog">{
"blogPosting": {
"keywords": "Test",
"datePublished": "2017-08-06T02:34:08+09:00",// "draft"で下書き
"dateModified": "2017-08-08T20:34:25+09:00",
"url": "https://www.sfpgmr.net/blog/entry/2017/08/34ae7ebde29fcf4d79cf2742c693b596",
"description": "テスト投稿"
}
}</script>
## テストページ
これはテストページです。
### TeX表示
\TeX
\left(\left(a+b\right)^2-\left(c+d\right)^2\right)
\TeX
### 独自タグ(今のところ2種類)
#### adsense
[adsense:xxxxxx]
#### Amazon
[asin:xxxxxxxx]
TeX表示例
\TeX\left(\left(a+b\right)^2-\left(c+d\right)^2\right)\TeX
とまあここまで書いたが、詳細については何回かにわけて書かないと書ききれないな。。 全体の絵を描いただけでもういっぱいいっぱいだ。。
というわけで次回に続く。。