Quickstart

введение этот гид поможет вам настроить и использовать back4app с новым или существующим проектом, используя react native cli вы установите parse sdk , инициализируете его с вашими ключами приложения и создадите ваш первый api вызов для сохранения и извлечения данных из back4app предварительные условия для завершения этого учебника вам потребуется созданное приложение на back4app npm https //www npmjs com/get npm?utm source=house\&utm medium=homepage\&utm campaign=free%20orgs\&utm term=install%20npm или yarn установлен npx https //www npmjs com/package/npx пакетный запускатель установлен 1 создайте ваш проект react native существует два основных способа создания проекта react native react native cli и expo выберите в зависимости от вашей среды разработки и целевой платформы (ios или android) react native cli инструкции зависят от вашей операционной системы для разработки и от того, хотите ли вы начать разработку для ios или android для получения дополнительной информации ознакомьтесь с официальной документацией здесь expo установите expo cli глобально создайте новый проект react native 2 установите зависимости в вашем проекте react native установите parse javascript sdk и asyncstorage , выполнив parse javascript sdk для интеграции вашего приложения с серверами back4app react native async storage для использования parse sdk требуется обработчик asyncstorage для ios также добавьте поддержку нативного asyncstorage 3 получите свои ключи приложения после создания вашего приложения на back4app найдите свои ключи приложения в настройки приложения > безопасность и ключи вам понадобятся как id приложения так и javascript key для подключения 4 инициализируйте parse и подключитесь к back4app откройте index tsx и инициализируйте parse с вашим id приложения и 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 сохраните и извлеките данные с инициализированным parse создайте две функции в index tsx для сохранения и извлечения данных из 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 протестируйте ваше приложение откройте терминал вашего проекта запустите проект react native cli запустите npx react native run android npx react native run android или npx react native run ios npx react native run ios чтобы открыть приложение на вашей целевой платформе expo запустите expo start expo start , и следуйте инструкциям, чтобы просмотреть приложение в вашем браузере или на устройстве устранение неполадок некоторые распространенные проблемы и решения metro обнаружил ошибку при попытке разрешить модуль “idb keyval’ из файла решение перейдите в файл metro conf js metro conf js и измените его на этот 1 const { getdefaultconfig } = require("@expo/metro config"); 2 const defaultconfig = getdefaultconfig( dirname); 3 defaultconfig resolver assetexts push("cjs"); 4 module exports = defaultconfig; не удается разрешить модуль ‘eventemitter’ решение перейдите в файл node modules\parse\lib\react native\eventemitter js node modules\parse\lib\react native\eventemitter js и измените эту строку на эту в том же файле eventemitter js eventemitter js , измените следующую строку на это проблемы с babel если у вас возникли проблемы с babel, рассмотрите возможность обновления вашего babel config js до следующего следующие шаги этот гид охватывает базовую настройку и хранение данных с back4app изучите возможности parse, включая хранение данных, возможности в реальном времени, локальное хранение данных, облачные функции, аутентификацию и хранение файлов