이 상품은 구매 후 지원 기기에서 예스24 eBook앱 설치 후 바로 이용 가능한 상품입니다.
|
베타리더 후기 vii시작하며 x이 책에 대하여 xii PART I Sass 시작하기CHAPTER 1 Sass를 소개합니다 31.1 CSS 전처리기 31.2 Sass를 사용해야 하는 이유 5__1.2.1 낮은 진입 장벽 5 __1.2.2 유용한 기능과 안정성 5__1.2.3 Sass 라이브러리와 확장 51.3 Sass 작동 원리 6__1.3.1 명령행 인터페이스 7 __1.3.2 프로젝트에 Sass 도입 시 주의할 점 81.4 Sass의 두 가지 문법 8요약 9 CHAPTER 2 Sass 설치하기 102.1 웹브라우저와 코드 에디터 10__2.1.1 웹브라우저 설치 10 __2.1.2 코드 에디터 설치 122.2 비주얼 스튜디오 코드 확장 기능 Live Sass Compiler 15__2.2.1 Live Sass Compiler 설치하기 15 __2.2.2 Live Sass Compiler 사용하기 192.3 Sass 설치하기 25__2.3.1 Sass 설치하기 25 __2.3.2 Sass 명령어 사용하기 34__2.3.3 Sass 설치 및 테스트를 마치며 38요약 38 CHAPTER 3 Sass 기초 403.1 주석과 중첩 40__3.1.1 Sass 주석 40 __3.1.2 Sass 중첩 규칙 423.2 상위 선택자 참조와 단축 속성 중첩 46__3.2.1 상위 선택자 참조 46__3.2.2 상위 선택자와 결합하지 않고 치환만 하는 경우 48__3.2.3 네임스페이스 중첩 503.3 변수 51__3.3.1 CSS 변수와 Sass 변수 비교 52 __3.3.2 Sass 변수는 언제 어떻게 사용할까? 543.4 믹스인 55__3.4.1 믹스인 사용법 55 __3.4.2 믹스인 호출 시 인수 전달하기 57__3.4.3 믹스인 기본 인수 설정하기 60 __3.4.4 믹스인 콘텐츠 블록 623.5 Sass 함수 65__3.5.1 함수 사용법 65 __3.5.2 매개변수 사용법에 따른 함수의 형태 68__3.5.3 가변 인수 703.6 @extend 지시자 71__3.6.1 @extend 사용법 71 __3.6.2 유령 스타일 블록 만들기 73__3.6.3 믹스인과의 비교 753.7 @debug 지시자와 값 78__3.7.1 @debug 지시자 78 __3.7.2 숫자와 문자열 80 __3.7.3 리스트와 맵 82__3.7.4 불리언과 null 85요약 87 CHAPTER 4 Sass 고급 884.1 제어문 88__4.1.1 @if 조건문 89 __4.1.2 @while 반복문과 @for 반복문 93__4.1.3 @each 반복문 964.2 모듈화 99__4.2.1 @import 지시자 99 __4.2.2 @import 사용법 1004.3 미디어 쿼리 102__4.3.1 Sass 미디어 쿼리 102 __4.3.2 Sass 문법을 활용한 미디어 쿼리 1034.4 빌트인 모듈 106__4.4.1 sass:list 106 __4.4.2 sass:map 107 __4.4.3 sass:math 108__4.4.4 sass:string 109요약 109 PART II Sass를 이용한 클론 코딩 프로젝트CHAPTER 5 자몽톡 클론 코딩 1135.1 자몽톡 만들기 1135.2 프로젝트 구조 만들기 117__5.2.1 프로젝트 폴더 생성 117 __5.2.2 Sass 파일 구조 자세히 살펴보기 1185.3 프로젝트 진행 121__5.3.1 로그인 페이지 만들기 121 __5.3.2 내비게이션 바 만들기 129__5.3.3 헤더 바 만들기 133 __5.3.4 채팅 미리 보기 만들기 137__5.3.5 폰트어썸 사용하기 143 __5.3.6 폰트어썸 아이콘 추가하기 148__5.3.7 채팅 추가하기 154 __5.3.8 채팅 입력 폼 추가하기 160 CHAPTER 6 더덕마켓 클론 코딩 1646.1 아르바이트 구인 서비스 페이지 만들기 1646.2 프로젝트 구조 만들기 167__6.2.1 프로젝트 폴더 생성 167 __6.2.2 Sass 파일 생성 및 임포트 1686.3 프로젝트 진행 169__6.3.1 페이지 헤더 만들기 169 __6.3.2 정보 섹션 만들기 177__6.3.3 구인공고 섹션 만들기 180 __6.3.4 배너 만들고 메인 콘텐츠 마무리하기 186__6.3.5 페이지 푸터 만들기 190 APPENDIX A Sass 문법과 유사한 모던 CSS 기능 385A.1 중첩 규칙 198A.2 함수 200A.3 조건문 204마치며 205 찾아보기 207
|
강윤호의 다른 상품
|
따라 하며 배우는 실전 Sass, SCSS 스타일 원칙이 책은 Sass 문법을 나열하는 사용 설명서가 아닙니다. 규모가 커질수록 복잡해지는 CSS를 어떻게 구조화하고, 반복을 줄이고, 유지보수 가능한 스타일로 바꿀 수 있는지를 다룹니다. 이미 CSS를 써봤고, 그래서 오히려 더 답답해진 분들을 위해 Sass를 CSS를 더 잘 쓰기 위한 확장 도구로 설명하는 실전 가이드입니다.이 책만의 특별한 점Sass를 왜 써야 하는지부터 출발합니다. CSS 전처리기라는 개념, Sass의 작동 원리, 두 가지 문법의 차이를 먼저 이해한 뒤에 문법으로 들어갑니다. 기능을 외우게 하기보다 언제 쓰고 언제 쓰지 말아야 하는지를 판단할 수 있도록 기준을 제시합니다.1.문법보다 구조와 판단 기준에 집중주석과 중첩 규칙 같은 기본부터 변수, 믹스인, 함수, @extend까지 핵심 기능을 다루되, CSS 변수와 Sass 변수를 비교하고 믹스인과 @extend를 구분하며 선택 기준을 분명히 합니다. Sass를 목적이 아니라 수단으로 다루는 관점을 계속 유지합니다.2.실제 프로젝트 흐름을 그대로 옮긴 클론 코딩'자몽톡' 메신저 앱과 '더덕마켓' 중고 장터 사이트를 클론 코딩하며 파일 구조 설계, 공통 스타일 분리, 페이지와 컴포넌트 단위 모듈화를 직접 경험합니다. 예제 수준이 아니라 실제 서비스 구조에 가까운 흐름으로 Sass가 어디서 힘을 발휘하는지 체감하게 합니다.3.Sass 문법과 유사한 모던 CSS 기능 부록 제공중첩 규칙, 함수, 조건문 등 Sass와 개념적으로 닮아 있는 모던 CSS 기능을 부록으로 정리했습니다. Sass를 배우며 자연스럽게 최신 CSS 흐름까지 함께 이해할 수 있도록 구성해, 기술 선택의 폭을 넓히고 상황에 맞는 판단이 가능하도록 돕습니다.이 책은 누가 읽으면 좋을까요?CSS를 써봤지만 프로젝트가 커질수록 관리가 힘들어졌던 분Sass를 배워보고 싶었지만 언제 써야 할지 감이 안 잡혔던 분프런트엔드 개발이나 웹 퍼블리싱에서 스타일 구조를 한 단계 끌어올리고 싶은 분이 책에서 다루는 내용은 무엇인가요?CSS 전처리기와 Sass의 개념과 작동 원리 이해주석과 중첩, 상위 선택자 참조와 네임스페이스 정리변수, 믹스인, 함수, @extend의 역할과 선택 기준조건문과 반복문을 활용한 유연한 스타일 구성미디어 쿼리와 모듈화를 통한 반응형 스타일 설계클론 코딩 프로젝트를 통한 실무 중심 Sass 활용 경험
|