ビルド環境を整える

公開:2020-03-02 21:26
更新:2020-03-02 21:26
カテゴリ:Webサイトリニューアル,CSS,CMS

簡単なCMSを作るにあたり、ビルド&テストを行う環境構築を行っている。一応以下のものを使って作ろうと思っている。

UIのコンポーネント作りはriot.jsで

ここはメジャーなReactでと言いたいところだが、なぜか昔からriot.jsに惹かれており、これでUIパーツを作ろうと思っている。riot.jsは設計がHTMLとJSの範疇から飛び出してなく自然な感じがよいと思っている。これとEJS・bulmaを使って画面を作っていく。

UIのレイアウト・デザインはbulmaで

Bootstrapと言いたいところだが、bootstrapはjqueryが必要だしfatなライブラリなので避けることにした。bulmaは軽くてデザインも好みなので当面はこれでやろうと思っている。ひょっとしたらいちから作り直すかもしれないが。CSSグリッドも使ってみたいと思ってるので。。

CSSはpostcssでビルドする

bulma.cssをベース・ラインとして、追加のCSSはpostcssでビルドしようと思う。postcssにはpurgecssのプラグインがあるので、bulmaで使用しないセレクタをカットして容量を節約しようと思っている。purgecssを使えばfatなbootstrapもスリム化できるかなと思ったけど、jqueryは消せないのでやっぱりbulmaで行くことにする。

HTMLテンプレート・エンジンはEJS

riot.jsにはSSRの機能もあるのでEJSいらんかな?と思ったけどベースのHTMLは作る必要があるし、EJSだとファイル分割してヘッダ部分を共通化できたりするので使うことにした。

コンテンツの配信はkoa.jsで

expressはなんとなく終了感が強く、koa.jsのほうがまだ活発な気がするし、async/awaitへの対応具合がいい感じなので。

ビルド/バンドルはmakeで

上で使うシステムのバンドルやビルドはできるだけCLIで行って、ファイルの変更検知とビルドはmakeでベタに行おうと思っている。

その他

プリコンパイルやキャッシングは積極的に行おうかなと思っている。