2025.03.12 - [Programming Language/React] - [React] Design Pattern in React (4) - Proxy 이전 글에 이어,이번엔 싱글톤(Singleton) 패턴의 자주 쓰이는 용례들을 적어보고자 한다. 싱글톤 패턴(Singleton)싱글톤 패턴은 클래스의 인스턴스가 애플리케이션 전체에서 단 하나만 존재하도록 보장하는 디자인 패턴입니다. React와 Next.js에서는 전역 상태 관리, 서비스 인스턴스, 유틸리티 등을 구현할 때 유용하게 활용됩니다. 1. 기본 구조JavaScript/TypeScript에서의 싱글톤 패턴기본 구현:// 기본적인 싱글톤 패턴 구현class Logger { private static instance: Logger; pr..
2025.03.11 - [Programming Language/React] - [React] Design Pattern in React (3) [React] Design Pattern in React (3)2025.03.10 - [Programming Language/React] - [React] Design Pattern in React (2) 이전 글에 이어,이번엔 프로토타입(Prototype) 패턴의 자주 쓰이는 용례들을 적어보고자 한다. 프로토타입 패턴(Prototype)프로토타입juniortunar.tistory.com 이전 글에 이어,이번엔 프록시(Proxy) 패턴의 자주 쓰이는 용례들을 적어보고자 한다. 프로토타입 패턴(Prototype) 프록시 패턴은 특정 객체에 대한 접근을 제어하는..
2025.03.10 - [Programming Language/React] - [React] Design Pattern in React (2) 이전 글에 이어,이번엔 프로토타입(Prototype) 패턴의 자주 쓰이는 용례들을 적어보고자 한다. 프로토타입 패턴(Prototype)프로토타입 패턴은 기존 객체를 복제하여 새로운 객체를 생성하는 디자인 패턴으로, React에서는 이 개념을 컴포넌트 재사용과 확장에 적용하여, 기본 컴포넌트를 만들고 이를 확장하여 다양한 변형을 만드는 방식으로 활용한다. 1. 기본 구조React에서 프로토타입 패턴의 기본 구현:// 기본 프로토타입 컴포넌트function Button({ children, ...props }: React.ButtonHTMLAttributes) {..
2025.03.07 - [Programming Language/React] - [React] Design Pattern in React (1) [React] Design Pattern in React (1)리액트에서 일반적으로 자주 쓰이는 패턴이 뭐다 이렇게 정의할 정도로 아직은 깊이가 없지만,실무에서 흔히들 많이 쓴다는 패턴을 정리해보려고 한다. 다룰 패턴들은렌더 프롭스 / 훅스 / 프juniortunar.tistory.com 이전 글에 이어,이번엔 Hooks 패턴의 자주 쓰이는 용례들을 적어보고자 한다.Hooks 패턴Hooks는 React 16.8에서 도입된 기능으로, 함수형 컴포넌트에서 상태 관리와 생명주기 기능을 사용할 수 있게 해주는 패턴이다.Render Props 패턴의 많은 사용 사례를 더 ..