docs: finalized wiki integrity maintenance (v3.0 standard) - pruned 1400+ stubs and fixed 11k+ ghost links

This commit is contained in:
Antigravity Agent
2026-05-02 09:18:34 +09:00
parent c84dcb8371
commit 6445fcc05b
13150 changed files with 55394 additions and 100862 deletions
@@ -1,7 +1,7 @@
# [[대규모 엔터프라이즈 테마 시스템]]
# [[대규모 엔터프라이즈 테마 시스템|대규모 엔터프라이즈 테마 시스템]]
## 📌[[ brief]] Summary
대규모 엔터프라이즈 테마 시스템은 디자인 토큰([[Design Tokens]])과 디자인 시스템을 기반으로 애플리케이션의 시각적 일관성을 유지하고 관리하는 체계입니다 [1, 2]. 전역(Global), 의미론적(Alias), 컴포넌트(Component) 계층으로 이루어진 토큰 구조를 통해 다중 테마(다크 모드, 다중 브랜드 등)를 효율적으로 구현합니다 [3-5]. [[Style Dictionary]]와 같은 자동화 변환 파이프라인을 사용하여 웹, iOS, Android 등 다양한 플랫폼에 걸쳐 '단일 진실 공급원([[Single Source of Truth]])'을 제공하고 확장성과 유지보수성을 극대화합니다 [6, 7].
## 📌 Brief Summary
대규모 엔터프라이즈 테마 시스템은 디자인 토큰([[Design Tokens|Design Tokens]])과 디자인 시스템을 기반으로 애플리케이션의 시각적 일관성을 유지하고 관리하는 체계입니다 [1, 2]. 전역(Global), 의미론적(Alias), 컴포넌트(Component) 계층으로 이루어진 토큰 구조를 통해 다중 테마(다크 모드, 다중 브랜드 등)를 효율적으로 구현합니다 [3-5]. Style Dictionary와 같은 자동화 변환 파이프라인을 사용하여 웹, iOS, Android 등 다양한 플랫폼에 걸쳐 '단일 진실 공급원([[Single_Source_of_Truth|Single Source of Truth]])'을 제공하고 확장성과 유지보수성을 극대화합니다 [6, 7].
## 📖 Core Content
@@ -18,14 +18,14 @@
웹 및 모바일(iOS, Android) 플랫폼을 아우르는 대규모 프로젝트에서는 디자인 토큰을 JSON과 같은 플랫폼 중립적인 형식으로 저장합니다 [7]. 이를 Style Dictionary나 Theo 같은 도구를 통해 CSS 변수(Web), XML(Android), Swift(iOS) 등 각 플랫폼에 맞는 코드로 자동 변환합니다 [6, 7, 11]. 이 방식은 수동 작업으로 인한 오류를 제거하고 전체 제품 생태계에서 시각적 일관성을 완벽히 보장합니다 [6, 7].
* **최신 CSS 방법론과의 통합 전략:**
* *[[CSS-in-JS]]:* [[styled-components]]나 Emotion은 내장된 테마 프로바이더(Theme Provider)를 지원하여 상태와 props에 기반한 고도로 동적인 테마 구현이 가능하지만, 런타임 성능 오버헤드와 번들 크기 증가가 발생합니다 [12-14].
* *[[Zero-Runtime CSS-in-JS]]:* 다중 테마를 지원하는 대규모 디자인 시스템을 구축할 때 2025년 기준 가장 권장되는 방식 중 하나입니다 [15]. Vanilla Extract나 Panda CSS는 빌드 타임에 정적 CSS를 생성하여 성능 저하 없이 테마 시스템(Design Token[[ system]])과 타입 안정성(Type safety)을 제공합니다 [16, 17].
* *[[Tailwind CSS]] 하이브리드 전략:* 디자인 시스템에서 관리되는 토큰(JSON)을 `tailwind.config.js`에 주입하여 Tailwind의 유틸리티 클래스와 결합하거나, CSS Custom Properties(변수)를 통해 통합된 테마를 구성할 수 있습니다 [18, 19].
* *[[CSS-in-JS|CSS-in-JS]]:* [[styled-components|styled-components]]나 Emotion은 내장된 테마 프로바이더(Theme Provider)를 지원하여 상태와 props에 기반한 고도로 동적인 테마 구현이 가능하지만, 런타임 성능 오버헤드와 번들 크기 증가가 발생합니다 [12-14].
* *[[Zero-Runtime CSS-in-JS|Zero-Runtime CSS-in-JS]]:* 다중 테마를 지원하는 대규모 디자인 시스템을 구축할 때 2025년 기준 가장 권장되는 방식 중 하나입니다 [15]. Vanilla Extract나 Panda CSS는 빌드 타임에 정적 CSS를 생성하여 성능 저하 없이 테마 시스템(Design TokenSystem)과 타입 안정성(Type safety)을 제공합니다 [16, 17].
* *[[Tailwind CSS|Tailwind CSS]] 하이브리드 전략:* 디자인 시스템에서 관리되는 토큰(JSON)을 `tailwind.config.js`에 주입하여 Tailwind의 유틸리티 클래스와 결합하거나, CSS Custom Properties(변수)를 통해 통합된 테마를 구성할 수 있습니다 [18, 19].
## 🔗 Knowledge Connections
- **Related Topics:** [[디자인 토큰(Design Tokens)]], [[디자인 시스템(Design System)]], [[단일 진실 공급원(Single Source of Truth)]], [[Zero-runtime CSS-in-JS]], [[Style Dictionary]]
- **Projects/Contexts:** [[크로스 플랫폼(Web, iOS, Android) UI 개발 및 배포 파이프라인]], [[다크 모드 및 다중 브랜드 테마 동적 전환 시스템]]
- **Contradictions/Notes:** 런타임 기반의 CSS-in-JS(예: [[Styled Components]])는 복잡한 테마 구현에 매우 유용하다고 평가되지만, 렌더링 비용과 특히 [[React Server Components]](RSC)와의 호환성 문제로 인해, 대규모 엔터프라이즈 환경에서는 런타임 오버헤드가 없는 Zero-runtime 솔루션이나 [[CSS Modules]]로 전환하는 것이 권장됩니다 [14, 15, 20].
- **Related Topics:** [[디자인 토큰 (Design Tokens)|디자인 토큰(Design Tokens]], 디자인 시스템(Design System), 단일 진실 공급원(Single Source of Truth), [[Zero-Runtime CSS-in-JS|Zero-runtime CSS-in-JS]], [[Style Dictionary|Style Dictionary]]
- **Projects/Contexts:** [[크로스 플랫폼(Web, iOS, Android) UI 개발 및 배포 파이프라인|크로스 플랫폼(Web, iOS, Android) UI 개발 및 배포 파이프라인]], [[다크 모드 및 다중 브랜드 테마 동적 전환 시스템|다크 모드 및 다중 브랜드 테마 동적 전환 시스템]]
- **Contradictions/Notes:** 런타임 기반의 CSS-in-JS(예: [[Styled Components|Styled Components]])는 복잡한 테마 구현에 매우 유용하다고 평가되지만, 렌더링 비용과 특히 React Server Components(RSC)와의 호환성 문제로 인해, 대규모 엔터프라이즈 환경에서는 런타임 오버헤드가 없는 Zero-runtime 솔루션이나 [[CSS Modules|CSS Modules]]로 전환하는 것이 권장됩니다 [14, 15, 20].
---
*Last updated: 2026-04-26*