Sassの教科書 改訂2版が刊行!大幅にパワーアップして、新機能や実務に役立つテクニックがいっぱい!
Post on:2017年9月29日
Sassの教科書が大幅に内容を強化し、改訂2版として刊行されました!
当ブログのビジターも多くの人が愛用したと思いますが、改定前のを持っている人も、もちろん持っていない人もSassをもっと使いこなしたい人にかなりオススメの一冊です。
Sassのインストールは初心者に分かるように優しく、よく使う基本的なテクニックは丁寧に、さらに高度なテクニックは詳しく、基本から実践までこの一冊で完璧に身につけることができます。
本書はSassが大好物な著者陣によって執筆された、愛に溢れた教科書です。さまざまなプロジェクトで培われたSassのノウハウが、惜しげもなく記されています。
Sassを使う人はもちろん、Sassってなんか敷居が高いと感じている人にも、明日から実務で使えるテクニックがしっかり学べます。
Kindle版は値段が少し安く、お得です。
本書は2013年9月に発売されたSassの教科書の改訂版です。この4年間でさらに充実したSassの使い方を著者自らによる経験を踏まえ、より実務で役立つテクニックが詳しく解説されたものとなっています。
初版からパワーアップした点は、第2章の利用環境を整えようではNode.jsのインストールからDreamweaverでの使用まで全面刷新され、第3,4章では新機能の解説、第5章にいたっては実践的なテクニックが大幅に加わりました。
紙面のキャプチャで、中身を少しだけご紹介。
前の版がある方は、かなりパワーアップされているので、驚くかもしれません。
Sassを使うと何ができるようになるのか。
- 記述の簡略化ができる。
- 専用のコメントが使える。
- 同じ値を使いまわすことができる。
- 一度使ったセレクタを使いまわせる。
- コードの再利用が可能。
- 1つのCSSファイルにまとめることができる。
- 条件分岐などのプログラム的な処理ができる。
- 関数でさまざまな処理を実行できる。
- CSSファイルを圧縮できる。
- 他にも魅力がたくさん。
Sassには、CSSをより便利にする機能がたくさん用意されています。指定したカラーを一度の指定で使いまわしたい、条件分岐をスタイルを適用したいなど、Web制作者なら何度も思ったことがあると思います。
本書ではSassを導入する前の素朴な疑問や不安から、インストールして利用環境を整える方法まで、初心者向けの解説もくわしく丁寧で、分かりやすいと思います。
最初に利用環境をつくるのが少し面倒かもしれません。しかし、一度インストールしてしまえば、あとは面倒なことはないので、ゆっくり確実に進めていきましょう。
DreamweaverもCC 2017でSassがサポートされ、CSSプリプロセッサのコンパイル機能が搭載されました。普段Dreamweaverを使用している人もすぐにSassを使用することができます。
第3章はここ3年の間でSassの基本機能に大きな変化がなかったため、前版と大きな違いはありません。Sass初心者の人はここまでをしっかり読んでから、次の章に進むのがよいでしょう。
第4章では、@at-root、Map型など追加されたデータタイプの対応、map-get()関数、selector-replace()関数など、新機能に加えて高度な機能についてです。
この第5章が一番濃い章となっています。実際の現場でつかうSassのテクニックが満載で、管理/運用・設計ですぐに役立つと思います。
変数を使ってサイドバーの幅を自動で計算したり、clearfixをすぐに利用できるようにしたり、ソーシャルのアイコンを簡単なコードで管理したり、remを使ってフォントサイズを指定したり、レイアウトやパーツで使えるテクニックも詳しく、具体的なコードで学べます。
スマホ対応、マルチデバイス対応、IEなどのブラウザ対応なども、Sassで管理すると非常に便利です。
最後にはSassの全機能リファレンスがまとめられており、知りたい機能をさっと調べることができます。
手にすぐ取れるところに置いておきたい一冊ですね。
Sassの教科書 改訂2版の目次
-
- Sassのキホン
- まずはSassって何なのかを知ろう
- Sassを導入する前の疑問や不安
- 何はともあれSassを触ってみよう
-
- Sassの利用環境を整えよう
- 本書で使用する環境について
- Node.jsをインストールする
- 黒い画面を使ってみよう
- セットアップ済みの環境をインストールする
- Sassをコンパイルする
- セットアップ済みの環境を作成する方法
- GUIコンパイラ(Prepros)でSassを使う
- DreamweaverでSassを使う
-
- これだけはマスターしたいSassの基本機能
- ルールのネスト(Nested Rules)
- 親セレクタの参照&(アンパサンド)
- プロパティのネスト(Nested Properties)
- Sassで使えるコメント
- 変数(Variables)
- 演算
- Sassの@import
-
- 高度な機能を覚えてSassを使いこなそう
- スタイルの継承ができるエクステンド(@extend)
- 柔軟なスタイルの定義が可能なミックスイン(@mixin)
- ネストしているセレクタをルートに戻せる@at-root
- Sassのデータタイプについて
- 制御構文で条件分岐や繰り返し処理を行う
- 関数を使ってさまざまな処理を実行する
- 自作関数を定義する@function
- テストやデバックで使える@debug、@warn、@error
- 使いどころに合わせて補完(インターポレーション)してくれる#{}
- 変数の振る舞いをコントロールする!defaultと!global
-
- 現場で使える実践Sassテクニック
- 管理/運用・設計で使えるテクニック
- レイアウト・パーツで使えるテクニック
- スマホ・マルチデバイス、ブラウザで使えるテクニック
- gulpのタスクを追加してもっと便利な環境にする
- PostCSSでSassをさらに便利にする
-
- もっとSassを便利にするフレームワークやツール
- Sassのフレームワーク紹介
- SassのGUIコンパイラ
-
- Sass全機能リファレンス
- Sassの基本と高度な機能
- Sassの関数一覧
- Sassの拡張
最後に、著者様からのメッセージ。
最初のインストール作業は少し面倒ですが、一度Sassを使ってしまえばSassの魅力に取り憑かれ、今までのCSSには戻れなくなると思います。本書がきっかけでSassの使い方を覚え、もうCSSには戻れないカラダになっていただければ、著者としてそれ以上にうれしいことはありません。
献本の御礼
最後に、献本いただいたインプレスの担当者さまに御礼申し上げます。
当サイトでは随時、献本を受け付けています。
お問い合わせは下記よりお願いいたします。
sponsors