CardItem은 데이터, class, 동적 style의 경계를 나눠 렌더링한다
카드의 구조와 공통 스타일은 CSS 모듈이 맡고, 데이터 값과 정말 동적인 색상만 props에서 들어온다.
Data
title, desc, tone
props 입력
CSS Module
card/layout
공통 모양
Inline style
동적 값
좁은 범위
Render
CardItem UI
반복 가능한 카드
요소
책임
주의
props
콘텐츠 전달
스타일 객체 과다
module class
레이아웃과 상태
전역 class 의존
inline style
색/수치 변수
hover/media 불가
component
재사용 단위
데이터와 스타일 혼합