React è una parola sempre più spesso conosciuta anche dagli esperti di marketing, perché associata ad applicazioni native e Facebook.

Ma quando si scende più in profondità, cercando di capire qual’è la differenza tra React e React Native non sempre si riesce a fare chiarezza, e spesso non si sa neppure cosa sia Expo.

In questo articolo esploreremo React senza addentrarci nelle specifiche del codice, cercando di comprendere quali sono i reali vantaggi di utilizzarlo.

Cosa sono React e React Native?

Sebbene i termini siano quasi uguali, i due nomi indicano qualcosa di differente.

React è una libreria Javascript necessaria a creare interfacce ed applicazioni con caratteristiche simile a Facebook. Per comprendere meglio la sua funziona basti sapere che è nata per generare User Interface (UI), interfacce utente.

Per rendere dinamiche le interfacce i dati possono variare senza richiedere il cambiamento dell’intera interfaccia, ma utilizzando un sistema che segmenta i dati.

Per essere più precisi, React organizza in “components” gli elementi “attivabili” con il codice Javascript (in JSX, per la precisione), e fa in modo che i singoli components siano indipendenti, che possono amministrare da sé il proprio stato, passare dei dati mantenendo uno stato anche fuori dal DOM di appartenenza.

Cos’è JSX?

JSX si presenta come una sorta di connubio tra una stringa di codice e un tag HTML. Per capire meglio come si compone basta osservarlo:

const element = 

Hello, world!

;

La funzione di questo codice è descrivere che forma debba avere l’interfaccia utente della app.

La logica sottesa a JSX riguarda l’intuizione che tutte le tecnologie presenti in una app concorrono a realizzare dei componenti funzionali. JSX si occupa di facilitare l’integrazione tra elementi che sarebbero di tipo (di codice) differente.

Che cos’è React Native?

React Native è un framework pensato per applicazioni mobile che va a compilare i componenti in Javascript e li rende compatibili con i componenti nativi delle app iOS e Android. Utilizza ReactJS per creare questi componenti e l’Hot Reloading che fornisce una visione in tempo reale dei cambiamenti che vengono effettuati sul codice.

Come è stato già sottolineato la vera forza di React Native è di poter utilizzare i componenti nativi iOS e Android, e conseguentemente le app create possono sfruttare le implementazioni che interagiscono con l’hardware.

React Native è utilizzato per la creazione di Facebook, Instagram, Skype, Baidu e molti altri, a causa della sua velocità e della capacità di sfruttare una combinazione veloce per generare un’interfaccia utente flessibile.

Un esempio di pagina React Native

Expo, un modo per rendere React Native più intuitivo

Gli sviluppatori con più esperienza probabilmente preferiranno montare un’applicazione dall’inizio, per avere un maggiore controllo e una maggiore conoscenza del codice.

Ma il mondo React è di facile accessibilità anche a tutti coloro che iniziano adesso grazie ad una community di grandi dimensioni, alla presenza online di boilerplate ben strutturati e di Expo, naturalmente.

I boilerplate in genere sono dei testi riadattabili e utilizzabili in più situazioni, ma in questo caso il termine si applica a del codice generico utilizzato per montare più tipi di app. Utilizzare del codice boilerplate richiede che la app venga riempita, ma risolve tutti i problemi infrastrutturali basilari.

Expo invece è un elenco di strumenti installabili su una macchina per velocizzare il lavoro con React Native.

Da facile accesso alle funzionalità dei dispositivi su cui la app verrà installata, come telecamere o altri sensori, permette di caricare una app senza bisogno di usare Android Studio o X-Code, implementa una modalità di feedback dello sviluppo precedente al caricamento sugli store che rende molto chiaro come sarà visualizzato il codice una volta reso manifesto.

Per chiunque non volesse utilizzare un’installazione sulla propria macchina, è possibile provare il codice su Snack, una piattaforma online che interagisce con l’applicazione di Expo, così da poter inserire il codice sul browser e vedere sul proprio dispositivo mobile se le proprie sperimentazioni hanno avuto successo.