シカクいブログ

あるプログラマーの随筆

cssはゴミなので捨てるべし

以前、こんな記事を書いた。

sijiaoh.com

上記の記事のcssとjsに対する批判は明らかに合っているが、一方でtailwindcssの使い方に関する記述は明らかに間違いであった。 この記事でその間違いを認め、正しい道を示したい。

cssの問題はその存在そのものであり、それはいかなる工夫(BEMなどの涙ぐましい努力を含む)でも覆せない、致命的な物である。 よって、我々はcssを使うべきではない。

では何を使うべきか? それはtailwindcssである。

ご存知の通り、tailwindcssはcssフレームワークの一つである。 それを使うことは、すなわちcssを使用しているということであり、先述の「我々はcssを使うべきではない」という言葉を、早くも覆してしまうことになる。

しかしそんなことはどうでもいい。 使うのだ。 しかしtailwindcssがcssだということは忘れて。

tailwindcssとはなんなのか。 それは誰がなんと言おうと、「class属性に書いたら、その要素のデザインが変わる、ただの文字列」である。 実際に裏でどんな仕組みで動いていようと、我々はそれに関心を持つべきではない。

大原則として、我々はcssを一行も書くべきではない。 しかし残念なことに、例外がないわけではない。 外部ライブラリによって生成されたDOMの外見を変えるには、cssを使うしかない場合もある。 しかしそれ以外の用途でcssを書くべき時は一つとしてない。

ここまで来れば、もうこれ以上書くべきことは正直ない。 cssの問題はその存在自体なのだから、それを取り除いた段階で、全ての問題は解決されたのだ。

我々はスタイリングができる魔法の文字列を手に入れた。 それをごく普通に使えば良い。

その場限りのスタイルはclass属性に直接書けば良いし、使いまわしたい場合は変数に入れれば良い。 もっとも、多くの場合、変数よりも、reactならコンポーネントrailsならパーシャルにするべきだろう。

スタイルの継承や上書きは文字列の結合で出来る。 後方にあるスタイルの方が優先されるわけなのだから、非常に簡単でシンプルだ。

.cssの仕組みを忘れて、自由に生きるのだ。

素のhtmlを書いてるから、変数などの仕組みが使えない? ご愁傷様。