React Native

React Native
software
Logo
Logo
Schermata di esempio
Schermata di esempio
GenereFramework per applicazioni web
SviluppatoreMeta e community
Data prima versione2015
Ultima versione0.76.1 (29 ottobre 2024)
Sistema operativoMultipiattaforma
LinguaggioObjective C
Python
Materia:Java
JavaScript
C++
LicenzaLicenza MIT
(licenza libera)
Sito webreactnative.dev/
Modifica dati su Wikidata · Manuale

React Native è un framework per applicazioni mobili open source creato da Meta[1]. Viene utilizzato per sviluppare applicazioni per Android,[2] Android TV,[3] iOS, macOS,[4] tvOS,[5] Web,[6] Windows e UWP[7] consentendo agli sviluppatori di utilizzare React framework insieme alle funzionalità della piattaforma nativa.[8]

Storia

[modifica | modifica wikitesto]

In passato, l'utilizzo di HTML5 per la versione mobile di Facebook ha portato ad avere un'applicazione instabile con un lento recupero dei dati.[9] Per questo motivo, Mark Zuckerberg ha promesso che Meta avrebbe presto offerto una migliore esperienza mobile.

All'interno di Meta, Jordan Walke ha trovato un modo per generare elementi dell'interfaccia utente per iOS da un thread JavaScript in background, che è diventato la base per il framework React web. Hanno deciso di organizzare un Hackathon interno per perfezionare questo prototipo in modo da poter creare app native con questa tecnologia.[10]

Dopo mesi di sviluppo, Meta ha rilasciato la prima versione per React in JavaScript nel 2015. Durante un discorso tecnico,[11] Christopher Chedeau ha spiegato che Meta stava già utilizzando React Native in produzione per la sua app di gestione degli annunci.[12]

Implementazione

[modifica | modifica wikitesto]

I principi di funzionamento di React Native sono fondamentalmente identici a React, tranne per il fatto che React Native non manipola il DOM tramite il Virtual DOM. Avviene infatti un'esecuzione in background che interpreta il JavaScript scritto dagli sviluppatori direttamente sul dispositivo finale che comunica con la piattaforma nativa tramite una serializzazione dei dati su un ponte asincrono.[13][14]

I componenti di React avvolgono il codice nativo esistente e interagiscono con le API native tramite la programmazione dichiarativa di React e il JavaScript.[15]

Sebbene lo stile di React Native abbia una sintassi simile al CSS, non utilizza HTML o CSS.[16] Invece, i messaggi dal thread JavaScript vengono utilizzati per manipolare le visualizzazioni native. React Native consente inoltre agli sviluppatori di scrivere codice nativo in linguaggi come Java o Kotlin per Android e Objective-C o Swift per iOS, il che lo rende ancora più flessibile.

Esempio di base

[modifica | modifica wikitesto]

Un esempio di programma Hello World in React Native ha il seguente aspetto:

import React from 'react';
import { AppRegistry, Text } from 'react-native';

const HelloWorldApp = () => <Text>Hello world!</Text>;
export default HelloWorldApp;

AppRegistry.registerComponent('HelloWorld', () => HelloWorldApp);

// Il codice di React Native può anche essere importato da un altro componente nel seguente modo:
import HelloWorldApp from './HelloWorldApp';

Note

[modifica | modifica wikitesto]
  1. ^ oreilly.com, https://www.oreilly.com/library/view/learning-react-native/9781491929049/ch01.html. URL consultato il 30 July 2020.
  2. ^ code.facebook.com, https://code.facebook.com/posts/1189117404435352/react-native-for-android-how-we-built-the-first-cross-platform-react-native-app/.
  3. ^ reactnative.dev, https://reactnative.dev/. URL consultato il 2 ottobre 2020.
  4. ^ microsoft.github.io, https://microsoft.github.io/react-native-windows/. URL consultato il 2 ottobre 2020.
  5. ^ Copia archiviata, su React Native for Apple TV. URL consultato il 2 ottobre 2020 (archiviato dall'url originale il 21 settembre 2020).
  6. ^ github.com, https://github.com/necolas/react-native-web/. URL consultato il 6 novembre 2019.
  7. ^ Windows Apps Team, blogs.windows.com, https://blogs.windows.com/buildingapps/2016/04/13/react-native-on-the-universal-windows-platform/. URL consultato il 6 novembre 2016.
  8. ^ reactnative.dev, https://reactnative.dev/docs/out-of-tree-platforms. URL consultato il 30 July 2020.
  9. ^ (EN) Mashable, https://mashable.com/2012/09/11/html5-biggest-mistake/. URL consultato il 29 ottobre 2020.
  10. ^ Copia archiviata, su jobninja.com. URL consultato il 16 January 2018 (archiviato dall'url originale il 17 gennaio 2018).
  11. ^ YouTube, https://www.youtube.com/watch?v=7rDsRXj9-cU. URL consultato il 16 January 2018.
  12. ^ code.facebook.com, https://code.facebook.com/posts/1014532261909640/react-native-bringing-modern-web-techniques-to-mobile/.
  13. ^ tadeuzagallo.com, https://tadeuzagallo.com/blog/react-native-bridge/. URL consultato il 16 January 2018.
  14. ^ blog.uptech.team, https://blog.uptech.team/how-we-build-apps-on-react-native-part-2-7-things-you-should-know-to-save-your-development-time-944533f81c03. URL consultato il 6 novembre 2019.
  15. ^ xongolab.com, https://www.xongolab.com/blog/how-react-native-can-empower-your-mobile-app-development-process/. URL consultato il 15 February 2019.
  16. ^ reactnative.dev, https://reactnative.dev/docs/style. URL consultato il 24 February 2021.

Voci correlate

[modifica | modifica wikitesto]

Collegamenti esterni

[modifica | modifica wikitesto]
  Portale Informatica: accedi alle voci di Wikipedia che trattano di informatica