Pattern con gli hook React che uso ogni giorno
Dopo anni di React, ho consolidato un set di pattern che uso in quasi ogni progetto. Non sono segreti, sono solo scelte deliberate che rendono il codice più leggibile e manutenibile.
Il pattern che uso di più è il custom hook per la logica di fetch. Invece di mettere useState + useEffect direttamente nel componente, estraggo tutto in un hook useFetch o useResource. Il componente riceve {data, loading, error} e non sa nulla di come i dati vengono recuperati. Questo rende il componente testabile in isolamento e la logica di fetch riutilizzabile.
Il secondo pattern fondamentale è il reducer per state complesso. Appena uno state ha più di 3 campi correlati o le transizioni diventano condizionali, passo da useState a useReducer. Il reducer rende esplicite le transizioni di stato e rende impossibile arrivare in stati inconsistenti. Un reducer ben scritto si documenta da solo.
Il terzo è il pattern di composizione con children. Invece di passare tutti i props in profondità, uso il context o i children per evitare prop drilling. Ma uso il context con parsimonia — solo per dati che cambiano raramente o che servono davvero a molti livelli. Il context non è un sostituto del buon design dei componenti.