Khi nào nên sử dụng useMemo và useCallback trong React?

React cung cấp cho chúng ta 2 hooks là useMemo và useCallback, chúng rất hữu ích khi bạn xử lý với những hoạt động phức tạp, tốn nhiều thời gian và tài nguyên của ứng dụng. Nếu trong React component của bạn có chứa những hoạt động tốn tài nguyên (expensive operation), mỗi lần component …
Đọc tiếp Khi nào nên sử dụng useMemo và useCallback trong React?

React Redux: Giới thiệu Redux Thunk.

Ở bài viết trước chúng ta đã biết được Redux middleware là gì, và vấn đề gặp phải với lỗi: “Error: Actions must be plain objects. Use custom middleware for async actions” khi chúng ta cần xử lý các action bất đồng bộ như lấy dữ liệu từ API. Link bài viết trước mọi người có thể …
Đọc tiếp React Redux: Giới thiệu Redux Thunk.

Redux Toolkit: Tìm hiểu createSlice

Tiếp theo bài trước, mình sẽ giới thiệu chi tiết hơn các API cơ bản của Redux-Toolkit để chúng ta có thể tạo được 1 flow hoàn chỉnh của Redux. Redux Module Trong Redux, 1 module hoàn chỉnh bao gồm: Store, Actions và Reducer, thông thường các bạn sẽ chia viết từng phần trong các …
Đọc tiếp Redux Toolkit: Tìm hiểu createSlice

Tư duy của React Hooks

React Hooks những năm 2022 khi mình viết bài viết này gần như đã trở thành 1 kĩ năng “must to have” đối với các lập trình viên Frontend React. Các bạn có thể đọc tài liệu chính thức về Hook trên trang chủ của React: https://reactjs.org/docs/hooks-intro.html. Trong bài viết này, mình chỉ nói 1 …
Đọc tiếp Tư duy của React Hooks

Những khái niệm cơ bản nhất về React

Đôi khi anh em lập trình code quá nhiều, join ngay vào project mà quên mất những khái niệm cơ bản nhất. Những khái niệm cơ bản như JSX, Components, Props, State, Fragment, … rất quen thuộc với mọi người nhưng đôi khi khó để định nghĩa hay trả lời 1 cách chính xác, nhất …
Đọc tiếp Những khái niệm cơ bản nhất về React

Giới thiệu về Redux-Toolkit

Redux là 1 state management phổ biến trong hệ sinh thái React, nếu các bạn code React thì khả năng cao đã từng làm việc với Redux, kinh qua nhiều project hoặc chí ít cũng đã từng biết đến nó rồi. Redux được phát triển từ những năm 2015 và được ưa chuộng phổ biến …
Đọc tiếp Giới thiệu về Redux-Toolkit

Memory Leaks, Làm thế nào để tránh trong ứng dụng React

Memory leak là gì? https://vi.wikipedia.org/wiki/R%C3%B2_r%E1%BB%89_b%E1%BB%99_nh%E1%BB%9B Theo Wikipedia, Memory leak (Rò rỉ bộ nhớ) là 1 loại rò rỉ tài nguyên xảy ra khi 1 chương trình máy tính quản lý không chính xác việc cấp phát bộ nhớ dẫn đến việc bộ nhớ đó không cần thiết nữa nhưng chưa được giải phóng (released). 1 …
Đọc tiếp Memory Leaks, Làm thế nào để tránh trong ứng dụng React

React Redux: Redux middleware là gì?

Để hiểu rõ hơn khái niệm Redux middleware, chúng ta cùng thử xử lý 1 bài toán như sau: Bạn cần phải ngăn chặn người dùng (users) không được sử dụng các từ khóa bị cấm (ví dụ như vl, vkl, cmnr, …) trong bài viết của họ. Để đơn giản thì mình sẽ xử …
Đọc tiếp React Redux: Redux middleware là gì?

Tạo Custom Hook để fetch dữ liệu

Trong bài viết này, mình sẽ giải thích cách để tạo 1 custom hook giúp cho việc fetch dữ liệu (thông qua API) và làm thế nào để chúng ta có thể tái sử dụng chúng trong các components khác nhau. Hooks là 1 khái niệm mới được React thêm vào từ phiên bản 16.8. …
Đọc tiếp Tạo Custom Hook để fetch dữ liệu