Luồng dữ liệu trong Redux React

Redux là 1 pattern được dùng rất phổ biến hiện tại nhằm giải quyết vấn đề quản lý global state trong React, React Native (cũng được dùng nhiều trong các ngôn ngữ, thư viện khác).

Redux hình thành với 3 nguyên tắc cơ bản trong việc quản lý state:

  1. Tất cả các trạng thái của ứng dụng đều được lưu trữ từ 1 kho (được gọi là store)
  2. Các trạng thái đều phải và chỉ là read-only (tức là chỉ đọc, ko được phép cập nhật)
  3. Các thay đổi phải thông qua các pure functions (hàm thuần – tức là kết quả đầu ra chỉ phụ thuộc vào giá trị đầu vào)

Luồng dữ liệu (Data Flow) trong Redux sẽ được thực hiện như dưới hình sau:

Trong đó:

  • Store là nơi sẽ lưu giữ tất cả các biến state (global state)
  • UI (View) sẽ lấy các giá trị state từ store để hiển thị
  • UI View không trực tiếp cập nhật giá trị đến store mà phải thông qua các action
  • Action được thực hiện, gửi dữ liệu mới đến cho reducer thực hiện việc update state data vào trong store

Check validate Email trong JavaScript

Check validation email đầu vào là bài toán rất phổ biến, sử dụng để bắt validate form gửi lên ở phía client. Có khá nhiều tiêu chí ràng buộc với 1 email: Trong JavaScript, các bạn có thể sử dụng regex (biểu thức chính quy) để viết function check validate email. Dưới đây là 1 … Read more

Các template view trong React Native

Một số bộ UI Component Kit cho React Native phổ biến: React Native Element là một thư viện giao diện người dùng (UI library) được xây dựng để hỗ trợ phát triển ứng dụng React Native một cách nhanh chóng và hiệu quả. Nó cung cấp một bộ sưu tập các thành phần UI đã … Read more