HTML/CSS上級から出現した「SASS」とは何のこと?【プログラミング初心者】

日々の学習

JavaScript中級からHTML/CSS上級付近から登場した、聞いたことも見たこともない言葉シリーズ。
そんな分からない言葉、本日は「SASS」です。

SASSは、HTML/CSS上級あたりから出現しています。
HTML/CSSは初心者向けだと信じて疑わなかったのに、上級に入って一気にレベルアップ。
いきなり追いついていけなくなっています。

「SASS」とは?

SASSは、「Syntactically Awesome StyleSheet」の略。
字面を見る限り、CSSのすごい版と思われます。
ここで聞いたことはあるはずなのですが、CSSは何の略だったかという疑問が。
はい、「Cascading Style Sheet」です。

HTML/CSSは、「マークアップ言語」や「スタイルシート」と呼ばれ、正確にはプログラミング言語ではありません。
しかし、このSASSは少しプログラミング言語っぽいようです。

そんなSASSの特徴はこちら。

・ネストでCSSが扱える
・変数が使える
・CSSのようにHTMLから直接読み込むことはできない
⇒HTML、CSS、SCSSの順に読み込ませる
・mixinでテンプレート可することができる

ここでまた不明なワード、「mixin」が登場しました。
このお勉強はまた次の機会にしましょう!

「SASS」を使うメリットは?

ところで、CSSは案外得意だと勝手に思っておりました。
今となれば、勘違いも甚だしいことがよく分かります。

自称得意だと定義しているCSSではなく、小難しそうなSASSを使うメリットはどのようなことでしょうか?

・ファイルを分割することが可能
⇒数千行のCSSを分割することで記述量が減る
・変数を使うことで特定の値を使い回すことが可能
⇒関数のようなイメージ?
・CSSより管理しやすい

CSSが管理しにくいと思ったことがないのは、おそらく大規模な開発をしたことがないからでしょう。

現時点では、まだ圧倒的にCSSの方がラクだと思ってしまいます。
SASSを使い倒すことができれば、エンジニアの端くれになれますでしょうか。

おわりに

以前、実は上にあがるほどHTML/CSSは難しいという教えを頂いたことがあります。
その当時は正直あまり意味が分かっておりませんでした。
なぜなら、HTML/CSSは得意分野だと勝手に思っていたからです。

上級まで学習して、その意味がようやく理解できました。

HTML/CSSはプログラミング初心者が取り組みやすい反面、奥が深い言語だと改めて思います。
上級までひっくるめて「得意分野です」と言えるようになれたら最高ですね。
引き続き頑張ってまいります。

タイトルとURLをコピーしました