본문 바로가기

component3

React와 SPA 그리고 Component 들어가며이제는 Front 라이브러리의 대세가 되어버린 메타의 React.js입니다. 이미 수많은 서비스에서 React를 도입하고 사용하고 있으며 컴포넌트 기반과 강력한 선언형 프로그래밍을 갖춘 라이브러리입니다. 제 경우는 DOM을 직접 조작하고 다루는 javascript 개발 방식도 무리는 없습니다. 그렇게 복잡하고 큰 사용자 UI 환경을 갖춘 프로젝트가 아니기 때문입니다. 하지만 대규모 프로젝트에서는 효율적으로 코드를 관리하고, 컴포넌트 기반 UI 개발을 지원하는 프론트엔드 프레임워크(라이브러리)가 필요하다보니 React가 꽤나 주목받았을 거라 생각합니다. React만의 특징1. 컴포넌트 기반Ui를 작은 단위로 쪼개서 작성한다는 부분이 큰 장점이 됩니다. 컴포넌트 단위로 UI를 조작하다보니 재사용성과 .. 2025. 9. 10.

[디자인패턴] 컴포지트(Composite) 패턴 컴포지트 패턴(Composite Pattern)*컴포지트 패턴(Composite Pattern)**은 구조적 디자인 패턴 중 하나로, 객체를 트리 구조로 구성하여 부분-전체 계층을 표현할 때 사용됩니다. 이 패턴은 클라이언트가 단일 객체와 복합 객체를 동일한 방식으로 다룰 수 있도록 해줍니다. 즉, 개별 객체(Leaf)와 복합 객체(Composite)를 동일한 인터페이스로 처리할 수 있습니다.1. 컴포지트 패턴의 기본 개념구성 요소:Component: 객체들 간의 공통 인터페이스를 정의합니다. 여기에는 Leaf와 Composite에서 공통으로 사용하는 메서드가 포함됩니다.Leaf: 트리의 말단 노드를 표현하며, 더 이상 자식을 가지지 않는 객체입니다. Component 인터페이스를 구현합니다.Compos.. 2024. 8. 25.

[디자인패턴] 데코레이터 패턴 데코레이터 패턴 (Decorator Pattern)데코레이터 패턴은 객체 지향 디자인 패턴 중 하나로, 객체에 동적으로 새로운 기능을 추가할 수 있는 구조를 제공합니다. 이 패턴은 기존의 클래스를 수정하지 않고도 객체에 추가적인 책임을 부여할 수 있게 해줍니다. 데코레이터 패턴은 상속 대신 조합(composition)을 통해 기능을 확장하는 방법을 제시하며, 이는 객체 지향 설계의 개방-폐쇄 원칙(Open-Closed Principle)을 준수하는 대표적인 예입니다.1. 데코레이터 패턴의 기본 개념구성 요소:컴포넌트(Component): 기본 인터페이스나 추상 클래스이며, 구체적인 객체들이 이를 구현합니다.콘크리트 컴포넌트(Concrete Component): 실제 기능을 구현한 클래스입니다. 데코레이터.. 2024. 8. 23.

이전 1 다음

티스토리툴바