【本の感想】CSS&Sassの教科書

【本の感想】CSS&Sassの教科書

色々なサイトでおすすめされていたので買った「CSSの教科書」と、CSSが効率よく書けるということで買った「Sassの教科書」の感想です。

CSSの教科書

CSSは少し勉強すれば誰でも簡単に書けます。

しかしあまりにも簡単過ぎて構造が破綻しやすくなっています。

小規模サイトならまだしも大規模サイトになるとクラスやIDによる詳細度が複雑になり、!importantがあったりでメンテナンスが大変です。

そこでルールを作って管理、修正しやすくしようというのがこの本の内容です。

要素の構造通りにクラス名をつける(BEM)などの方法が載っています。

1度読んだだけではちょっと難しくて、何度か読み直しました。

冒頭に書かれている”壊れない完璧な設計を求めるのではなく、壊れた時に勇気を持って修復できる設計を”という言葉からCSS設計の難しさをとても感じました。

この後のSassと相性が良さそうなMindBEMdingが分かりやすかったです。

少し難しいですがある程度CSSを知った後におすすめな本です。

Sassの教科書

Sassって何?なんか難しそう、便利らしいけど学習コスト高そうだし……と敬遠していましたが、表紙の「現場で必須」という言葉に引かれて買いました(- -)

Sassは「CSSプリプロセッサ」と呼ばれるものの1つです。

Sass以外にも同じようなもの(例:Less、Stylus)があります。

ですがSassはCSSプリプロセッサの中でシェアが60%程で一番普及しているので、覚えていれば必ず役に立ちそうです。

というかCSSだけで書いてる人が10%程度で、あとは何かしらプリプロセッサを使っているのでやっぱり必須なんでしょうね。

内容は説明も丁寧で進行速度も丁度良く、割とスラスラ読めました。

1度知ったら戻れないと最初の方に書いてありましたが、本当にコードが見やすくてびっくりしました。

ネストから始まりかゆいところに手が届くみたいな機能がいっぱいあります。

インストール作業にコマンドプロンプトを使うので面倒そうで躊躇っちゃいますが、本の通りに進めればいいし1度インストールすればOKなので、CSSを書き慣れてきて、もっと見やすく書きたいと感じたらおすすめの本です。

P.50ページの「gulp sass」コマンドについて

ただ、本の通りに進めるとP.50で出てくる「gulp sass」を入力するところでエラーが出て進めなくなります。

調べてみたところ、「gulp(ガルプ)」のバージョンの違いが原因らしいです。

下記のページを参考に「node.js」と「gulp」をインストールすればOKでした。

鹿野 壮氏の記事「絶対つまずかないGulp 4入門(2019年版)」

こちらをコピペ検索してください。

インストールさえ終われば、あとはSassを楽しむだけです!

おまけ

このシリーズの本の色、目立つから探しやすい。

広告