디자인 패턴 스터디를 진행하고 있는데,내용을 정리하고자 한다.MVC 패턴정의MVC는 애플리케이션을 세 가지 주요 컴포넌트로 분리하는 아키텍처 패턴Model: 데이터와 비즈니스 로직View: 사용자 인터페이스(UI)Controller: Model과 View 사이의 상호작용 관리특징관심사의 분리Model: 데이터 처리View: 사용자 인터페이스Controller: 로직 처리 및 조정데이터 흐름 User → Controller → Model → View → User각 컴포넌트 책임Model // 데이터 구조와 비즈니스 로직 class PhotoModel { private photos: Photo[] = []; async fetchPhotos() { this.photos = await api.ge..
JS와 React에서의 디자인 패턴을 다루기 앞서, 자바스크립트 + 리액트 디자인 패턴을 읽고,디자인 패턴에 대한 개념. 그 중 5장을 정리해보려 한다.디자인 패턴의 유형에는 뭐가 있을까?배경디자인 패턴은 소프트웨어 개발에서 자주 발생하는 문제들을 해결하기 위한 검증된 해결책이다.GoF(Gang of Four)의 디자인 패턴은 객체지향 설계에서 공통적으로 발생하는 문제들을 효과적으로 해결하는 방법을 제시한다.디자인 패턴은 코드의 재사용성을 높이고, 유지보수를 용이하게 하며, 확장성 있는 설계를 가능하게 한다.특히 객체 지향 프로그래밍에서 중요한 역할을 하며, 개발자들 간의 의사소통을 원활하게 하는 공통된 어휘를 제공한다.생성 패턴생성 패턴(Creational Pattern)은 객체의 생성과 관련된 패턴이..
JS와 React에서의 디자인 패턴을 다루기 앞서, 자바스크립트 + 리액트 디자인 패턴을 읽고,안티 패턴에 대해 정리해보려 한다.안티 패턴(Anti-pattern)디자인 패턴이 모범 사례를 뜻한다면, 안티 패턴은 겉으로만 해결책처럼 생긴 잘못된 패턴을 말하며 다음과 같이 정의한다.문제 상황에 대한 잘못된 해결책문제 상황에서 벗어나 올바른 해결책에 이르는 방법반면교사로 활용하기 위해 문서화하여 기록해야 하는 나쁜 디자인 패턴추가로,안티 패턴이란 획일적으로 어떤 사항에 해당되면 안티 패턴이라고 판단하는 것이 아니라,프로젝트 초기 설정 단계와 유지 보수 단계 등 처한 상황에 따라 결정되는 것이다.자바스크립트 안티 패턴(JavaScript Anti-pattern)자바스크립트는 변수에 저장된 값의 자료형을 명확하..
JS와 React에서의 디자인 패턴을 다루기 앞서, 자바스크립트 + 리액트 디자인 패턴을 읽고,디자인 패턴에 대한 개념을 정리해보려 한다. 디자인 패턴이란?디자인 패턴은 소프트웨어 개발에서 반복적으로 마주치는 문제를 효율적으로 해결하기 위한 모범적인 코드 설계 방식이다.이를 통해 개발자들은 코드의 가독성, 확장성, 유지보수성을 높일 수 있다. 특히 리액트와 같은 프레임워크에서는 상태 관리나 컴포넌트 구성에 디자인 패턴이 중요한 역할을 한다. 디자인 패턴의 필요성 및 특징가독성 향상: 코드 구조가 명확해져 다른 개발자들이 코드를 이해하고 수정하기가 쉬워진다.유지보수성 강화: 복잡한 로직을 반복적으로 해결할 수 있어, 코드 수정 시 더 적은 위험으로 변경이 가능하다.확장성 증가: 구조화된 코드를 기반으로 새..