文字通りCSSを拡張してイケてる書き方ができるようにしたもの!メタ言語とは、ある言語についてなんらかの記述をするための言語。特定のルールを加えて応用が効くようになったもの(⑅•ᴗ•⑅)Sassと使うメリット複雑になりがちなCSSをメンテナンスしやすい!具体的には...ネスト(入れ子)が使えて構造が把握しやすい四則演算ができる変数が使えるファイルを分割できるMixin(ミックスイン)でコードを引用できるコードを継承で使い回せるJavaScriptのように関数が使える具体的に見てみるネストが使える例えばsectionの中にclass-oneクラスとbuttonがあったとして、それぞれにCSSを当てたい場合次のようになります。右が素のCSS、左がSass。Awesome!!(๑♥‿♥๑)sectionの中にあるよってことが普通のCSSより分かりやすいですね〜また、複数のクラスを指定したい場合はです。ある要素に対する疑似要素も見やすくなります。↓&で親要素を取得&を使うことで、親要素を指定することができます。変数$マークによって変数を指定することができます。何度も出てくるような数値や属性に使えて便利。四則演算CSSでもcalcを使えば四則演算できるのでこちらもSass独自ではないけど、Sassの場合変数と組み合わせて使えるのでその点が便利♥ファイルの分割Sassはファイルを分割し、インポートすることで膨大なコードのCSSファイルをコンポーネント化することが可能。́)MixinMixinとは引数を取ることができ、コードを一部書き換えながら再利用できる機能のこと。関数みたいなイメージですかね(*’∀’人)正確には別物みたいですが。-gがグローバルインストールのコマンドで、-gを付けないとローカルインストールscssファイルの作成と設定関連sassディレクトリの中にmain.scssファイルを作成。main.scssそのファイルに記述したSassのコードをCSSにコンパイルするように設定をするため、package.jsonのscriptsの箇所に以下を記述。css/style.css"}`-w`オプションをつけると、変更を加えるたびにコンパイルが実行されるように設定できる。)⸝❤︎すごいどうでもいいですが、女子的にはSass関連をググるとピンクで可愛いのでSass大好きです。)b✧笑ほらね?めちゃくちゃ可愛い。)/実際に仮想環境でコマンドをじゃんじゃん叩けるのでパソコンが壊れる心配がなくて良き★コース全体はこんな感じツイートRinaシドニー在住。約3,700字Rinaシドニー在住。今回の内容Sassってなんぞ具体的に見てみる使ってみるZennエンジニアのための情報共有コミュニティAboutZennについて運営会社お知らせ・リリースGuides使い方Publicationよくある質問LinksTwitterGitHubメディアキットLegal利用規約プライバシーポリシ。