Sassとは
「Syntactically Awesome StyleSheet」の略で、CSSを効率的に記述できるように設計・開発されたRuby製のCSSメタ言語のこと
Sass公式
Sassの問題点
Sassに限らずですが、CUIでターミナルを開いてコマンドを打つのは初心者には結構大変です。
今回はそんなSassを簡単に使えるツールを紹介します。
SassをGUIに使えるツール
Prepros
Sassを「Process File」というボタンをクリックするだけで、CSSファイルを生成してくれる、
初心者にとってはとても嬉しい機能がついたテキストエディタ。
29ドルの課金をしないと広告が出てきますが、とりあえずは使ってみると良いでしょう。
SassMeister
画面左側にSassのコードを入力するだけで、右側にCSSのコードを書き出してくれるWebサービス。
アクセスしてすぐ使えるので、SassのコードをCSSだとどうなるか試したい時に役立ちます。
Codepen
CodepenではSassを使えますが、そのSassのコードをCSSコードで見たい時に、
「View Compiled CSS」というボタンをクリックするだけで、CSS表示してくれます。
Codepenはスニペットとしても使えるので、これを使わない手はないでしょう。
まとめ
今回紹介した以外にも、テキストエディタによっては拡張機能でSassを自動コンパイルしてくれるものも
あるので、調べてみても良いでしょう。
フロントエンドやWeb制作者を目指す人はSassを使える事は必須のスキルだったりするので、
最初はこうしたツールを使いながら少しづつ慣れていきましょう!