프론트엔드에서의 MVC/MVVM 패턴을 알아보자

MVC 패턴이란 무엇일까?MDN에 따르면 MVC는 사용자 인터페이스, 데이터 및 논리 제어를 구현하는데 널리 사용되는 소프트웨어 디자인 패턴이다. 이 패턴은 소프트웨어의 비즈니스 로직과 화면을 구분하는데 중점을 두고 있다. 이러한 "관심사 분리"는 더나은 업무의 분리와 향상된 관리를 제공한다.MVC 소프트웨어 디자인 패턴의 3가지 부분은 다음과 같은 역할을 가지고 있다.1. 모델: 데이터와 비즈니스 로직을 관리한다.2. 뷰: 레이아웃과 화면을 처리한다.3. 컨트롤러: 이벤트를 처리하여 모델을 변경주는 명령, 변경된 모델을 다시 화면에 그려주는 명령을 수행한다. MVC 패턴에 단점이 있다고..? 특히 Frontend에서의 MVC를 살펴보자면, View는 유저의 인터랙션을 받아들여 Model을 갱신하게 된다..

• format_list_bulleted 프로그래밍 방법론/디자인패턴
• · 2024. 9. 20.
• textsms

[도메인 주도 설계 핵심] 6장 요약

도메인 이벤트는 바운디드 컨텍스트 내의 비즈니스 관점에서 중요한 사항들에 대한 기록들이다. 즉, 도메인 이벤트가 전략적 설계를 위해 매우 중요한 도구이다. 비즈니스 도메인은 인과관계가 있는 오퍼레이션(한 오퍼레이션이 다른 것의 원인이 되는)이 분산된 시스템의 동일한 요청 내에 존재하는 모든 의존적인 노드들에게 보여지는 경우, 의존 관계 일관성을 제공한다. 인과 관계에 있는 오퍼레이션은 반드시 특정한 요청으로 인해 발생하기 때문에 그 특정한 요청이 발생되지 않으면 인과관계에 있는 오퍼레이션은 발생할 수 없다. 즉, 특정한 오퍼레이션이 다른 애그리게잇에서 명확하게 발생하기 전에는 한 애그리게잇이 생성되거나 수정될 수 없다는 뜻이다. 전술적 설계 노력을 통해 도메인 이벤트가 도메인 모델에 구체화되고, 도메인 ..

• format_list_bulleted 프로그래밍 방법론/도메인 주도 설계
• · 2024. 9. 19.
• textsms

[도메인 주도 설계 핵심] 5장 요약

애그리게잇과 전술적 설계여기 2개의 바운디드 컨텍스트가 존재한다. 왼쪽은 애자일 프로젝트 관리 컨텍스트라는 이름의 핵심 도메인이고, 오른쪽은 컨텍스트 매핑 통합 기반의 협업 도구를 제공하는 지원 서브도메인이다. 바운디드 컨텍스트 안에 자리잡은 개념들이 바로 모델 안에 존재하는 애그리게잇이다.왜 필요할까?두 바운디드 컨텍스트 안에 동그라미 쳐진 개념들 각각은 애그리게잇이다. 동그라미를 치지 않은 개념인 Discussion은 값 객체(Value Object)로 모델링한 것이다. 엔티티란 무엇일까?엔티티는 독립적인 것이며, 각 엔티티는 같은 형태를 띠거나 다른 형태의 엔티티들과의 특성을 구별할 수 있는 고유한 식별성을 갖습니다.엔티티는 변할 수 있으며, 변하지 않을수도 있다. 값 객체는 무엇인가?값 객체는 불..

• format_list_bulleted 프로그래밍 방법론/도메인 주도 설계
• · 2024. 9. 9.
• textsms

[도메인 주도 설계 핵심] 4장 요약

컨텍스트 매핑과 전략적 설계DDD 프로젝트에는 핵심 도메인 뿐만 아니라 프로젝트와 관련된 여러 개의 바운디드 컨텍스트가 있다.핵심 도메인인 애자일 프로젝트 관리 컨텍스트에 맞지 않는 다른 개념들은 전부 다른 바운디드 컨텍스트 중 하나로 옮겨서 관리한다. 이때, 애자일 프로젝트 관리 핵심 도메인을 다른 바운디드 컨텍스트와 통합해야 하는데, DDD에서는 이런 통합을 컨텍스트 매핑이라고 한다. 이전의 컨텍스트 맵에서 Discussion이 2개의 서로 다른 바운디드 컨텍스트 내에 존재하는 것을 확인할 수 있고, 애자일 프로젝트 관리 컨텍스트가 Discussion의 소비 주체라는 점과 협업 컨텍스트가 Discussion의 근원이라는 것도 기억해야 한다.두 바운디드 컨텍스트 안에 각각의 보편언어가 있는 것을 생각해..

• format_list_bulleted 프로그래밍 방법론/도메인 주도 설계
• · 2024. 9. 8.
• textsms

[도메인 주도 설계 핵심] 2장, 3장 요약

바운디드 컨텍스트 및 보편언어와 전략적 설계DDD- 바운디드 컨텍스트 내에서 보편 언어를 모델링하는 것에 대한 것 바운디드 컨텍스트- 의미적으로 동일한 컨텍스트의 범위를 표현하는 것- 해당 범주 내에서 SW 모델의 각 컴포넌트는 특정한 의미를 갖고, 특정한 일을 수행한다는 것- 바운디드 컨텍스트 내의 컴포넌트는 컨텍스트에 특화되어 있고, 컨텍스트 안에서 의미가 살아난다. 문제 영역- 상위 수준의 전략적 분석을 수행하고, 주어진 프로젝트 제약사항 내에서 단계를 설계하는 곳 해결 영역- 문제 영역의 논의가 핵심 도메인으로 바라보는 해결 방안을 구현하는 곳- 바운디드 컨텍스트를 조직의 핵심 전략 계획으로 개발하고 있을 때, 이를 핵심 도메인이라고 부른다. 핵심 도메인- 가치 있는 것들을 달성하는 수단이자 다른..

• format_list_bulleted 프로그래밍 방법론/도메인 주도 설계
• · 2024. 9. 7.
• textsms

Jest의 Mock 정리 방법

JavaScript / TypeScript 기반의 코드를 작성하다보면 vitest나 jest라는 테스팅 라이브러리의 도움을 받게 됩니다. 이 때, 자연스럽게 `fn()`, `spyOn()`, `mock()` 등의 API를 활용하여 테스트 더블을 만들어줍니다. 다음 테스트 케이스를 실행하기 전에, 현재 테스트 케이스에서 사용했던 Mock을 정리해주는 것이 좋습니다. 왜냐하면 해당 Mock이 다음 테스트 케이스에 영향을 줄 수 있기 때문입니다. 테스트를 수행하기 위해서는 잘 Mocking하는 것도 중요하지만 Mock을 깨끗이 초기화시키는 것 또한 중요합니다 검증해보기 const consoleLog = console.log; test("spyOn method로 console.log를 모킹하면 console.l..

• format_list_bulleted 프로그래밍 방법론/테스트코드
• · 2024. 4. 21.
• textsms