Utility-first CSS(Tailwind CSS)が合理的であることの説明と、CSSによるUI開発小史

SRANK

目次CSS小史SUIT CSS - 命名規約ベースのCSS方法論styled-components - CSS in JSTailwind CSS - Utility-first CSSまとめタイムライン参考リンクCSS小史CSSでアプリのUIを実装するための手法は、これまでいくかの変遷を辿ってきた。はるか昔、CSSが生まれて間もないころには、関心の分離という文脈から、FONT要素などの物理タグはよくないものとされ、 コンテンツ(HTML)とスタイル(CSS)をきっちりと分離することが奨励されはじめた。 そこでは、HTMLはあくまで文書であり、CSSのクラスセレクタという接点でコンテンツと見た目が隔離されることで、それらは別世界のものとして管理されていた。 また、大規模サービス開発においていかにCSSを管理するかという問題意識はまだなかった。時が経ち、HTMLは次第に複雑な対象を記述するようになった。モジュールやメンテナンス性といったことがCSSコーダーの関心時になると、 BEMに代表される「方法論」が発明され、発展してきた。 これは、カスケーディングというCSSの「欠点」を克服する努力であると共に、スタイルの再利用への道を開いた。そして、Reactのような、JavaScriptを使ってHTMLをUIコンポーネントのツリーとして記述…