[Sass] Sass와 SCSS의 차이

Sass와 SCSS의 차이에 관해

스타일을 빠르고, 효과적으로 작성하기 위해 많은 웹 퍼블리셔분들은 CSS전처리기(CSS Preprocessor)를 사용합니다. 오늘은 그 중에서 제가 주로 사용하고 있는 Sass에 대해 간단히 소개하고 자주 헷갈리는 Sass 와 SCSS의 차이에 대해 설명하고자 합니다.

Sass?

앞서 설명한대로 CSS전처리기 중 하나 입니다. 그런데 이 Sass는 전처리기라는 의미 외에도 문법을 의미 합니다. 그 문법은 들여쓰기를 이용한 감지가 핵심이었습니다. 그런데, Sassy CSS를 의미하는 SCSS(CSS 친화적인 구문)가 제공되었고, Sass 의 문법은 Sass 와 SCSS 두가지가 되었습니다.

정리하자면, Sass는 전처리기 이자 문법 입니다.

Sass VS SCSS

• Sass는 전처리기의 의미이자 문법 중 하나, SCSS는 Sass의 문법 중 하나
• 문법: Sass는 중괄호, 세미콜론, 구두점이 없고 들여쓰기만 사용합니다. SCSS는 그반대입니다.

사실 이 두가지는 문법적 차이만 존재하는 것이라, 무엇을 쓰는지 상관없지만 CSS가 친숙한 저는 Sass의 SCSS문법을 사용합니다.

참고 URL

Sass Guide