Rilasciato · in miglioramento
Framework · Dal 2015
React Native è un framework open source per creare app Android e iOS con React e JavaScript o TypeScript, con interfaccia nativa da un unico codice.
React Native è un framework open source pubblicato da Meta nel 2015 che permette di creare app Android e iOS con il modello a componenti di React. Le schermate vengono disegnate con le viste native di ciascuna piattaforma e non dentro una web view, quindi le app hanno l'aspetto e la reattività di una normale app nativa. Oggi è sviluppato da Meta insieme alla community e ad aziende partner, e la New Architecture, attiva per impostazione predefinita, collega in modo più diretto JavaScript e codice nativo.
React Native dà il meglio nei team che usano già React sul web e vogliono creare app mobili con le stesse conoscenze e gli stessi strumenti. Un unico codice serve entrambe le piattaforme, si può sempre ricorrere a Kotlin o Swift quando serve e Fast Refresh mostra le modifiche appena si salva. È molto diffuso nelle app con molte schermate e cicli di rilascio rapidi, come commercio, social e applicazioni aziendali interne, e può anche gestire solo alcune schermate di un'app nativa esistente.
Il modo più semplice per iniziare è creare un progetto con Expo, come consiglia la documentazione ufficiale. Installa Node.js, crea un progetto con create-expo-app, poi installa Expo Go sul telefono e apri l'app inquadrando un codice QR. Conviene imparare prima le basi di React e poi seguire la guida ai componenti di base della documentazione ufficiale e il tutorial di Expo per costruire una piccola app.
Componenti come View, Text e Image vengono disegnati con le viste native di ogni piattaforma, con l'aspetto che gli utenti si aspettano.
Componenti, props, stato e hook funzionano come in React, insieme a TypeScript e all'ecosistema npm.
Fast Refresh applica le modifiche mantenendo lo stato, mentre React Native DevTools si occupa del debug.
I Turbo Native Module e i componenti Fabric della New Architecture si collegano direttamente a codice Kotlin e Swift.
Gli strumenti di React Native funzionano su Node.js. Installa la versione LTS da nodejs.org e verifica che venga mostrato un numero di versione. L'emulatore Android richiede Android Studio, il simulatore iOS richiede macOS con Xcode.
node --versionCrea un nuovo progetto con Expo, come consiglia la documentazione ufficiale. Il modello include già TypeScript e il routing basato sui file (Expo Router).
npx create-expo-app@latest my-appAvvia il server di sviluppo nella cartella del progetto, poi inquadra il codice QR con Expo Go oppure premi a (Android) o i (iOS) nel terminale.
cd my-app && npx expo startIn un progetto creato dal modello blank-typescript, App.tsx è il componente radice. View è un contenitore di layout e Text mostra il testo; ogni testo deve stare dentro un componente Text. Gli stili creati con StyleSheet.create usano Flexbox per centrare il contenuto. Modifica e salva il file: Fast Refresh aggiorna subito l'app in esecuzione.
App.tsx
import { StyleSheet, Text, View } from "react-native";
export default function App() {
return (
<View style={styles.container}>
<Text>Hello, world!</Text>
</View>
);
}
const styles = StyleSheet.create({
container: { flex: 1, alignItems: "center", justifyContent: "center" },
});
npx create-expo-app@latest hello --template blank-typescript && cd hello && npx expo startSei capitoli che ti accompagnano dall'installazione ai concetti chiave di React Native.
Fai domande, condividi la tua esperienza e scambia opinioni su React Native.
Ancora nessuna discussione. Avvia la prima.
0 commenti
Accedi · Accedi per lasciare un commento.
Scrivi tu il primo commento.