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

10_Wiki/Topics_Art/UI_UX_Assets/Design Systems.md

@@ -1,4 +1,4 @@
-# [[Design Systems]]
+# [[Design Systems|Design Systems]]
 
 ## 📌 Brief Summary
 디자인 시스템(Design Systems)은 색상, 간격 등의 시각적 디자인 정보를 담은 디자인 토큰(Design Tokens)과 규칙, 재사용 가능한 컴포넌트들의 집합입니다[1]. 이는 엔지니어, 디자이너, 프로덕트 매니저가 일관성 있고 접근성이 뛰어난 애플리케이션을 빠르고 효율적으로 구축할 수 있도록 돕는 공통 언어 역할을 합니다[2]. 디자인 시스템을 도입하면 스타일의 파편화를 막고, 다크 모드나 다중 브랜드 테마와 같은 글로벌 변경 사항을 런타임 또는 빌드 타임에 안전하고 동적으로 확장할 수 있습니다[3-5].
@@ -15,8 +15,8 @@
 * **대규모 프론트엔드의 구조화(Monorepo 및 FSD)**: 시스템이 커질 경우, 단일 폴더에 공유 컴포넌트를 무분별하게 담지 않고 Monorepo 환경에서 Feature-Sliced Design (FSD) 아키텍처를 도입하는 것이 권장됩니다[38-41]. FSD는 코드를 Shared, Entities, Features, Widgets, Pages 등으로 명확히 분리하여 의존성의 방향을 통제하고 퍼블릭 API 캡슐화를 강제하여 시스템을 견고하게 유지합니다[39, 41].
 
 ## 🔗 Knowledge Connections
-- **Related Topics:** [[Design Tokens]], [[Atomic Design]], [[Compound Components]], [[Tailwind CSS]], [[Styled-components]], [[Feature-Sliced Design]]
-- **Projects/Contexts:** [[Shopify Polaris]], [[Uber Base Web]]
+- **Related Topics:** [[Design Tokens|Design Tokens]], [[Atomic Design|Atomic Design]], [[Compound Components|Compound Components]], [[Tailwind CSS|Tailwind CSS]], [[Styled Components|Styled-components]], [[Feature-Sliced Design|Feature-Sliced Design]]
+- **Projects/Contexts:** [[Shopify Polaris|Shopify Polaris]], [[Uber Base Web|Uber Base Web]]
 - **Contradictions/Notes:** 소스 [42]와 [43]는 Tailwind CSS를 사용할 때 여러 유틸리티 클래스로 인해 마크업이 매우 길어지고(Class Soup) 가독성이 떨어질 수 있다고 지적하지만, 소스 [44]와 [45]은 이를 방지하기 위해 유틸리티 클래스를 반복 작성하는 대신 "재사용 가능한 컴포넌트"로 추상화하거나 플러그인 기반 시스템을 구축해야 한다고 조언합니다. 또한 소스 [14], [18]은 Styled-components가 훌륭한 개발자 경험과 동적 스타일링을 제공한다고 설명하지만, 소스 [15], [16], [17]은 대규모 앱이나 RSC가 적용된 Next.js 환경에서는 런타임 성능 및 호환성 이슈를 야기할 수 있으므로 Tailwind나 CSS Modules를 권장하며 서로 다른 최적의 사용 사례를 제시합니다.
 
 ---