突然ですがみなさん、CSS楽しいですか？
最近、**「CSSはつらい」「CSSはうんち」**みたいな記事とかつぶやきとか多い気がします。
たしかにCSSのよくない部分もあったりしますが、僕はCSSが好きなのでできるだけ楽しくCSSを書きたいなーと思っています。
そこで、今回はCSSを楽しく書くためのポイントをまとめました。
AltCSS使う
まあこのご時世、CSS直接書いてる人なんていないと思いますけど。AltCSS使いたいですよね。
PostCSSでもSassでも良いと思います。僕はStylusが好きです。
stylusの悪いところはドキュメントが不親切なところですね。
エラーでハマってGitHubのissueを読み漁ることもしばしば…
自動化する
楽しく書くためには余計なことには気を使わないのが一番です。
プロパティの順番とかprefixとかは自動化しちゃいましょう。
CSScomb
プロパティの順番をいい感じにしてくれるツール
Autoprefixer
Web版もある
Lintツールを使う
Lintのルールに沿ってコーディングするだけで体裁の整ったCSSが書けるようになります。書きながらコードをチェックするのはとても大変なので、ツールに任せてしまうのが良いですね。
やはり適度にルールがあったほうが良いコードが書けます。
小さく作ってみる
僕はウェブサイトのCSSを書くときも、ボタンとかフォームとかの共通で小さいパーツからスタイルを考えるようにしています。
コンポーネント指向を意識しているというのもありますが、ページを上から実装していくとmarginのもたせ方とかが場当たり的になってしまって、後から書き直すことが多かったというのもあります。
パーツから全体へ視点を広げていくことで、無理のないCSSを書くことができると思います。
コードを公開する
これよくできたな！って思ったらコードを公開してみるのもいいと思います。
個人的にはCodePenが好きです。
コードを公開することでフィードバックがもらえたり、新しい発見があったりしますしね。
良いことばかり！