jsCafe に参加する機会があり、styledocco についてお話が聞けましたのでまとめます。HTML5 になり CSS の役割が多くなったことは言うまでもありません。膨大な CSS をどうやってメンテナンスするかが課題です。その回答がここにあります。
styledecoo とは?
styledecco についてはサイトを確認するのが良いです。このツールはサイトからの言葉を参考にすると、次のことをしてくれます。
〜 StyleDoccoはスタイルシートからの文書とスタイルガイドのドキュメントを生成します 〜
普段、CSS用の確認画面を別途作成していましたので使いたいと思います。
jsCafe では次のように説明されていました。
nodejs製のCSSスタイルガイド作成ユーティリティです。CSS ァイルやプリプロセッサ用ファイル(SASS, LESS, Stylus, などなど)に Markdown でドキュメントを埋め込むことができます。
- CSSファイルにコメントを残すことで再利用しやすい
- Compassは簡単に導入できる
- :hover や :focus などのスタイル確認が容易
- Markdown で書くだけなので追加・更新が楽
- JavaScript で UI を生成して言う場合の確認にも使える
というのが特徴です。
grunt プラグイン
grunt プラグインが存在していますので導入は容易です。
StyleDocco styleguide generator for grunt.
Universal CSS styleguide generator for grunt. Easily integrate Styledocco or KSS styleguide generation into your development workflow.
まとめ
作成した CSS の確認が大変だったのですが styledecco を利用することで作業効率が上がると考えています。特に下記事項については良いと考えています。