Quickstart

pendahuluan panduan ini akan membantu anda mengatur dan menggunakan back4app dengan proyek baru atau yang sudah ada menggunakan react native cli anda akan menginstal parse sdk , menginisialisasinya dengan kunci aplikasi anda, dan membuat panggilan api pertama anda untuk menyimpan dan mengambil data dari back4app prasyarat untuk menyelesaikan tutorial ini, anda akan membutuhkan sebuah aplikasi yang dibuat di back4app npm https //www npmjs com/get npm?utm source=house\&utm medium=homepage\&utm campaign=free%20orgs\&utm term=install%20npm atau yarn yang terinstal npx https //www npmjs com/package/npx pengelola paket yang terinstal 1 buat proyek react native anda ada dua cara utama untuk membuat proyek react native react native cli dan expo pilih berdasarkan lingkungan pengembangan dan platform target anda (ios atau android) react native cli instruksi tergantung pada sistem operasi pengembangan anda, dan apakah anda ingin mulai mengembangkan untuk ios atau android untuk informasi lebih lanjut, periksa dokumentasi resmi di sini expo instal expo cli secara global npm install g expo cli buat proyek react native baru expo init b4aproject cd b4aproject expo start 2 instal dependensi dalam proyek react native anda, instal parse javascript sdk dan asyncstorage dengan menjalankan npm install parse @react native async storage/async storage save parse javascript sdk untuk mengintegrasikan aplikasi anda dengan server back4app react native async storage untuk menggunakan parse sdk, diperlukan pengelola asyncstorage untuk ios, juga tambahkan dukungan asyncstorage native cd ios & pod install 3 dapatkan kunci aplikasi anda setelah membuat aplikasi anda di back4app, temukan kunci aplikasi anda di pengaturan aplikasi > keamanan & kunci anda akan memerlukan kedua id aplikasi dan kunci javascript untuk terhubung 4 inisialisasi parse dan sambungkan ke back4app buka index tsx dan inisialisasi parse dengan id aplikasi dan kunci javascript 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 simpan dan ambil data dengan parse yang sudah diinisialisasi, buat dua fungsi di index tsx untuk menyimpan dan mengambil data dari 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 uji aplikasi anda buka terminal proyek anda jalankan proyek react native cli jalankan npx react native run android npx react native run android atau npx react native run ios npx react native run ios untuk membuka aplikasi di platform target anda expo jalankan expo start expo start , dan ikuti instruksi untuk melihat aplikasi di browser atau perangkat anda pemecahan masalah beberapa masalah umum dan solusinya metro telah mengalami kesalahan saat mencoba menyelesaikan modul “idb keyval’ dari file solusi pergi ke file metro conf js metro conf js dan ubah menjadi ini 1 const { getdefaultconfig } = require("@expo/metro config"); 2 const defaultconfig = getdefaultconfig( dirname); 3 defaultconfig resolver assetexts push("cjs"); 4 module exports = defaultconfig; tidak dapat menyelesaikan modul ‘eventemitter’ solusi pergi ke file node modules\parse\lib\react native\eventemitter js node modules\parse\lib\react native\eventemitter js dan ubah baris ini var eventemitter = require(' / / /react native/libraries/vendor/emitter/eventemitter'); menjadi ini import eventemitter dari 'react native/libraries/vendor/emitter/eventemitter'; dalam file yang sama eventemitter js eventemitter js , ubah baris berikut module exports = eventemitter; menjadi ini export default eventemitter; masalah dengan babel jika anda menghadapi masalah dengan babel, pertimbangkan untuk memperbarui babel config js ke yang berikut module exports = function (api) { api cache(true); return { presets \['babel preset expo'], plugins \[ '@babel/plugin proposal export namespace from', 'react native reanimated/plugin', ], }; }; langkah selanjutnya panduan ini mencakup pengaturan dasar dan penyimpanan data dengan back4app jelajahi fitur parse, termasuk penyimpanan data, kemampuan real time, penyimpanan data lokal, fungsi cloud, otentikasi, dan penyimpanan file