Sassをはじめる前の基礎知識・インストール方法

Sassはスタイルシートをつくるためのプログラミング言語です。ファイルを分割できる・変数を使用できるなど大規模サイトを大人数で手がける際に効果的です。「Ruby」で実装されているためRubyの環境が必要です。

Sassとは

スタイルシートを効率よくつくるためのプログラミング言語。

Sassの特徴とメリット

特徴 メリット
ファイルを分割できる
  • レイヤー単位/役割単位などに分割して、大人数で作業を分担することができる
変数を使用できる
  • メンテナンス性が向上する(色・余白の変更など、一括置換ではできないことが可能)

インストールする方法(Mac)

ターミナルの起動

「アプリケーション」 > 「ユーティリティ」 > 「ターミナル」

Rubyのバージョン確認

ruby -v

インストールされているRubyのバージョンを確認する。MacにはRubyが標準で搭載されている。

ruby x.x.xxxx

と表示されればOK

Gemのアップデート

sudo gem update –system

Rubyのパッケージマネージャー「Gem」を最新の状態にする。

Latest version currently installed. Aborting.

と表示されれば、既に最新版がインストールされているのでOK

Sassのインストール

sudo gem install sass

Sassをインストールする。

Sassのバージョンを確認する。

sass -v

Sassのバージョンを確認する。

Sass x.x.xx (Selective Steve)

と表示されればOK

これでインストールは完了です。そんなに難しい作業じゃないんだけど、Unixをまったく知らないと、案外ドキドキの工程なんですよね。

Share

あわせて読みたい

Web制作者のためのSassの教科書
Sassの導入方法から基礎的な使い方、実践テクニックまで丁寧に紹介されています。

Back to Top