CSS 설계 실전 가이드

CSS 설계 실전 가이드

$27.70
Description
SMACSS, BEM, PRECSS 등 CSS 설계에 관한 다양한 사고 방법 학습!
버튼, 라벨, 카드, 테이블 등 실질적인 코드 다수 수록!
CSS를 보다 깊이 이해할 수 있는 8가지 설계 방법!
많은 개발 현장에서 CSS를 도입해서 사용하고 있지만, 여전히 여러 가지 고민이 남아 있습니다. 프로젝트의 규모나 특성에 따라 적합한 해결책 역시 천차만별인 게 현실입니다. 이 책은 CSS의 다양한 설계 방법을 소개하면서 제반 사고방식은 물론, 실전 포인트까지 짚어 줍니다. 이를 기반으로 버튼, 라벨, 카드, 테이블 등 대표적인 웹 모듈을 전반적으로 다루고, 이 구조들을 조합하는 실전적인 코드도 소개합니다. 대표적 CSS 설계 방법인 ‘BEM’, 그리고 저자가 개발한 설계 방법인 ‘PRECSS’를 비교하면서 설계와 관련된 사고 과정을 친절하게 소개하면서 최적의 해결책을 찾아가도록 돕습니다.
웹 개발에 뛰어든 개발자, 프런트엔드 엔지니어 분들이라면 반드시 읽어 봐야 할 책입니다.

이 책의 대상 독자
- CSS 설계에 관한 지식을 습득해 한 단계 성장하고자 하는 주니어 프런트엔드 엔지니어
- CSS 설계에 관한 깊은 이해를 통해 실력을 향상하고자 하는 시니어 프런트엔드 엔지니어
- 조직 수준에서의 CSS 규칙을 제정하고자 하는 책임자나 팀 리더
저자

한다아츠시

半田惇志
주식회사24-7의테크니컬디렉터이자주식회사팡세의시니어엔지니어

SI프로젝트에서프런트엔드개발부터시작해서전체적인업무의워크플로우설계와개선,마케팅자동화,콘텐츠제작까지다양한업무를경험했다.HubSpotCMS와CSS설계에는특히자신있다.좋아하는말은‘인간만사새옹지마’.

PRECSS:https://precss.io/ja/
ThinkingSalad:http://www.thinkingsalad.com
Twitter:@assialiholic

목차

Chapter1CSS의역사와문제점1
1-1CSS의시작2
1-2CSS의문제점4
1-3복잡해지는웹개발6
1-4해결책으로탄생한CSS설계9
1-5CSS설계와디자인시스템연동11

Chapter2CSS설계기본및실전17
2-1CSS설계에들어가기전에:CSS기본상세도와셀렉터18
2-2CSS설계에들어가기전에:리셋CSS24
2-3CSS설계에들어가기전에:영단어를결합하는방식의이름28
2-4좋은CSS설계의네가지목표29
2-5CSS설계실전과여덟가지포인트31
2-6모듈의상세도를고려한다74
2-7CSS설계의필요성78

Chapter3다양한설계기법79
3-1이장의설명에앞서80
3-2OOCSS81
3-3SMACSS86
3-4BEM103
3-5PRECSS134

Chapter4레이아웃설계159
4-14~7장의코드를위한사전준비160
4-2이번장에서다루는샘플162
4-3헤더164
4-4푸터167
4-5콘텐츠영역170

Chapter5CSS설계모듈집①최소모듈179
5-1이번장이후의모듈집설명방법180
5-2최소모듈정의181
5-3버튼182
5-4아이콘이붙은작은버튼197
5-5아이콘201
5-6라벨207
5-7제목212
5-8주석220

Chapter6CSS설계모듈집②복합모듈223
6-1복합모듈정의224
6-2미디어225
6-3카드235
6-4테이블(수평)256
6-5테이블(수직)263
6-6테이블(교차)266
6-7페이저270
6-8내비게이션276
6-9CTA279
6-10가격표281
6-11FAQ292
6-12아코디언298
6-13점보트론305
6-14포스트목록312
6-15순서가없는리스트315
6-16순서가있는리스트321

Chapter7CSS설계모듈집③모듈재사용325
7-1최소모듈을사용한복합모듈만들기326
7-2최소모듈과복합모듈조합하기329
7-3복합모듈간조합하기337

Chapter8CSS설계를보다잘하기위한스타일가이드347
8-1스타일가이드란348
8-2왜스타일가이드가필요한가?349
8-3스타일가이드만들기350
8-4스타일가이드만들기를위한지침모음363

Chapter9CSS개발에도움이되는다양한기술365
9-1CSS개발효율화와실수줄이기366
9-2사람에따른편차없애기369
9-3리팩터링힌트얻기373
9-4CSS경량화375
9-5HTML개발효율화하기381
9-6개발에전달할마스터자동으로처리하기383