Componenti come funzioni

May 11th, 2019 - 1 min read

Come ho raccontato nel mio primo post, sono tornato a guardare nel campo di React per capire che cosa è successo in questi anni. Nel 2015 - nel pieno della "moda" - ho creato una piccola app con React e Firebase. Tutti i componenti utilizzavano React.createClass(), lo stile era piuttosto verboso e aveva molti elementi in comune con altre librerie che stavo guardando all'epoca come VueJs e Polymer.

Tempo dopo, ho imparato a capire che le cose in React si muovono velocemente. Non in React per dire la verità, ma in JavaScript. No, JavaSscript non è React, ma React è 100% JS. Ne utilizza tutte le possibilità, le novità, le funzionalità.

Insomma, gli anni passano, io mi specializzo in VueJs che ancora oggi amo, buttando continuamente l'occhio dell'altra parte della rete. Vedo passare "Classi" e una sintassi che ancora capisco. Finchè un giorno su twitter comincio a leggere di "Hooks". Cosa diavolo saranno? Addirittura leggo che qualcuno li usa anche se non sono nel "core" di React.

Così mi metto alla ricerca per cercare di capirci qualcosa, e qui arriva il momento serendipity, la scoperta che non ti aspettavi ma più importante di tante altre, questo semplice pezzo di codice:

function Welcome(props) {
  return <h1>Hello, {props.name}</h1>;
}

Semplice e incredibilmente pulito. Qualcosa mi è scattato in testa, tutto va improvvisamente al proprio posto. I componenti sono "solo" delle funzioni che ricevono "props" e restituiscono html! Potrà sembrare banale, ma per me è una rivoluzione.

Hooks let you use state and other React features without writing a class. You can also build your own Hooks to share reusable stateful logic between components.

© 2020 Marco Bonomo