docs: 김유진 챕터 9/10 내용정리

김유진/5주차/CH_10_합성패턴.md

@@ -0,0 +1,33 @@
+# 리액트 관련 개념 정리
+
+## 1. 고차 함수 (Higher-Order Function)
+- 다른 함수를 **인자로 받거나**,  
+- 함수를 **반환하거나**,  
+- 또는 두 가지 특징을 모두 가진 함수
+
+---
+
+## 2. 고차 컴포넌트 (HOC, Higher-Order Component)
+1. 컴포넌트를 전달받아 새로운 **개선된 버전의 컴포넌트**를 반환하는 함수  
+2. 기존의 컴포넌트에 **기능을 추가**할 수 있도록 하는 패턴
+
+---
+
+## 3. 리액트 훅 (React Hooks)
+1. 상태가 있는 로직을 컴포넌트에서 분리할 수 있게 하여 **독립적인 테스팅과 재사용**을 가능하게 함  
+2. 컴포넌트 구조를 바꾸지 않고도 상태가 있는 로직을 **재사용**할 수 있음  
+
+---
+
+## 4. 헤드리스 컴포넌트 패턴 (Headless Component Pattern)
+1. **로직을 캡슐화**하지만 렌더링과 관련된 UI는 포함하지 않는 함수/컴포넌트  
+2. 다양한 형태로 나타내야 하는 영역에서 복잡한 로직을 **재사용**할 때 유용함  
+
+### 장점
+- 재사용성  
+- 관심사 분리  
+- 유연성  
+
+### 단점
+- 높은 진입장벽  
+- 과도한 추상화 위험

김유진/5주차/CH_9_리액트_설계원칙_적용.md

@@ -0,0 +1,41 @@
+# 리액트의 동시성 모드 (Concurrent Mode)
+
+## 1. 비동기 렌더링
+- 렌더링 중이더라도 더 중요한 작업(우선순위)이 생기면 중단하고, 해당 중요 작업을 먼저 처리한 뒤 렌더링을 이어서 수행
+- **예시:** 사용자가 스크롤을 하는 동안 배경 데이터가 로드될 때 → 스크롤 동작을 우선 처리하여 화면 끊김 방지
+
+## 2. 우선순위 기반 작업 처리
+- **높은 우선순위:** 사용자 입력, 애니메이션
+- **낮은 우선순위:** 비동기 업데이트, 백그라운드 데이터 로드
+
+## 3. 중단 및 재개
+- 렌더링 작업을 중단하고 나중에 이어서 처리 가능
+
+---
+
+# 단일 책임 원칙 (SRP, Single Responsibility Principle)
+
+## 1. Render Prop 패턴
+- prop으로 함수를 컴포넌트에 전달 (고차 함수 형태)
+
+## 2. 합성을 통한 단일 책임 원칙 적용
+- 작은 컴포넌트를 합성하여 각 컴포넌트가 단일 책임을 가짐
+
+---
+
+# 의존관계 역전 원칙 (DIP, Dependency Inversion Principle)
+
+- 객체에서 어떤 **class**를 참조해야 하는 상황이 생기면,
+  - 그 class를 직접 참조하는 것이 아니라,
+  - 그 대상의 **상위 요소(추상 클래스 or 인터페이스)** 를 참조하도록 설계해야 함.
+
+---
+
+# 명령과 조회 책임 분리 원칙 (CQRS, Command Query Responsibility Segregation)
+
+- 메서드나 함수는 **명령(Command)** 이거나 **조회(Query)** 둘 중 하나만 수행해야 함.
+- 동시에 두 가지 기능을 해서는 안 됨.
+
+## 구분
+- **명령 메서드 (Command):** 객체의 상태 변경을 수행, 값을 반환하지 않음
+- **조회 메서드 (Query):** 객체의 상태를 변경 없이 읽음