Page History

Redux는 React Native 를 개발하는 데, 좋은 아키텍쳐 패턴으로 알려져 있죠.

...

RX패러다임 → RxAndroid, RxJava, ReactiveCocoa, React Native …

* RxAndroid : 사운드클라우드(SoundCloud)의 마티아스 캐플러스와 안드로이드 씬의 영웅 스퀘어의 제이크 와튼(Jake Wharton) 중심으로 만들어진.. * RxJava : 넷플릭스가 주축이 되어 자바에 포팅한..* ReactiveCocoa : 깃헙(GitHub)과 페이스북(Facebook) 엔지니어들이 중심이 되어 이끌어 나가고 있다고 하나요..* React : 사용자 인터페이스를 만들기 위한 자바스크립트 라이브러리 이죠~. 페이스북과 인스타그램 소속 개발자들이 만들고 있으며, 2013년 처음 공개됬죠...* React Native (리엑트 네이티브)는 리액트의 접근 방법을 모바일로 확장하는 페이스북의 오픈소스 프로젝트 입니다...그 외..... 

이렇게 확장되어가는 중에…..

Reactive → (facebook) → React, Flux design petten

...

Redux는 Flux에서 파생되었기 때문에, Flux를 알아보면 Redux를 이해하는 데 도움이 될 것 같습니다. Redux와 비슷한 내용이지만, 간단히 적어보면..

앱의 상태값들이 store에 유지가 되고, 이벤트가 발생하면 dispatcher를 통해 action이 상태를 변화시킵니다.
상태 변경을 listening 하고 있다가 변경되면 View는 다시 랜더링 합니다.

단방향으로 이벤트 흐름이 잘 흘러가는 것 같습니다. 후훗..

...

Redux를 간단히 설명해 보자면 아래와 같습니다.

Redux는 앱의 상태 모두를 하나의 store안에 트리 구조로 저장합니다. 그 스토어를 변경시키는 것은 action (들) 뿐입니다.action이 어떻게 (How) 변경시켜야 하는 지는 reducer(들)가 정의합니다.화면(View)들은 실제 화면을 표현하고, 내부 구성의 명칭은 중요하진 않겠지만 component들을 담는 것을 Container(들) 이라 지칭하겠습니다.Container(들)은 Store의 상태값이 변화되는 지 구독하고(subscribe, subscript) 있는 데, redux에서는 props에 담아 넘겨줍니다. Props에 selector(들) 하고 있습니다.props에 담아 넘겨준다는 것을 조금 더 상세하게 설명드리면,
Container 의 화면에서는 사용하기 위해 props에 state를 map 하는 과정이 진행됩니다.그리고 화면의 메인스레드 런루프에서 클릭등 이벤트가 발생해서 변경요청을 하면, 

Container에서 action을 보내는 데, 그것을 dispatch action이라 합니다.
action을 dispatch하는 거죠....추가적으로 state를 변경하기 위해 비동기 처리를 하는 경우가 있는 데 보통 대표적인 것이 네트워크 처리 이죠? 물론 그게 아니더라도 보통 비동기 처리를 하는 것이 대부분 일 것 같기도 합니다. 이렇게 비동기 처리를 위해 action과 reducer 사이에 middleware를 둡니다.그 때 미들웨어에 thunk(들)과 saga (들).. 등 이(가) 있습니다.

한번에 후루룩 적었네요.

내용을 한줄이나 순서대로 ….

...

스토어(Store)에는 전체 상태의 구조를 유지하기 위해.. 
변화시키며, 변화 시킬 데이터 구조를 가지고 있는 reducer(들)과 추가로 필요한 상태 트리구조 정보 또는 기타 변화시키는 역활을 담당하는 미들웨어 정보를 가지고 생성합니다.

     const store = createStore( 
        reducers,
        applyMiddleware(
            ..
        ), 
     );.. 셈플소스 링크는 제일 아래에 있습니다. :)

다음 Step으로

그 스토어를 변경시키는 것은 action (들) 뿐입니다.

...