Inizia il tuo progetto React Native Expo utilizzando un modello predefinito
9 min
introduzione in questa sezione, imparerai come iniziare con react native utilizzando un expo template e come collegarlo a back4app in 4 semplici passaggi prerequisiti per completare questo tutorial, avrai bisogno di un'app backend back4app nota segui il tutorial per la nuova app parse https //www back4app com/docs/get started/new parse app per imparare come creare un'app parse su back4app npm https //www npmjs com/get npm?utm source=house\&utm medium=homepage\&utm campaign=free%20orgs\&utm term=install%20npm o yarn https //classic yarnpkg com/en/docs/install installato sul tuo sistema expo cli installato seguendo questa guida https //docs expo io/get started/installation/?redirected 1 ottieni il template per ottenere il progetto template, scarica e decomprimi il codice sorgente dal nostro repository github https //github com/templates back4app/react native template sul tuo computer o clona il progetto utilizzando la riga di comando git esegui il seguente comando per scaricare e estrarre il template utilizzando curl curl lok https //github com/templates back4app/react native template/archive/master zip && unzip master zip oppure esegui il seguente comando per clonare il template utilizzando git git clone https //github com/templates back4app/react native template 2 scarica le dipendenze dell'app assicurati di aver installato \<font color="#2166ae">npm\</font> o \<font color="#2166ae">yarn\</font> nel tuo sistema dai un'occhiata ai guida per ottenere npm https //docs npmjs com/getting started o guida per ottenere yarn https //classic yarnpkg com/en/docs/install#windows stable per ulteriori informazioni 2\ nel tuo terminale, esegui \<font color="#2166ae">cd react native template master\</font> e apri la directory principale del progetto 3\ esegui \<font color="#2166ae">npm install\</font> per installare le dipendenze in questo tutorial, stiamo usando npm per gestire le dipendenze, ma sei libero di usare yarn invece 3 configura le credenziali dell'app per consentire all'app di connettersi in modo sicuro ai server di back4app, devi fornire al parse javascript sdk le credenziali dell'app trova il tuo \<font color="#2166ae">app id\</font> e \<font color="#2166ae">javascript key\</font> navigando al \<font color="#2166ae">dashboard\</font> dell'app > \<font color="#2166ae">impostazioni dell'app\</font> > \<font color="#2166ae">sicurezza e chiavi\</font> nella directory principale del progetto, apri il file in \<font color="#2166ae">app/(tabs)/index tsx\</font> il file dovrebbe apparire così index tsx parse initialize( 'your application id here', // replace with your parse application id 'your javascript key here' // replace with your parse javascript key ); parse serverurl = 'https //parseapi back4app com/'; copia e incolla il tuo \<font color="#2166ae">app id\</font> e \<font color="#2166ae">javascript key\</font> in esso 4 testa la tua connessione all'interno del \<font color="#2166ae">app js\</font> , c'è una funzione che crea un oggetto person e un'altra per recuperare le persone della tua app nel tuo database back4app index tsx // function to create a new person async function createperson() { setloading(true); seterror(null); try { const personobject = parse object extend("person"); const personobject = new personobject(); personobject set("name", "back4app user"); const result = await personobject save(); setresult(`object created with id ${result id}`); } catch (error) { seterror(error instanceof error ? error message 'unknown error'); } finally { setloading(false); } } async function fetchpeople() { setloading(true); seterror(null); try { const personobject = parse object extend("person"); const query = new parse query(personobject); const results = await query find(); const names = results map(result => ({ objectid result id, name result get("name"), })); setresult(`fetched names ${json stringify(names, null, 2)}`); } catch (error) { seterror(error instanceof error ? error message 'unknown error'); } finally { setloading(false); } } per eseguire e testare la connessione della tua app apri il terminale del tuo progetto esegui \<font color="#2166ae">npm run android\</font> o \<font color="#2166ae">npm run ios\</font> o \<font color="#2166ae">npm run start\</font> per aprire l'applicazione sulla tua piattaforma target è fatto! a questo punto, hai imparato come avviare e far funzionare un'applicazione react native collegata a back4app