Redux là gì? Redux Toolkit là gì? Hãy tìm kiếm câu trả lời trong bài viết dưới đây nhé!

Redux – Redux Toolkit là gì
“Redux is a predictable state container for JavaScript apps. – Redux.js.org”. Redux là 1 thư viện được viết dành cho các ứng dụng sử dụng Javascripts . Redux đóng vai trò như 1 “thùng chứa – state container” có khả năng lắng nghe, dự đoán các sự kiện thay đổi của các thành phần được đăng kí trong “state container”
Hoặc có thể hiểu: Redux là một công cụ giúp quản lý dữ liệu trong ứng dụng JavaScript một cách dễ dàng và có tổ chức. Hãy tưởng tượng Redux như là một cái hộp, trong đó tất cả dữ liệu (trạng thái) của ứng dụng bạn được lưu trữ ở một nơi. Bất cứ khi nào bạn muốn thay đổi dữ liệu đó, bạn phải gửi một thông điệp (gọi là “action”) vào hộp, và cái hộp này sẽ quyết định cách cập nhật dữ liệu dựa trên thông điệp đó theo một quy tắc nhất định (được gọi là “reducer”). Điều này giúp cho việc quản lý trạng thái ứng dụng trở nên dễ dàng và minh bạch, ngay cả khi ứng dụng của bạn phát triển lớn và phức tạp.
Redux Toolkit là gì?
Redux Toolkit là một công cụ được thiết kế để đơn giản hóa quá trình phát triển với Redux. Redux Toolkit cung cấp một tập hợp các API tiện lợi để cấu hình store, xử lý middleware, tạo reducers và actions, giúp bạn viết code ít hơn nhưng vẫn giữ được tất cả lợi ích mà Redux mang lại.
Các thành phần chính của Redux
1. Store
- Store là một đối tượng chứa toàn bộ trạng thái (state) của ứng dụng. Trong Redux, có một store duy nhất chứa toàn bộ trạng thái của ứng dụng, giúp quản lý trạng thái trở nên dễ dàng và nhất quán.
- Store cung cấp các phương thức để truy cập trạng thái, cập nhật trạng thái thông qua việc gửi actions, và đăng ký listeners.
2. Actions
- Actions là các đối tượng JavaScript mô tả sự thay đổi trạng thái. Mỗi action có một type field mô tả loại hành động đang được thực hiện, và có thể chứa thêm dữ liệu khác cần thiết để cập nhật trạng thái.
- Actions là cách duy nhất để gửi dữ liệu từ ứng dụng vào store. Chúng không thực sự thay đổi trạng thái; chúng chỉ mô tả ý định thay đổi trạng thái.
3. Reducers
- Reducers là những hàm thuần (pure functions) nhận vào trạng thái hiện tại và một action, sau đó trả về trạng thái mới. Reducers quyết định cách trạng thái sẽ thay đổi dựa trên action nhận được mà không gây ra bất kỳ thay đổi nào bên ngoài.
- Reducers phải là pure functions, tức là chúng không thay đổi trạng thái hiện tại mà trả về một đối tượng trạng thái mới.
4. Middleware
- Middleware là một lớp phần mềm trung gian cho phép bạn viết logic mã nguồn mở có thể được chạy trước khi actions đến reducers.
- Middleware thường được sử dụng để xử lý logic bất đồng bộ, ghi log, gửi crash report, thực hiện các tác vụ mà không làm thay đổi trạng thái trực tiếp.

Giảng viên: Nguyễn Hữu Huy
Bộ môn Công nghệ thông tin
FPT Polytechnic Hà Nội

