Inside the src folder, we create a redux folder and inside that folder, we create 2 files: store.js for our store and stories.js for our stories reducer. So we need the “react-redux” package to connect React components with the Redux store. Let’s start by installing what we will need to add redux to our application using the npm i -D react-redux can be used with other view libraries. If you have followed the instructions above, then you should have a web page open showing my favorite articles and we will continue from there. The complete folder has the completed project and the with createSlice folder has a version of the project that uses slices. The starter folder contains a simple create react app where I have removed the unnecessary stuff and hard-coded a list of my favorite stories on medium. git clone cd redux-toolkit/ cd starter/ npm install npm start

State trả về là một đối tượng (Object) mới chứ không phải là State Object cũ đã được thay đổi một vài thuộc tính.To follow along, you can clone this project and navigate into the starter folder. Muốn thay đổi State của ứng dụng thì phải sử dụng pure function.State Object chỉ được đọc chứ không được phép trực tiếp thay đổi các thuộc tính bên trong nó.Điều này giúp cho hệ thống dễ quản lý và bảo trì hơn. Chỉ có 1 State Object, không có State Object thứ 2.subscribe(listener) registers a function to be called on state changes.getState() returns the current state of the store.dispatch(action) is the base dispatch function described above.

Reducer (Dispatch Function) là function nhận vào Action, sử lý sau đó trả về là một State Object mới.In the command line let’s go to the parent directory of where we want to create our app then run the following: create-react-app my-react-todolist. Then install the create-react-app package globally: npm install -g create-react-app. Action là một đối tượng có chứa Action Type và các data cần thiết để thay đổi State Object. Make sure you have the latest node and npm installed.Trạng thái của ứng dụng/hệ thống sẽ được lưu vào một đối tượng duy nhất gọi là State Object. this is a react todo app using redux for state management.

Redux có thể được dùng chung với nhiều Javascript framework khác như AngularJs chứ không riêng gì ReactJs.Redux là thư viện dùng để quản lý trạng thái của ứng dụng/hệ thống.

Github redux react todolist