[Redux]

redux가 동작하는 전체적인 흐름 state : 리덕스에서 저장하고 있는 상태 값(데이터) render : state를 기반으로 화면에 렌더링한다. dispatch : dispatch가 subscribe에 등록된 구독자(함수)들을 모두 호출한다. store에 있는

리덕스는 애플리케이션의 상태를 관리하기 위한 오픈소스 자바스크립트 라이브러리이다.대표적으로 리액트에서 많이 사용되지만 리액트만을 위한 라이브러리는 아니며 다른 환경에서도 사용할 수 있다.리액트에서 사용하는 상태관리 라이브러리에는 Redux, MobX, Apollo-Cl

리덕스의 구성요소 Store : 리덕스의 데이터들을 저장하기 위한 저장소 State : 리덕스 Store에 저장되어 있는 데이터 Action : Store에 저장된 데이터(State)에 변화를 주기 위한 행동 Action Creator : Action을 생성하는 생성

Store 리덕스 Store는 리덕스의 데이터들을 저장하기 위한 저장소이다. > State management vs State persistence State management는 상태를 보관하는 것이 아니라 관리하기만 하는 것이고, State persistenc

Reducer Action이 발생하면, Action을 실제로 처리하는 역할을 하는 함수 (Action은 State에 변화를 주기 위한 행동이다. 따라서, Reducer는 State에 변화를 주는 역할을 한다.) Reducer는 현재 state를 기반으로 새로운 st

Container Container는 Redux를 리액트에 연동했을 때 사용하는 개념이다. (Redux에는 Container라는 개념이 없음) 여기서 Container는 Container Component의 줄임말이며, 컴포넌트는 리액트 컴포넌트를 의미한다. 결국

Duck file 액션 타입(Actions), 액션 생성 함수(Action Creators), 리듀서(Reducer), 그리고 Side Effects까지 모아놓은 파일을 의미한다. Duck file들로 리덕스에 필요한 요소들을 관리하는 것을 덕스(Ducks) 패턴이라

FSA (Flux Standard Action) Flux 아키텍처의 Action 객체를 위한 하나의 표준 Action 객체에 표준화된 규칙을 적용해서 체계적으로 관리하기 위한 목적 FSA가 적용된 Action 객체 규칙 Action은 반드시 일반적인 자바

Async 로직 동기(sync) 방식에서는 리듀서에서 액션에 대한 처리가 모두 끝나고, 리덕스 스토어에 들어있는 State가 업데이트 된 이후에 프로그램의 흐름이 이어진다. 반면, 비동기(Async) 방식에서는 리듀서에서 액션에 대한 처리가 모두 끝나기 전에, 프로

리덕스에서는 기본적으로 액션 객체를 디스패치 한다.하지만 thunk 미들웨어를 사용하면 객체 대신 함수를 생성하는 액션 생성함수를 작성할 수 있게 해준다.이러한 동작 방식을 활용하여 Redux에서 비동기적인 프로그래밍을 구현할 수 있다.예전에는 액션 생성함수에서 위와

thunk가 함수를 디스패치 할 수 있게 해주는 미들웨어였다면, saga는 액션을 모니터링 하고 있다가 특정 액션이 발생했을 때, 미리 정해둔 로직에 따라 특정 작업이 이루어지는 액션에 대한 리스너이다.여기서 특정 작업이란, 특정 자바스크립트 코드를 실행하는 것일 수도