Redux 구성 store 저장소 전역상태를 보관하는 곳 reducer 상태를 변경하는 로직이 담긴 함수 이전 상태와 액션을 받아 새로운 상태를 반환한다. action 상태 변화를 일으키는 객체 type 필드로 어떤 종류의 액션인지 구분 액션 생성자 : 액션을 생성하는 함수 dispatch 액션을 실행하여 리듀서에게 상태 변화를 요청하는 함수 액션 객체를 인자로 받아 리듀서에 전달 동작 액션을 디스패치 리듀서가 그 액션을 처리하여 새로운 상태를 반환 이 상태는 저장소에 저장 ↪ 이로써 애플리케이션의 상태를 중앙에서 효과적으로 관리할 수 있다. Redux Thunk Redux에서 비동기 작업을 처리하기 위한 미들웨어 중 하나 액션 생성자가 일반 객체뿐만 아니라 함수도 반환할 수 있게 되어, 비동기 작업을 ..

useReducer 필요성 초반에 배우는 리액트는 대부분 app 컴포넌트 내에서 useState를 이용해 상태 변화 처리 함수를 사용한다. ✨ 상태 변화 처리 함수의 대표적인 예 : onCreate, onEdit, onRemove 하지만 규모가 점점 커지고 처리 내용이 많아질 수록 컴포넌트가 무거워지고 비효율적이다. 따라서 상태 업데이트 로직을 컴포넌트에서 분리, 즉 컴포넌트 외부 혹은 다른 파일에 작성할 수 있도록 하는 것이 useReducer. 사용법 useReducer는 리덕스의 로직과 흡사하다. 👇 2022.08.01 - [코딩공부] - [Redux] 리덕스의 필요성과 구성 요소, 작동 원리 reducer 그렇기에 reducer 함수가 꼭 필요하다. recuder : 현재 상태와 액션 객체를 인자..

리덕스 어플리케이션의 state를 관리하기 위한 JavaScript 오픈소스 라이브러리. 리덕스 이전에는 양방향 데이터 흐름으로 프로젝트가 커질수록 불편과 혼란을 야기 트렌드나 관리가 복잡해짐에 따라 단방향 데이터 흐름이란 특징을 갖는 flux를 개발 React + flux 구조에 reducer를 추가하여 리덕스 탄생. 리덕스가 필요한 이유 리덕스가 없을 때의 코드는 컴포넌트끼리 강하게 커플링(의존)되어있다. 그래서 있다고 기대하며 작동했는데 해당 내용이 없는 경우에 에러가 발생한다. 리덕스는 중개자 역할로 상태를 중앙집중적으로 관리할 수 있다. 리덕스 구성요소 store : 정보가 저장되는 곳. 전역적으로 호출 가능 ex)은행 state : 실제 정보. readonly 이어야함. ex) 돈/장부 red..