2025 · 07 · 106 min lettura

Come progetto l'API dei componenti React

Un componente ben progettato è facile da usare correttamente e difficile da usare in modo sbagliato. Questo principio guida tutte le mie decisioni sull'API.

ReactComponent

Il primo principio: i props devono riflettere il dominio, non l'implementazione. Un componente Button non dovrebbe avere un prop isGreenBackground — dovrebbe avere variant='primary'. Il consumatore pensa al significato, non all'aspetto. Questo permette di cambiare l'implementazione visiva senza rompere l'interfaccia.

Il secondo principio: preferire la composizione all'configurazione. Invece di un componente Card con 15 props per ogni possibile variante, preferisco un componente Card con slot (header, body, footer tramite children). Il consumatore compone il contenuto, il componente fornisce solo la struttura e lo stile. Questo è infinitamente più flessibile.

Il terzo principio: rendere gli stati espliciti. Non usare string come type='success' quando puoi usare isSuccess boolean o meglio ancora uno stato enum. Gli string sono aperti, i boolean e gli enum sono chiusi. TypeScript può verificare a compile time che stai usando un valore valido, lo string no.

▞ ▚ ▞ ▚ ▞ ▚ ▞ ▚ ▞ ▚ ▞ ▚ ▞ ▚ ▞ ▚ ▞ ▚ ▞ ▚
GENBOT by @gengiord
Assistente AI · risponde a domande sul portfolio
Ciao! Sono GenBot :)
Come posso aiutarti?