書籍紹介

はじめに

Web制作者のためのSassの教科書カバー写真

本書は、2013年9月に発売した「Web制作者のためのSassの教科書」の改訂版です。

トレンドの移り変わりが激しいWeb業界において、本書で扱っているCSSプリプロセッサの「Sass(サス)」は安定した人気を保っており、もはやデファクトスタンダードといっても過言ではないほどに普及しています。
執筆当時は、Sassの人気が低迷してしまったり、開発が止まってしまうなどの心配もありましたが、こうして改訂版を出せる運びとなったのは非常にうれしい限りです。

初版発行から4年が経ち、著者の二人はその間もさまざまな案件で実際にSassを使ってきたことで、CSSを書く際にSassは必要不可欠だということをしっかりと再認識させられました。
時々、古いサイトのメンテナンスなど、素のCSSを書かなければいけないケースもありますが、比較的軽い作業でもCSSだと不便でSassに変換してしてしまうほどです。
そのくらい、SassはCSSをより便利で効率的に書くことができます。

本書では、HTML+CSSの基本的な知識は必須です。しかし、Sassに関してはまったく触れたことがない方も対象としていますので、Sassの単純な機能紹介だけではなく、Sassの概要から利用するための環境の整え方まで丁寧に解説しています。

また、改訂版発行にあたり全体的な見直しはもちろん、現在のフロントエンド開発に合わせるため、Ruby Sassから LibSassで環境を整えられるよう、第2章に関しては全面刷新しています。当然、新機能などの解説も第3章、第4章で追記していますし、Sassを使った実践的な内容の第5章に関しても大幅に刷新していますので、以前本書をお読み頂いた方でも満足できる一冊に仕上がっています。

最初のインストール作業は少し面倒ですが、一度Sassを使ってしまえばSassの魅力に取り憑かれ、今までのCSSには戻れなくなると思います。本書がきっかけでSassの使い方を覚え、もうCSSには戻れないカラダになっていただければ、著者としてそれ以上にうれしいことはありません。

2017年8月
平澤 隆 & 森田 壮

目次

  • 第1章 Sassのキホン
    • 1-1 まずはSassって何なのかを知ろう
    • 1-2 Sassを導入する前の疑問や不安
    • 1-3 何はともあれSassを触ってみよう
  • 第2章 Sassの利用環境を整えよう
    • 2-1 本書で使用する環境について
    • 2-2 Node.jsをインストールする
    • 2-3 黒い画面を使ってみよう
    • 2-4 セットアップ済みの環境をインストールする
    • 2-5 Sass をコンパイルする
    • 2-6 セットアップ済みの環境を作成する方法
    • 2-7 GUIコンパイラ(Prepros)でSassを使う
    • 2-8 DreamweaverでSassを使う
  • 第3章 これだけはマスターしたいSassの基本機能
    • 3-1 ルールのネスト(Nested Rules)
    • 3-2 親セレクタの参照&(アンパサンド)
    • 3-3 プロパティのネスト(Nested Properties)
    • 3-4 Sassで使えるコメント
    • 3-5 変数(Variables)
    • 3-6 演算
    • 3-7 Sassの@import
  • 第4章 高度な機能を覚えてSassを使いこなそう
    • 4-1 スタイルの継承ができるエクステンド(@extend)
    • 4-2 柔軟なスタイルの定義が可能なミックスイン(@mixin)
    • 4-3 ネストしているセレクタをルートに戻せる @at-root
    • 4-4 Sassのデータタイプについて
    • 4-5 制御構文で条件分岐や繰り返し処理を行う
    • 4-6 関数を使ってさまざまな処理を実行する
    • 4-7 自作関数を定義する@function
    • 4-8 テストやデバックで使える@debug、@warn、@error
    • 4-9 使いどころに合わせて補完(インターポレーション)してくれる#{}
    • 4-10 変数の振る舞いをコントロールする !default と !global
  • 第5章 現場で使える実践Sassテクニック
    • 5-1 管理/運用・設計で使えるテクニック
    • 5-2 レイアウト・パーツで使えるテクニック
    • 5-3 スマホ・マルチデバイス、ブラウザで使えるテクニック
    • 5-4 gulpのタスクを追加してもっと便利な環境にする
    • 5-5 PostCSSでSassをさらに便利にする
  • 第6章 もっとSassを便利にするフレームワークやツール
    • 6-1 Sassのフレームワーク紹介
    • 6-2 SassのGUIコンパイラ
  • 第7章 Sass全機能リファレンス
    • 7-1 Sassの基本と高度な機能
    • 7-2 Sassの関数一覧
    • 7-3 Sassの拡張
  • 付録
    • コマンド一覧
    • 用語集

本書の試し読み

著者が良い感じにピックアップした、本書の一部をPDFで読むことができます。

初版と改訂2版の違い

初版と改訂2版の違いをまとめたページを作成しました。
初版をお持ちの方で、改訂2版を購入するか迷っている方は違いを確認してご判断してください。