단일책임원칙을 적용한 필터 구현은 어떻게?

 

필터가 3개가 있다고 가정해보자

 

사용자가 선택한 필터값은 애플리케이션 어디서든 확인이 가능해야 하므로

state 값에 넣어준다.

 

필터마다 각각 관리하여 확장성을 고려한다. 

 

그림을 그려보면 다음과 같다.

 

 

State 값
주황색: 선택한 필터 전체 데이터

초록색: 선택한 필터에 맞는 서버의 매물 데이터

 

1. 매매/전세/월세 필터에 대한 데이터를 State에 추가

2. 필터에 대한 전체데이터가 담긴 값을 가지고 API조회

3. 필터에 맞는 서버 데이터를 State에 넣기

 

---

이번엔 매물종류 필터를 수정했다고 가정해보자

 

그림을 그리면 다음과 같다.

 

State의 필터에 맞는 매물조회 Parameter값은

 

매매/전세에 대한 필터 데이터는

state에 추가된 상태임(위에서 추가함)

 

매물종류 필터 데이터가 추가되었다.

 

그러면 State의 담긴

필터 parameter는

=> 매매/전세 + 매물종류

 

두가지 필터 데이터가 담겨져있고

해당 데이터를 Parameter로 사용해 조회하면

그것에 맞는 매물 데이터를 API에서 내려준다.

 

---

이렇게 됐을 때

만약 필터 하나를 삭제해야된다고 한다면

 

우리는 어느 부분에 신경을 써야하는가

 

그냥 삭제만 하면 된다. 

 

삭제된 필터 데이터는

State 값에서 빠진다.

 

존재하는 필터에 대한 데이터로만 

API 조회함.

 

---

확장성과 유지(삭제될 가능성)을 생각하여 짜면

확장성과 유지를 위함에도 좋겠지만 

 

간결하기에 이해하기 더 좋은 듯 하다.

---

 

그러나 이 구조에서 해결 해야될 점이 있다.

 

필터하나만 사라진다고 했을 때

파라미터에서는 깔끔하게 빠진다.

 

그런데 State를 바라보고 

다른 컴포넌트에서 작업을 하고 있었다면?

 

그러니까 지금 매매/전세에 대한 필터가 빠졌다.

만약 다른 컴포넌트에서 아래와 같이 참고해서 쓰고 있었다면

// state명 가정함: state.filters.parameter.매매전세

if (state.filters.parameter.매매전세) {
	...생략
}

 

필터 데이터를 날리면 오류가 발생할 것이다.

이 점에 대해서는 좀 더 고민이 필요하다.