인프런 커뮤니티 질문&답변

안녕하세요 준석님 ㅎㅎ

flux패턴이 MVC 패턴의 단점을 보완하는 것으로 이해했습니다.

-> 네 맞습니다. 해당 패턴의 단점을 보완하죠 ㅎㅎ 하지만 단점 또한 있습니다.

Flux 패턴의 단점은 다음과 같습니다.

flux 패턴의 유명한 라이브러리 Redux를 예로 들면

import { createSlice, configureStore } from '@reduxjs/toolkit'

const counterSlice = createSlice({
  name: 'counter',
  initialState: {
    value: 0
  },
  reducers: {
    incremented: state => { 
      state.value += 1
    },
    decremented: state => {
      state.value -= 1
    }
  }
})

export const { incremented, decremented } = counterSlice.actions

const store = configureStore({
  reducer: counterSlice.reducer
})

// Can still subscribe to the store
store.subscribe(() => console.log(store.getState()))

// Still pass action objects to `dispatch`, but they're created for us
store.dispatch(incremented())
// {value: 1}
store.dispatch(incremented())
// {value: 2}
store.dispatch(decremented())
// {value: 1}

앞의 코드와 같이 dispatch를 기반으로 state를 변경해야마 하고 중앙집중식 상태관리로 state를 관리하는 모습을 볼 수 있습니다.

단순히 state를 -1, +1 하는건데도 굉장히 복잡하죠?

즉, 단순한 기능에 있어서 action, dispatcher, state(store) 등 여러 모듈이 필요해서 복잡성이 커진다는 단점, 그 복잡성 때문에 초기설정에서의 번거로움, 모든 상태값을 중앙집중식 상태관리로 넣게 되면 디버깅이 오히려 어려워진다는 단점이 있습니다.

예를 들어 추후 비즈니스로직이 변경되었을 때 단순히 props로 부모 -> 자식컴포넌트로 넘긴다면 쉽게 해당 부분을 지우면 될 것을 flux패턴의 경우 비대해진 중앙상태관리에서 어떤 것을 삭제해야할지 고민되는 상황이 발생됩니다.

mvc패턴이 그럼에도 불구하고 좋아서 배우는 건가요?

-> 네 맞습니다. 이렇게 생각하시면 쉬워요. 모든 디자인 패턴에는 장점과 단점이 있습니다. 그런 거를 검토해보고 어떤 프로젝트를 할 때 아 이런 프로젝트를 할 때는 이 디자인패턴이 적합하곘구나.. 하면서 해당 디자인패턴을 도입하는 것이죠.

MVC패턴이 단점도 가지고 있지만 장점 또한 뚜렷합니다. 관심사 분리부터 시작해 재사용성 향상 등 장점이 많아서 Django, Spring, Rails 등 기존 프레임워크들이 MVC 구조 기반으로 많이 쓰인다고 보시면 됩니다.

또 질문 있으시면 언제든지 질문 부탁드립니다.

좋은 수강평과 별점 5점은 제게 큰 힘이 됩니다. :)

감사합니다.

강사 큰돌 올림.

안녕하세요, 인프런 AI 인턴입니다. 준석님!

Flux 패턴은 React.js 개발 초기부터 제안된 아키텍처로, 단방향 데이터 흐름을 특징으로 합니다. Flux는 MVC 패턴의 복잡성을 해결하기 위해 도입된 패턴으로, 특히 대규모 애플리케이션에서 데이터 관리와 상태 관리를 보다 직관적으로 만들기 위해 설계되었습니다.

Flux 패턴의 단점

Flux의 주된 단점으로는 다음을 들 수 있습니다:
1. 복잡성 증가: Redux와 같은 구현체를 도입하면서, 비록 구조가 명확해졌지만 새로운 개발자에게는 러닝 커브가 생깁니다.
2. 많은 코드량: Redux와 함께 사용할 경우 액션과 리듀서의 개념이 도입되면서 코드의 복잡성이 증가합니다.

MVC 패턴의 장점

반면 MVC 패턴은 오랜 테스트와 실무 사용을 통해 검증된 패턴으로, 다음과 같은 장점이 있습니다:
1. 명확한 분리: 모델, 뷰, 컨트롤러로 구성된 아키텍처로 인해 각각의 컴포넌트가 명확하게 분리되어 관리가 쉬워집니다.
2. 재사용성: 컴포넌트 기반으로 구성되어 새로운 기능을 추가하거나 변경할 때 재사용이 용이합니다.

실무에서 MVC를 여전히 사용하는 이유는 이와 같은 구성이 익숙하고, 비교적 작은 규모에서 강력한 효율성을 발휘하기 때문입니다. 특히 레거시 시스템에서, 그리고 백엔드 기술 스택에서도 MVC의 사용은 아직 매우 일반적입니다.

관련하여 더 자세한 내용을 알고 싶으시다면 아래 링크를 참고하시면 좋습니다:
- React로 구현한 MVC 패턴 사례
- Flux 패턴과 Redux의 차이

저는 질문자님의 이해를 돕고자 지식공유자님의 기존 답변을 참고하여 유사한 답변 링크를 추천해드리고 있습니다.
현재 베타 기능으로 답변이 만족스럽지 않을 수 있는 점 양해 부탁드립니다. 🙏
추가적으로 궁금한 점이 있으시면, 이어서 질문해 주세요. 곧 지식공유자께서 답변해 주실 것입니다.