Sassをwebサービス上で使ってみよう

Sassをwebサービス上で使ってみよう

Sassを目下勉強中です。

ローカルに環境をセットする前に、Sassってどんな風に書くのか、どんな働きをするのか簡単に体験できるSassのWEBサービスをご紹介します。

黒い画面が苦手な女子にも簡単に使えますよ。

Sassmeister

sassmeister

なんて読むのかなぁ。サスマイスターかな。

リアルタイムにSassをCSSに変換してくれて便利です。

http://sassmeister.com/

初期のお試しには最高です。機能が単純で使いやすい。

詳しい説明とかあまりなく、英語なんですが、そんなに問題じゃないです。

左側の「SCSS」のスペースにSassで記述をすると、右側にCSSを自動で吐き出してくれます。

HTMLも記述することができるので、実際のブラウザ表示も確認することができます。

Githubに接続すれば保存もできるのかな?

行間も見やすいし、閉じタグも自動で書いてくれる。いいね。

あと、やっぱりさ、見た目?ピンクとか、かわいいよね。女子ウケ的だよね。

jsdo.it

jsdoit

こちらもWEBサービス上でSassを書いて実行できます。

http://jsdo.it/

日本語なので入りやすいかと思います。

こちらはログインが必要ですが、高機能です。Sass以外にもjavascriptとかも試せるようです。

コードも保存してくれるので、がっつり書きたい時に便利かも。

というか、このサービス自体がコードをシェアするような感じでもあるので、私のなんてことないひどいコードも誰かに見られるということになります。

SassからCSSへの変換が自動ではないので、リロードして確認します。

あとSassとCSSの表示も切り替えてないといけないので両方を見比べてコードを比較したい方には向いてません。

でさ、ま、ちょっとメンズライクというか、プログラミング的な雰囲気ですよね。

 

というわけで、便利なサービスがあるので、さらに便利なSassと仲良くなるチャンスです。