미디엄 게시글을 읽고 - 2025/01/14

제목	React Application Architecture: Part 1	React Application Architecture: Part 2
출처	https://medium.com/gitconnected/react-application-architecture-part-1-26c185c78401	https://levelup.gitconnected.com/react-application-architecture-part-2-28b35c293225
요약	주요 아키텍처 원칙 1. 컴포넌트 설계 프레젠테이션 컴포넌트는 렌더링에만 집중해야 함 비즈니스 로직은 컴포넌트 외부에서 관리 2. API 레이어 설계 HTTP 클라이언트 추상화 데이터 변환 및 인터셉터 구현 외부 라이브러리 종속성 최소화 3. 레이어 분리 뷰 레이어 데이터 접근 레이어 비즈니스 로직 레이어 핵심 접근 방식 관심사 분리: 각 레이어와 컴포넌트는 명확하고 제한된 책임을 가짐 유연성: 쉬운 유지보수와 확장을 위한 구조적 접근 추상화: 구현 세부사항으로부터 애플리케이션 로직 보호	React 애플리케이션 아키텍처 핵심 요약 주요 접근 방식 React는 UI 컴포넌트에 집중하는 라이브러리로, 애플리케이션의 다른 부분은 개발자가 직접 설계해야 함 애플리케이션의 복잡한 기능들(API 상호작용, 상태 관리, 라우팅 등)을 체계적으로 구조화해야 함 핵심 설계 원칙 1. 컴포넌트 설계 프레젠테이션 컴포넌트는 렌더링에만 집중 비즈니스 로직은 컴포넌트 외부에서 관리 2. 레이어 분리 뷰 레이어 데이터 접근 레이어 비즈니스 로직 레이어 주요 예제 프로젝트: Math Table Master 프로젝트 특징 사용자가 숫자 입력 시 곱셈 테이블 생성 컴포넌트 분리와 관심사 분리를 보여주는 실습 프로젝트 중요 접근 방식 핵심 원칙 관심사 분리 유연한 아키텍처 설계 데이터와 비즈니스 로직의 명확한 분리 API 레이어의 추상화 주요 권장사항 프레젠테이션 컴포넌트는 순수하게 렌더링에만 집중 API 호출은 별도의 레이어에서 관리 • • 데이터 변환과 비즈니스 로직은 컴포넌트 외부에서 처리