🧩 SCSS 기초문법 완전 정복

웹퍼블리셔와 프론트엔드 개발자를 위한 필수 스타일링 기초

SCSS(Sass)는 CSS를 보다 구조적이고 효율적으로 작성할 수 있도록 도와주는 전처리기입니다.
이 강의는 HTML/CSS 기본 지식이 있는 분들을 대상으로, 실무에 바로 적용 가능한 SCSS의 핵심 문법을 짧고 명확하게 전달합니다.

---

✨ 강의 구성

🔹 1. SCSS 설치 및 시작

• SCSS 개발환경 준비
• .scss 파일 작성과 컴파일 흐름 이해

🔹 2. SCSS 기본 문법 익히기

• 변수($) 사용법과 활용 예시
• 문자보간(Interpolation) #{}의 원리
• SCSS에서의 데이터 타입: 숫자, 문자열, 컬러, 리스트 등
• 선택자 중첩(Nesting)을 통한 구조적 스타일 구성
• 반복적인 코드를 줄이는 @mixin과 @extend
• 반복문: @for, @each
• 조건문: @if, @else if, @else
• 연산자와 함수 정의 @function
• SCSS에서 자주 쓰는 연산자들 소개

🔹 3. 내장 모듈 활용하기 (Built-in Modules)

SCSS는 다양한 기본 모듈을 제공합니다.

• 문자(String)
• 색상(Color)
• 수학 연산(Math)
• 리스트(List)
• 맵(Map)
• 메타 정보(Meta)

➡ 이 모듈들은 @use와 함께 로드하며, @use "sass:color"와 같은 방식으로 사용합니다.

🔹 4. 설정 및 재사용 구조 만들기

• @import와 @use, @forward의 차이와 사용법
• 모듈화된 구조를 만드는 설정 방식 이해

---

🎯 이런 분들에게 추천합니다

• CSS는 익숙하지만 유지보수에 어려움을 느끼는 웹퍼블리셔
• 변수, 반복문, 함수 개념으로 CSS를 더 효율적으로 쓰고 싶은 분
• 반응형 웹에서 재사용성과 관리 편의성을 높이고 싶은 프론트엔드 입문자

⏰ 수강 정보

• 수강 기간: 1개월 열람권
• 가격: ₩29,000
• 난이도: 입문~초중급