핵심 요약
너드팩토리의 Styled-Components 도입은 CSS-in-JS 방식으로 자바스크립트 파일 내에서 스타일링을 선언하고, 상태 변화에 따른 조건부 스타일링과 재사용성 향상을 제시합니다.
주요 특징
- CSS-in-JS 방식의 태그드 템플릿 리터럴로 컴포넌트와 스타일을 JS 안에 선언
- Props로 조건부 스타일링과 & 자기참조 스타일링을 지원
- GlobalStyle과 ThemeProvider로 전역 스타일 및 테마를 관리
- withComponent, keyframes, attrs, nesting, css mixins로 재사용성과 확장성 확보
적용 고려사항
- React 기반 프로젝트에서 Styled-Components 설치 및 도입 필요
- 기존 CSS 중심 코드베이스로의 전환 시 인터페이스 변화와 테스트 영향 고려
