Custom Hook là gì và tại sao chúng ta nên sử dụng nó?

Custom Hook là một hàm JavaScript thông thường, nhưng tên của nó bắt đầu bằng use và nó có thể gọi các Hook khác của React bên trong nó (như useState, useEffect, useContext, v.v.).

Tại sao nên sử dụng Custom Hook?
- Tái sử dụng Logic: Cho phép bạn trích xuất logic có trạng thái (stateful logic) từ một component để có thể tái sử dụng nó trên nhiều component khác nhau một cách độc lập.
- Giữ cho Component sạch sẽ: Component chỉ nên tập trung vào việc render UI. Tách logic phức tạp vào Custom Hook giúp code dễ đọc và dễ bảo trì hơn.
- Kiểm thử dễ dàng hơn: Logic được đóng gói trong một hàm độc lập (hook) có thể được test riêng biệt.

Ví dụ: Thay vì viết logic fetch API lặp đi lặp lại ở nhiều nơi, bạn có thể tạo một hook useFetch(url) trả về { data, loading, error }.