chore: Delete processed raw file (Atomic Design)

00_Raw/Atomic Design.md

@@ -1,18 +0,0 @@
-# [[Atomic Design]]
-
-## 📌 Brief Summary
-Atomic Design은 사용자 인터페이스(UI)를 가능한 가장 작은 요소인 원자(atoms)부터 시작하여 분자(molecules), 유기체(organisms), 템플릿(templates), 그리고 페이지(pages)와 같은 점점 더 복잡한 구조로 조합하여 구축하는 UI 시스템 설계 모델입니다 [1]. 이 방식은 일관된 디자인 시스템을 만들고, 컴포넌트의 재사용성을 촉진하며, 디자이너와 개발자 간의 공통된 어휘(Shared vocabulary)를 확립하는 데 탁월한 효과를 발휘합니다 [2].
-
-## 📖 Core Content
-- **계층적 UI 구성:** Atomic Design은 인터페이스를 가장 작은 단위(원자)로 쪼갠 뒤 이를 결합하여 점점 더 크고 복잡한 모듈(분자, 유기체 등)로 확장해 나가는 구조적 접근법을 취합니다 [1].
-- **주요 장점:** UI의 일관성을 유지하고 재사용 가능한 UI 라이브러리를 구축하는 데 매우 강력한 방법론으로 평가됩니다 [1, 2].
-- **아키텍처로서의 한계:** Atomic Design은 비즈니스 로직이나 상태(state)를 어떻게 구성하고 조직할 것인지에 대해서는 의도적으로 명시하지 않습니다 [2]. 그 결과, 이를 단독으로 사용할 경우 깔끔한 UI 컴포넌트 계층 이면에 무질서한 로직 계층이 생겨날 위험이 있습니다 [2]. 따라서 대규모 애플리케이션을 구축할 때 이 모델은 필요하긴 하지만 단독으로는 불충분(insufficient)합니다 [2].
-- **다른 아키텍처와의 보완 및 공존:** UI의 일관성과 재사용성에 초점을 맞추는 Atomic Design의 한계를 보완하기 위해, 애플리케이션의 흐름과 도메인의 복잡성, 비즈니스 로직에 중점을 두는 [[Feature-Sliced Design]]과 같은 아키텍처와 단일 프로젝트 내에서 상호 보완적으로 공존할 수 있습니다 [1].
-
-## 🔗 Knowledge Connections
-- **Related Topics:** [[Feature-Sliced Design]], [[Component-Based Architecture]], [[React Architecture]]
-- **Projects/Contexts:** [[Design Systems]], [[Reusable UI Libraries]]
-- **Contradictions/Notes:** 소스 문헌들은 Atomic Design이 UI 디자인과 재사용성 측면에서는 훌륭하지만, 그 자체로 비즈니스 로직과 상태(state) 관리 문제를 해결해 주지 못한다고 지적합니다. 따라서 대규모 프로젝트에서는 애플리케이션 확장을 감당하기 위해 [[Feature-Sliced Design]]과 같은 도메인/기능 중심의 아키텍처와 병행할 필요가 있습니다 [1, 2].
-
----
-*Last updated: 2026-04-26*

10_Wiki/Topics/AI/Atomic-Design-System-Architecture.md

@@ -0,0 +1,30 @@
+---
+id: FE-ARCH-ATOMIC-001
+category: "[[10_Wiki/💡 Topics/AI]]"
+confidence_score: 1.0
+tags: [atomic-design, design-system, architecture, react, component-driven, modularity, scalability]
+last_reinforced: 2026-04-26
+---
+
+# [[Atomic Design System Architecture (아토믹 디자인 시스템 아키텍처)]]
+
+## 📌 한 줄 통찰 (The Karpathy Summary)
+> "인터페이스를 쪼갤 수 없는 최소 단위(Atoms)부터 거대한 유기체(Organisms)까지 단계별로 조립하여, 일관성과 재사용성이라는 두 개의 기둥 위에 무한히 확장 가능한 UI 생태계를 구축하라" — 브래드 프로스트의 아토믹 디자인을 현대적 프런트엔드 환경으로 재해석한 설계론.
+
+## 📖 구조화된 지식 (Synthesized Content)
+- **추출된 패턴:** "Hierarchical Component Composition" — UI 요소를 복잡도에 따라 5가지 계층(Atoms, Molecules, Organisms, Templates, Pages)으로 분류하고, 하위 계층을 조합하여 상위 계층을 만드는 패턴.
+- **계층별 정의:**
+    - **Atoms (원자):** 더 이상 쪼갤 수 없는 기본 태그 (Button, Input, Label 등).
+    - **Molecules (분자):** 원자들의 결합체로, 하나의 기능을 수행 (SearchForm, FieldGroup 등).
+    - **Organisms (유기체):** 분자와 원자, 혹은 다른 유기체의 결합으로 구성된 복잡한 섹션 (Header, Sidebar, ProductGrid 등).
+    - **Templates (템플릿):** 데이터가 없는 레이아웃 수준의 골격.
+    - **Pages (페이지):** 실제 데이터가 주입되어 사용자에게 보여지는 최종 결과물.
+- **의의:** UI의 파편화를 방지하고, 디자인과 엔지니어링 간의 공용 언어를 구축하여 개발 속도를 획기적으로 향상시킴.
+
+## ⚠️ 모순 및 업데이트 (Contradictions & RL Update)
+- **과거 데이터와의 충돌:** 과거에는 단순히 기능별로 컴포넌트를 나눴으나(Shared vs Feature), 현대 정책은 아토믹 디자인의 계층 구조를 통해 '컴포넌트의 책임 범위 정책'을 명확히 정의함.
+- **정책 변화:** Antigravity 프로젝트는 아토믹 디자인의 5계층 중 Atoms와 Molecules를 공용 라이브러리로 분리하고, Organisms 이상은 서비스별 비즈니스 로직을 포함하도록 격리하는 'Atomic-Logic Separation' 정책을 시행함.
+
+## 🔗 지식 연결 (Graph)
+- [[Design-System-Governance]], [[Frontend-Architecture-and-Folder-Structure]], [[Component-Composition-Patterns]], [[Uber-Base-Web-Design-System]]
+- **Raw Source:** [[00_Raw/Atomic Design.md]]