Giter VIP home page Giter VIP logo

react-native-cloudkit-storage's Introduction

react-native-cloudkit-storage

Part of the TechniCalc Project

Like AsyncStorage, but syncs with Apple's CloudKit

Installation

npm install react-native-cloudkit-storage

Usage

import CloudKitStorage from 'react-native-cloudkit-storage';

// Must call this!
CloudKitStorage.registerForPushUpdates();

await CloudKitStorage.setItem('itemName', JSON.stringify({ key: 'value' }));
const json = JSON.parse(await CloudKitStorage.getItem('itemName'));

// Handle remote events
CloudKitStorage.addListener('delete', ({ key }) => {
  console.log(`Deleted item ${key}`);
});
// Remote events only - not called when calling setItem
CloudKitStorage.addListener('change', ({ key, value }) => {
  console.log(`Changed item ${key}`, value);
});

Set Up

Open XCode.

Click the top item in the files list (your project). In the Signing & Capabilities tab, click + Capability, then iCloud.

Scroll down to the iCloud section, then click the CloudKit. It may ask you to set your team.

Under containers, click the + button. Pick a name in the form iCloud.org.{team name}.{project name}. Ensure it is checked.

It can take a day or so for the CloudKit database to fully set up. If you're having issues, wait a few days, and check again.

Open the iCloud developer dashboard and do the following:

  1. Create a zone called RCTCloudKitStorage
  2. Create a record type called RCTCloudKitRecordType with a field called contents of type ASSET

Next, open AppDelegate.m and add the following,

#import "RCTCloudKitStorage.h"
- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions
{
  // ...
  [application registerForRemoteNotifications];
  // ...
}

- (void)application:(UIApplication *)application didReceiveRemoteNotification:(NSDictionary *)userInfo fetchCompletionHandler:(void (^)(UIBackgroundFetchResult))completionHandler
{
  BOOL didHandle = [RCTCloudKitStorage
                    didReceiveRemoteNotification:userInfo
                    fetchCompletionHandler:completionHandler];

  if (!didHandle) {
    completionHandler(UIBackgroundFetchResultNoData);
  }
}

macOS

If you're targeting macOS via Catalyst, the default React Native setup has a bug in it where the app will open itself whenever the CloudKit database changes. To fix this, you'll need to be very comfortable with iOS development, but the following steps should help.

  • Remove the React-Native logic from AppDelegate.m and implement it in your own UIViewController
  • Add/keep @property (nonatomic, strong) UIWindow *window; in your app delegate
  • Your view controller must conform to RCTBridgeDelegate
  • Implement - (void)loadView and initialize self.view with an instance of RCTRootView
  • Add a Main.storyboard, and point it to your new view controller. You don't need to set a view subclass

Contributing

See the contributing guide to learn how to contribute to the repository and the development workflow.

License

MIT

react-native-cloudkit-storage's People

Contributors

jacobp100 avatar stanica avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.