자, 지금까지 Flux Architecture에 대해서 배웠습니다.
그리고 Redux는 Flux를 실제로 구현한 라이브러리라는 것도 배웠죠.
지금부터는 Flux 패턴이 녹아있는 Redux의 세 가지 원칙에 대해서 배워보도록 하겠습니다.

Redux에 대해서 제대로 이해하기 위해서는 이 Three Principles라고 불리는 Redux의 세 가지 원칙에 대해서 확실하게 이해하고 있어야 합니다.
이 원칙들은 굉장히 중요하기 때문에, 제대로 이해가 될 때까지 꼭 여러번 반복해서 보기 바랍니다.

1.3.1 Single source of truth

먼저 첫 번째 원칙은 Single source of truth입니다.

한국어로 번역해보면 단 하나의 진실의 원천이라는 뜻이죠.
진실이라고 여겨지는 값이 여러곳이 아닌, 단 한 곳에만 존재해야 한다는 의미입니다.

Redux에서는 애플리케이션의 모든 상태들을 Redux Store라고 불리는 곳에 저장합니다.
그리고 이 Redux Store가 바로 Single source of truth가 됩니다.

이렇게 source of truth가 단 하나가 되면 생각보다 많은 문제들이 간단하게 해결됩니다.
예를 들면 어떤 상태의 값이 내가 원하는대로 변경이 되는지 확인이 필요할 때,
이 Store 내부에서 해당 상태의 값이 어떻게 변하는지만 확인을 하면 됩니다.

그리고 뒤에서 더 자세히 다루겠지만, 상태의 변화 조차도 한 줄로 직렬화시켜서 상태의 변화를 일목요연하게 살펴볼 수 있으며, 이전 값으로 되돌리거나 상태 변경을 하나씩 해보면서 디버깅도 쉽게 할 수 있습니다.

1.3.2 State is read-only

Redux의 두 번째 원칙은 State is read-only입니다.
한국말로 번역하면 상태 값은 읽기 전용이어야 한다는 뜻이죠.

앞에 나온 첫 번째 원칙에 따라 모든 상태의 값은 하나의 Source of truth에 저장됩니다.
그리고 여기서 필요한 상태의 값을 읽어서 사용하게 되는데, 상태값을 읽을 수만 있고 변경할 수는 없습니다.
만약 외부에서 이 상태값을 맘대로 변경할 수 있게 된다면, Single source of truth가 가지는 의미가 없게 되겠죠.

그렇다면 어떻게 상태를 변경할 수 있을까요?

이 부분에 대해서는 뒤에서 더 자세히 다루겠지만, 쉽게 말하면 사전에 미리 정의해둔 어떤 상황이 발생했을 경우에 사전에 정해진대로만 상태를 변경할 수 있습니다.
여기서 중요한 것은 상태를 변경할 상황과 변경될 규칙에 대해서 사전에 미리 정의를 해둔다는 것입니다.
이 규칙에 어긋나는 형태로는 상태 값을 변경할 수 없습니다.

이렇게 상태를 변경할 상황과 변경될 규칙을 사전에 정의해두면 상태를 직접 변경할 수 없을뿐만 아니라, 상태를 변경할 때마다 어떤 목적과 어떤 값으로 상태를 변경하는지 한 눈에 쉽게 파악할 수 있습니다.
왜냐하면 모든 상태의 변화가 단 한 곳. 즉, Single source of truth인 Redux Store에서 정해진 상황과 규칙에 따라서 일어나기 때문입니다.
그리고 이러한 모든 상태의 변화는 redux-devtools를 사용해서 자세히 확인할 수 있습니다.

1.3.3 Changes are made with pure functions

Redux의 세 번째 원칙은 Changes are made with pure functions입니다.
한국어로 번역해보면, 변화는 순수 함수들을 통해 이뤄져야 한다는 뜻입니다.

이 말을 이해하기 위해서는 먼저 Pure Function에 대해서 알고 있어야 하겠죠?
여기서 잠시 자바스크립트 함수의 속성에 대해서 짚고 넘어가 보도록 하겠습니다.
다음 코드를 한 번 보겠습니다.

여기에 sum()이라는 이름을 가진 함수가 하나 있습니다.
이 함수는 a와 b라는 두 개의 파라미터를 받아서 그 둘의 합을 리턴하는 함수입니다.

function sum(a, b) {
    return a + b;
}

