React: una delle librerie più importanti per lo sviluppo di applicazioni Web, basata su javascript html e CSS

Facebook l’ha sviluppata. Tutti ne parlano. Noi non potevamo mancare al ReactJSDay per approfondirne i nuovi paradigmi di sviluppo e le best practices.
Prima di raccontarvi le incredibili novità che sono state presentate al ReactJSDay 2019 facciamo, però, una veloce panoramica su React.

Cos’è React? 

È una libreria Javascript, sviluppata nei “laboratori” di Facebook, utilizzata per creare interfacce utente.
React semplifica la realizzazione di applicazioni web dinamiche a singola pagina (single-page web application) rendendo il loro sviluppo molto semplice e veloce. Le prestazioni sono incredibili: oltre ad essere estremamente veloce, la dimensione dei file della libreria è di circa 45KB.

React permette inoltre di realizzare app native per Android e iOS, grazie a React Native. React ad oggi è utilizzato dalle più famose aziende come AirBnB, Netflix, Paypal e Uber, per citarne alcune.

Numerosi gli speaker presenti al ReactJSDay 2019, provenienti dalle aziende più importanti della scena digitale, che hanno raccontato le loro esperienze, tra queste:

  • Il modo in cui React ha migliorato il loro flusso lavorativo
  • Come utilizzare gli Web Standards
  • Come il Design System e React sono complementari e molto utili se utilizzati con le corrette procedure di tipizzazione dati (vedi Typescript)
  • Come React può essere utilizzato per progetti di realtà aumentata 
  • Come progettare un’architettura mono-repository in modo da riuscire a costruire un insieme di componenti comuni. 

I componenti, appunto, sono la cosa più importante quando si parla di React. Quando si progetta in React bisogna pensare alla UI come una gerarchia di componenti; la caratteristica su cui si basa un componente è quella del “principio di singola responsabilità” che dice che un componente dovrebbe idealmente occuparsi di una cosa soltanto. Nel caso in cui un componente diventi troppo grande e complesso, dovrebbe essere decomposto in sotto-componenti più piccoli e semplici.

Kickstarting libraries of shared React components for multiple teams

Il primo Talk a cui abbiamo partecipato, di Surya Ambrose, raccontava infatti come è possibile risolvere lo scenario derivante dalla collaborazione di diversi team tecnici su un unico progetto, attraverso la creazione di un insieme di componenti comuni. Succede spesso che team diversi lavorino e ridisegnino componenti già sviluppati da altri team di programmatori. Un’architettura mono-repository è stata la soluzione per Surya Ambrose; servendosi di strumenti come Storybook, Lerna, React, Flow, Yeoman e di concetti quali Design Atomico e prestazioni, sono riusciti a fare la differenza.

Parallel computing in React

Majid Hajian, nel suo talk, ha spiegato come spesso ci si trovi, mentre stiamo sviluppando la nostra applicazione, a dovere fare i conti con i limiti della potenza del core della nostra CPU. L’applicazione si blocca, il computer si surriscalda. Ha spiegato come funzionalità moderne come Web Worker, WebAssembly, Worklets e Service Worker ci consentono di sfruttare il calcolo multithreading per eseguire attività in parallelo, alleggerendo il carico sulla CPU sfruttando le moderne API.
Ha mostrato la sua esperienza relativa al calcolo multithreading con progetti sviluppati in parallelo su un’applicazione React, in modo da fornire un’esperienza utente piacevole e uno sviluppo entusiasmante.

Reusing Stateful Logic in React: HOC vs Render Props vs Hooks

Matteo Frana ha raccontato la sua esperienza relativamente alla gestione delle logiche di stato in React. Ha spiegato con diversi esempi quando è meglio utilizzare HOC, quando invece è meglio Render Props e in alcuni casi Hooks. 

Potete approfondire l’argomento di questo talk molto tecnico leggendo questo interessante post su Medium:

Comparison: HOCs vs Render Props vs Hooks

How Typescript Can Power Design Systems

Isha Kasliwal ha raccontato come l’inclusione di React.js nei sistemi di progettazione ha contribuito a introdurre il concetto di programmazione funzionale. Ha raccontato la sua esperienza con Typescript e come usando Typescript nel suo sistema di progettazione è riuscita a progettare componenti con modelli di dati fortemente tipizzati.

Coding with Web Standards

Maurizio Mangione ci ha portati indietro nel tempo, fino all’anno 2000 dal quale è partito il suo racconto relativo agli standard Web e alla loro evoluzione, facendo diverse riflessioni sul fatto che sono strumenti che abbracciamo e che allo stesso tempo combattiamo quotidianamente, al motivo che ci spinge ad utilizzare correttamente i tag con l’obiettivo finale di progettare un web migliore.

Tackle React component complexity using Reactive Statecharts

Farzad YousefZadeh, nel suo intervento, ha provato a dimostrare come alcune persone sottovalutano la complessità dei componenti di React UI e ha cercato di proporre un approccio per semplificare questo sforzo modellando il comportamento del componente usando Reactive Statecharts. Il concetto era basato sul modello di pensiero, su come affrontare le complessità nello sviluppo del componente, come pensare correttamente ai casi limite e come modellare esplicitamente il componente usando Reactive Statecharts.

Abbiamo concluso la giornata al ReactJSDay 2019 carichi di entusiasmo, desiderosi di sperimentare quanto appreso il prima possibile: una giornata che racchiudeva un livello formativo e tecnico pazzeschi. Sono giornate come queste che alimentano il desiderio di continua scoperta, che conducono verso nuovi metodi di studio e apprendimento di nuove tecniche e linguaggi, conoscendo nuove persone. Sono giornate come queste che ci ricordano perché amiamo tanto questo lavoro.

Altri articoli