このサイトの作られかた
このHPはNEONをつかって製作しています。
NEONの仕組み
NEONはマークダウンで書かれたファイルをすべてhtmlに変換したのち、単純にインデックスページを出力します。どういう風になっているのか気になる人はこのページのソースとなるマークダウン形式のファイル site.mdを開いてみてください。node.js上で動作します。
目指していることは、ロード時間を短縮するために、完全に静的なファイルでHPが構成されるようにするということです。オリジナルのHPはマークダウンで書かれているため、自動的にスタイルの一貫性が保たれるという利点があります。
NEONの利点
NEONは単純にhtmlに変換してメニューを作るだけのプログラムですが、起動中はファイルの変更をウォッチしますので、ローカルの変更があれば、コマンドを実行するような設定が出来るようになっています。つまり、ディレクトリを監視して自動ビルド・アップロードが出来ます。
それによって、単純にローカルファイルを編集して保存するだけで自動でリモートのサーバーへアップロードするような環境が作れます。実際にこのサイトのsite.jsonを参照していただければ、どういう風になっているか見えます。.shで始まるファイルがアップロード処理を担当しています。
今後の予定
このサイトで必要になったらそのつど機能を増やしていくつもりです。
現在のところ
-
画像のリサイズ機能（部分的に完了）
-
HTML5への対応（部分的に完了）
-
HTML/JS/CSSのminify（完了）
-
CSSの遅延ロード、HTMLへの埋め込み（完了）
-
新しい画像フォーマット（WebP）への対応（webpがあまり普及していないため保留中）
-
画像を簡単に貼れるようにする（検討中）
-
モジュール化（予定）
がつきました。
作者
万城 秀人