Quickstart

introduzione questa guida ti aiuterà a configurare e utilizzare back4app con un progetto nuovo o esistente utilizzando il react native cli installerai il parse sdk , lo inizializzerai con le chiavi della tua app e creerai la tua prima chiamata api per salvare e recuperare dati da back4app requisiti per completare questo tutorial, avrai bisogno di un https //www back4app com/docs/get started/new parse app su back4app https //www npmjs com/get npm?utm source=house\&utm medium=homepage\&utm campaign=free%20orgs\&utm term=install%20npm o yarn installati https //www npmjs com/package/npx pacchetto runner installato 1 crea il tuo progetto react native ci sono due modi principali per creare un progetto react native react native cli e expo scegli in base al tuo ambiente di sviluppo e alla piattaforma target (ios o android) react native cli le istruzioni dipendono dal tuo sistema operativo di sviluppo e se desideri iniziare a sviluppare per ios o android per ulteriori informazioni, controlla la documentazione ufficiale https //reactnative dev/docs/environment setup expo installa expo cli globalmente npm install g expo cli crea un nuovo progetto react native expo init b4aproject cd b4aproject expo start 2 installa le dipendenze nel tuo progetto react native, installa parse javascript sdk e asyncstorage eseguendo npm install parse @react native async storage/async storage save parse javascript sdk per integrare la tua app con i server back4app react native async storage per utilizzare il parse sdk, è necessario un gestore asyncstorage per ios, aggiungi anche il supporto nativo di asyncstorage cd ios & pod install 3 ottieni le tue chiavi dell'app dopo aver creato la tua app su back4app, trova le tue chiavi dell'app sotto impostazioni app > sicurezza e chiavi avrai bisogno sia del id applicazione che del javascript key per connetterti 4 inizializza parse e connettiti a back4app apri index tsx e inizializza parse con il tuo id applicazione e javascript key index tsx import parse from 'parse/react native'; import asyncstorage from '@react native async storage/async storage'; // initialize parse only once parse setasyncstorage(asyncstorage); parse initialize('your application id', 'your javascript key'); parse serverurl = 'https //parseapi back4app com/'; 5 salva e recupera dati con parse inizializzato, crea due funzioni in index tsx per salvare e recuperare dati da back4app // 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); } } 6 testa la tua app apri il terminale del tuo progetto esegui il progetto react native cli esegui npx react native run android npx react native run android o npx react native run ios npx react native run ios per aprire l'applicazione sulla tua piattaforma di destinazione expo esegui expo start expo start , e segui le istruzioni per visualizzare l'app nel tuo browser o dispositivo risoluzione dei problemi alcuni problemi comuni e soluzioni metro ha riscontrato un errore durante il tentativo di risolvere il modulo “idb keyval’ dal file soluzione vai al file metro conf js metro conf js e cambialo in questo modo 1 const { getdefaultconfig } = require("@expo/metro config"); 2 const defaultconfig = getdefaultconfig( dirname); 3 defaultconfig resolver assetexts push("cjs"); 4 module exports = defaultconfig; impossibile risolvere il modulo ‘eventemitter’ soluzione vai al file node modules\parse\lib\react native\eventemitter js node modules\parse\lib\react native\eventemitter js e cambia questa riga var eventemitter = require(' / / /react native/libraries/vendor/emitter/eventemitter'); in questo modo import eventemitter from 'react native/libraries/vendor/emitter/eventemitter'; nello stesso file eventemitter js eventemitter js , modifica la seguente riga module exports = eventemitter; in questo modo export default eventemitter; problemi con babel nel caso tu riscontri problemi con babel, considera di aggiornare il tuo babel config js al seguente module exports = function (api) { api cache(true); return { presets \['babel preset expo'], plugins \[ '@babel/plugin proposal export namespace from', 'react native reanimated/plugin', ], }; }; prossimi passi questa guida copre la configurazione di base e la memorizzazione dei dati con back4app esplora le funzionalità di parse, inclusi memorizzazione dei dati, capacità in tempo reale, memorizzazione locale dei dati, funzioni cloud, autenticazione e memorizzazione dei file