이 함수에서는 a와 b라는 파라미터의 값을 변경하지 않고 있습니다.
그리고 a와 b라는 파라미터 집합의 값이 같은 경우에는 항상 같은 값을 리턴할 것입니다.

우리는 이러한 함수를 Pure하다 라고 합니다.
말 그대로 함수가 순수하다는 뜻인데, 이 말은 입력값을 변경하지 않으며, 같은 입력값에 대해서는 항상 같은 출력값을 리턴한다는 의미입니다.

그렇다면 함수가 순수하지 않은 경우도 한번 살펴볼까요?

function withdraw(account, amount) {
    account.total -= amount;
}

여기에 withdraw()라는 함수가 있습니다.
이 함수는 account와 amount라는 파라미터를 받아서 account의 total이라는 값에서 amount를 빼는 함수입니다.
쉽게 이야기하면 계좌에서 출금을 하는 함수인데, 은행 계좌 정보와 총액을 파라미터로 받아서 계좌의 현재 총 잔액을 나타내는 total에서 출금할 금액인 amount를 빼는 것입니다.

자, 여기에서 이 함수는 입력으로 받은 파라미터 account의 값을 변경했습니다.
이런 경우 우리는 Impure하다 라고 합니다. 순수하지 않다는 뜻이죠.

이미 제 리액트 강의를 들은 분들은 알고 있겠지만, 모든 리액트 컴포넌트는 Pure Function처럼 작동해야 합니다.
즉, 모든 리액트 컴포넌트는 Props를 직접 바꿀 수 없고, 같은 Props에 대해서는 항상 같은 결과를 보여주어야 한다는 뜻이죠.

다시 Redux로 돌아와서, Redux에서 상태의 변화는 모두 Pure function을 통해 이뤄져야 한다고 했습니다.
쉽게 말하면, 상태의 변화를 일으키는 모든 함수는 입력값(input)을 변경하지 않으며, 같은 입력값에 대해서는 항상 같은 출력값(output)을 리턴해야 한다는 뜻입니다.
여기서 상태의 변화를 일으키는 함수를 Reducer라고 부르는데, 모든 Reducer는 Pure function이어야 한다는 뜻이기도 합니다.
Reducer에 대해서는 뒤에서 자세히 배울 예정이기 때문에, 일단 여기서는 상태의 변화를 일으키는 함수라고만 이해하기 바랍니다.

이 그림처럼 Reducer는 이전 상태에 정해진 어떤 변화를 준 뒤에 다음 상태를 리턴하게 됩니다.
이 과정에서 Pure function처럼 작동한다는 것은, 입력으로 받은 이전 상태를 직접 변경하는 것이 아니라 새로운 상태 객체를 만들어서 리턴한다는 것이며, 또한 같은 입력에 대해서는 항상 같은 결과를 리턴한다는 뜻입니다.

Redux를 사용하다보면 상태에 변화를 주어야 할 경우가 아주 많이 생기게 됩니다.
그 말은 그만큼 많은 Reducer들을 만들어야 한다는 뜻입니다.
그리고 이런 수많은 Reducer들이 항상 정해진대로 역할을 잘 수행하게 하기 위해서는, Pure function이 되어야 한다는 것이 바로 Redux의 세 번째 원칙입니다.

---

이제 지금까지 살펴본 Redux의 세 가지 원칙들에 대해서 다시 한 번 정리해보도록 하겠습니다.

먼저 첫 번째 원칙은 Single source of truth.
즉, 진실의 원천은 단 하나여야만 한다는 것이었죠.
그리고 Redux에서는 이 진실의 원천이 바로 Redux Store라는 것도 말씀드렸습니다.

그리고 두 번째 원칙은 State is read-only입니다.
상태값은 읽기 전용이며 맘대로 바꿀 수 없다는 것이었죠.

마지막으로 세 번째 원칙은 Changes are made with pure functions입니다.
상태의 변화는 모두 pure function을 통해 이뤄져야 한다는 것이었죠.
그리고 이렇게 상태의 변화를 일으키는 pure function을 Reducer라고 부른다는 것도 함께 설명했습니다.

이 Redux의 세 가지 원칙은 굉장히 중요한 부분이기 때문에 꼭 외워두시고,
혹시 이해가 잘 안 된다면 이해가 될 때까지 반복적으로 학습하기 바랍니다.