Làm thế nào để áp dụng SOLID trong dự án Next.js/React thực tế?

Trong React/Next.js, SRP áp dụng cho component (mỗi component một trách nhiệm), custom hook (tách logic ra khỏi UI), và service layer (tách API call ra file riêng). OCP áp dụng qua component composition và render props/children thay vì if/else trong component. DIP áp dụng qua dependency injection pattern trong custom hook: useUserService(api: ApiClient) nhận API client từ ngoài thay vì hard-code.

Ví dụ thực tế: tách UserProfile thành UserAvatar, UserInfo, UserActions components (SRP); dùng AuthContext inject authService vào app (DIP); tạo useFormValidation(validators: Validator[]) nhận validators từ ngoài (OCP + DIP). SOLID trong frontend thường ít formal hơn backend nhưng nguyên tắc vẫn có giá trị tương đương.