한 걸음씩
BEM 본문
소규모 프로젝트에서는 스타일을 구성하는 방법이 일반적으로 큰 문제가 되지 않는다.
하지만 더 크고 복잡한 프로젝트의 경우 코드를 구성하는 방법론이 존재한다. 이는 코드를 작성하는 데 걸리는 시간, 필요한 코드의 양에 영향을 준다. 그리고 브라우저에서 수행해야 하는 로딩 시간, 팀원과 작업할 때 높은 성능이 필수적인 경우 특히 중요하다.
▶ 방법론
OOCSS - CSS '객체'로 컨테이너와 콘텐츠 분리
SMACSS - CSS 규칙에 대한 5가지 범주로 CSS를 작성하기 위한 스타일 가이드
SUITCSS - 구조화된 클래스 이름과 의미 있는 하이픈
Atomic - 스타일을 원자적 또는 분할할 수 없는 조각으로 분해
▶ 왜 BEM을 사용할까?
어떤 방법론보다 구조화된 CSS 및 UI의 이점을 누릴 수 있다.
일부 스타일은 덜 엄격하고 더 유연하지만 다른 스타일은 팀 내에서 이해하기 더 쉽다.
https://getbem.com/introduction/
BEM — Introduction
Introduction On smaller brochure sites, how you organize your styles isn’t usually a big concern. You get in there, write some CSS, or maybe even some SASS. You compile it all into a single stylesheet with SASS’s production settings, and then you aggre
getbem.com
'Web' 카테고리의 다른 글
| CSS clip-path (1) | 2023.12.06 |
|---|---|
| SASS (1) | 2023.12.06 |
| [web][css] transition, animation (0) | 2023.05.16 |
| [web][css] typography (0) | 2023.05.12 |
| [web][css] mediaquery (0) | 2023.05.12 |
