개요
Master CSS 시작하기
클래스 구문, 디자인 토큰, CSS 전달 방식을 익히고 사용 중인 프레임워크에 적용하세요.
시작하기 5
Master CSS를 설치하고 첫 프로젝트를 실행하세요.
- Master CSS 입문 클래스로 인터페이스를 만들고 생성 CSS를 따라가며 프로젝트에서 공유할 값을 정의하세요.
- Master CSS 설치하기 프레임워크 통합을 선택하거나 CDN 제공 여부를 확인하고, CLI로 스타일시트를 생성합니다.
- 구문 튜토리얼 Master CSS 클래스를 읽고 조합하며 상호작용 상태와 조건을 추가하고 가용 공간에 반응하는 가이드 카드를 만드세요.
- 호환성 사용 가능한 폴백을 유지하며 새 CSS 기능을 사용하고 브라우저 동작을 확인하며 서드 파티 스타일을 캐스케이드에 배치합니다.
- Master CSS로 마이그레이션 컴포넌트나 라우트 하나를 변환하고 스타일을 공유하는 화면을 검증한 뒤 사용처가 없어진 의존성을 제거합니다.
AI 에이전트 워크플로 2
편집기를 설정하고 AI 코딩 에이전트와 협업하세요.
스타일 작성 7
테마 토큰, 스타일, 재사용 가능한 패키지를 구성하세요.
- 테마 토큰 공유 디자인 값을 정의하고 토큰 수정이 사용 측에 미치는 영향을 확인하며 로컬 재정의, 정적 전달, 인라인 치환을 선택합니다.
- 전역 스타일 하나의 앱 진입점을 불러오고 역할에 따라 공유 CSS를 나누며 문서 기본값, 컴포넌트 규칙, 라우트 스타일을 알맞은 범위에 둡니다.
- 스타일 재사용 함께 바뀌어야 할 내용에 따라 토큰, 컴포넌트 클래스, 유틸리티, 믹스인을 선택하고 로컬 변형은 쉽게 표현할 수 있게 유지합니다.
- 라우트 단위 스타일 공유 정의를 사용하면서 라우트 CSS를 로컬로 전달하고 참조 맥락, 네이티브 규칙, 선택자 범위를 구분합니다.
- 클래스 이름 스캔 완전한 클래스 이름을 작성하고 변하는 값을 처리하며 정적 빌드에 필요한 소스를 포함합니다.
- 패키지 작성 공유 CSS 소스를 게시하고 각 앱에서 공개 토큰을 재정의하며 프로덕션 사용 앱에서 패키징한 패키지를 검증합니다.
- Master CSS 코드 린팅 ESLint로 Master CSS 클래스를 검증하고 충돌을 감지하며 클래스 목록을 정렬하고 프로젝트 정책을 적용하세요.
기본 개념 4
프로젝트 맥락, 렌더링, 레이어, 뷰 전환을 이해하세요.
디자인 기초 4
일관된 레이아웃, 색상, 타이포그래피로 반응형 인터페이스를 만드세요.
빌드와 전달 1
프로덕션에 맞게 스타일을 준비하고 최적화하세요.