第1章 Sassのキホン

全体的な文書の見直しが主な変更点です。
大幅な変更は行っていませんが、Sass はかなり普及したよね。的な内容が追加されたりしてます。

第2章 Sassの利用環境を整えよう

現在のフロントエンド開発に合わせるため、全面刷新しました。
初版では Ruby Sass を使って利用環境を整えましたが、改訂2版では Node.js と LibSass(node-sass) を使った内容にしています。タスクランナーでは現在安定した人気のある、gulp を使って解説しています。GUIコンパイラに関しては、Koala から Prepros に変更し、Sass に正式対応した Dreamweaver CC 2017 の使用方法も追加しています。

比較して頂くと全然違うのがわかると思います！
gulp を使ったことが無いって方も、初めての gulp にちょうど良い内容になってるかと思います。

第3章 これだけはマスターしたいSassの基本機能

基本機能として紹介していた内容は、この3年で特に変化がなかったので大きな追加などは有りませんが、全体的な文書の見直しを行っています。
また、1ページ程度の追加になりますが、& を使った親セレクタの参照にこんな書き方も出来るよって内容が追加されたりしています。

第4章 高度な機能を覚えてSassを使いこなそう

新機能の追加と全体的な文書の見直しが主な変更点です。
@at-root の説明、Map型など追加されたデータタイプの対応、map-get() 関数や、selector-replace() 関数など追加された関数の紹介、@error や !global などに関して加筆しています。

第5章 現場で使える実践Sassテクニック

ちゃっかり章タイトルがコーディングからテクニックに変わってたりします。
今回、一番加筆、修正、削除が多く時間も掛かったのが本章です。IE対策など、現在では不要な内容をカットしたのと、前回は概念的な内容も有りましたがその辺りはごっそり削除し、新しいネタを追加しました。完全にSassの機能に絞った内容ではなく、gulp や PostCSS など、より現場に近い形の内容も追加しています。

ネタバレ感満載ですが、改訂2版での5章の構成は次のようになっています。

• 5-1 管理 / 運用・設計で使えるテクニック
  • ネストが深すぎると生じる問題を把握して、バランスを見ながら利用する
  • コラム：ネストは何階層までがよいか
  • CSSとは違うパーシャルによるSass ファイルの分割
  • サイトの基本設定を変数にして一元管理する
  • 複数人で制作する場合は、各自のSass ファイルを用意する
  • コメントを活用してソースをわかりやすくする
  • 大規模サイトで活用できる@import のネスト
  • SASS記法も使ってみよう
  • &（アンパサンド）を活用してBEM 的な設計を快適に
  • @keyframes をルールセット内に書いて関係性をわかりやすくする
  • エクステンドはスコープを決めて利用する
  • EditorConfig とstylelint でコーディングルールを統一する
  • stylelint でコードを解析しエラーを表示する
  • コラム：他の人を思いやってSass 設計をしよう
• 5-2 レイアウト・パーツで使えるテクニック
  • clearfix をミックスインで活用する
  • 変数を使って、サイドバーの幅を自動的に計算する
  • nullで簡単に条件分岐をしてレイアウトをする
  • calcとSass を組み合わせて四則演算を便利に使う
  • @forを使って余白調整用のclass を生成する
  • リストマーカー用の連番を使ったclass 名を作成する
  • 連番を使ったclass 名のゼロパディング（0 埋め）をする
  • 文字リンクカラーのミックスインを作る
  • 複数の値を@each でループし、ページによって背景を変更する
  • シンプルなグラデーションのミックスインを作る
  • Map型と @each を使ってSNS アイコンを管理する
  • 値が比較しづらい z-index をMap 型で一括管理する
  • @function を使ってpx 指定する感覚でフォントサイズをrem 指定する
  • ネストしたセレクタをselector-replace() を使って書き換える
  • selector-extend() を使い、親セレクタだけ変更して同一スタイルを適用させる
• 5-3 スマホ・マルチデバイス、ブラウザ対応で使えるテクニック
  • スマホサイトでよく見る、リストの矢印をミックスインで管理する
  • 埋め込み動画のアスペクト比計算にpercentage() を使って楽をする
  • メディアクエリ用のミックスインを作成して楽々レスポンシブ対応
  • マップのキーの有無を map-has-key() で判定してわかりやすいエラー表示にする
  • CSSハックをミックスインにして便利に使う
  • Retina ディスプレイなど、高解像度端末の対応を楽にする
• 5-4 gulp のタスクを追加してもっと便利な環境にする
  • globでパーシャルファイルを一括で読み込む
  • ソースマップでコンパイル前のソースの場所を知る
  • エラー時にWatch を停止させずに自動コンパイルを継続させる
  • エラーに気付きやすくするために通知を出す
• 5-5 PostCSS でSassをさらに便利にする
  • PostCSSとは
  • ベンダープレフィックスを自動付与する
  • 画像名だけで画像のパスやサイズを取得する
  • CSSプロパティの記述順を自動でソートする
  • バラバラになったメディアクエリをまとめてコード量を削減してスッキリさせる

初版の時とまったく同じ内容も残ってはいますが、内容自体の見直しもかなり行っています。

第6章 もっとSassを便利にするフレームワークやツール

6章も大きく変わりました。
できるだけ何事も無かったかのようにしてきましたが、元々は Compass の章だった6章は全ページカットされ、初版で7章になっていた内容が6章になりました。

Compass はSassの人気を盛り上げてくれたり、Compass が有ったからSassを選択した人も居たりするくらいSassの普及に貢献したフレームワークでしたが、昨今のユーザー数の減少により、残念ながら今後の開発が終了するアナウンスが流れたため、全ページカットとなりました。Compass カット分で400円お安くなった次第です。

Compass で使えたベンダープレフィックスの付与や、画像のサイズやパスの取得などの代替機能は、第5章「PostCSS でSassをさらに便利にする」にて解説しています。

初版の7章では、エディタの紹介なども有りましたが、現状Sassに対応していないエディタの方が少ないので、今更必要ないと判断し、フレームワークとGUIコンパイラを紹介する軽めの章になりました。

第7章 Sass全機能リファレンス

追加された関数もちゃんと載せたのが主な変更点です。
初版時点から比べるとかなりの関数が追加されてるので、便利になってたり「この関数って何に使うの？」とか思いながら書いていました。あまりにもマイナーな関数は調べても全然紹介されてなかったり、実例も浮かばなかったりと地味に苦労した章です。

...と言うわけで

人生で初めての改訂版を執筆しましたが、最初は「ちょっと今風に内容を変えれば大丈夫でしょ！？」くらいな甘い考えでスタートした改訂版でしたが、実際に動き出してみると思ってたより全然大変でした。その分、初版を購入していただいた方でも満足できる内容になったと思っています。

...と言うわけで、気になった方はぜひご購入下さい！
Amazon でポチれば（9月15日以降なら）すぐに届きますよ！