読者です 読者をやめる 読者になる 読者になる

はてなダイアリーのCSSを書くのにべんりそうなモックサーバ、Hatedをつくった

僕はCSSを書く上で、見通しのよい構造 (HTML) のアウトラインが不可欠だと考えていて、加えてSassみたいなアプローチが利用できるとなおよいと考えています。

HTMLをアウトラインを見るのにいろいろべんりなツールはあるでしょうが、しかし僕はなんかかんだでエディタ (Vim) の中が過ごしやすい環境となっているので、エディタのウィンドウを分割してCSSとHTMLを同時に開きながら編集する、というのがここ最近のワークスタイルでした。

しかし、HTMLそれ自体はアウトラインの確認に適しているhuman-readableなフォーマットとは言いがたいです。また、HTMLの各要素ごとのスタイルを確認するのにダミーテキストも入れておきたいところですが、よりアウトラインの確認をしづらいのが難儀なところです。

モデルとビューに分離できたらよさそう、HamlとかSlimとかあるし、Sassとかをかってに変換してくれたらなおよさそうだな、とおもったのでそういうのをまとめて面倒みてくれるモック・アプリケーションです (Padrinoで書きました)。

READMEにあるようにbundle installしてbundle exec padrino startしたら動きます、たぶん。あとはSassで書かれたファイルをapp/stylesheetsへ、CSSで書かれたファイルをpublic/stylesheetsに配置して、app/views/**/*.slimを見ながらガンガンカスろう!!

ちなみにシードデータは用意してないので現状では、bundle exec padrino consoleからぽちぽち叩くかんじになっていて何がモデルとビューの分離だ、ってかんじになってますがそのうち気の利いたシードデータとインポート/エクスポートについてダイアリーを書きます。(dm-yaml-adapterを使いましたが、こういう用途にいいかんじにハマります)