Quick Start

Install react-native-cloud-storage and read and write your first cloud file in a few minutes.

This guide takes you from install to reading and writing your first cloud file. The default CloudStorage instance automatically uses iCloud on iOS and Google Drive everywhere else, so most of your code stays the same across platforms.

1. Install

npm install react-native-cloud-storage

Then complete the native setup for your platform:

Expo managed project
Bare React Native project
Configure the Google Drive API — required whenever Google Drive is used (e.g. on Android)

2. Provide a Google Drive access token

iCloud works out of the box on iOS. Google Drive requires an access token that you obtain from the user with a library such as @react-native-google-signin/google-signin, then hand to the library:

import { CloudStorage, CloudStorageProvider } from 'react-native-cloud-storage';

if (CloudStorage.getProvider() === CloudStorageProvider.GoogleDrive) {
  CloudStorage.setProviderOptions({ accessToken: 'your_access_token' });
}

On iOS the default provider is iCloud, which needs no token. You can skip this step if you only target iOS and don't need to use Google Drive. See Configure Google Drive API for details on how to acquire a token.

3. Write and read a file

The core API mirrors Node's fs, so reading and writing is just writeFile / readFile:

import { CloudStorage, CloudStorageScope } from 'react-native-cloud-storage';

// Write a file to the app-private scope.
await CloudStorage.writeFile('/user.json', JSON.stringify({ name: 'Ada' }), CloudStorageScope.AppData);

// Read it back.
if (await CloudStorage.exists('/user.json', CloudStorageScope.AppData)) {
  const json = await CloudStorage.readFile('/user.json', CloudStorageScope.AppData);
  const user = JSON.parse(json);
}

CloudStorageScope.AppData is a hidden, app-private container — ideal for app state and backups. Use CloudStorageScope.Documents for files the user should see in iCloud Drive or Google Drive.

4. Use the React hook

Inside components, useCloudFile keeps a single file's content in sync and gives you helpers to write and remove it:

import { Button, Text, View } from 'react-native';
import { CloudStorageScope, useCloudFile } from 'react-native-cloud-storage';

function Profile() {
  const { content, write, remove } = useCloudFile('/user.json', CloudStorageScope.AppData);

  return (
    <View>
      <Text>{content ?? 'No profile saved yet'}</Text>
      <Button title="Save" onPress={() => write(JSON.stringify({ name: 'Ada' }))} />
      <Button title="Delete" onPress={remove} />
    </View>
  );
}

To react to whether the cloud is reachable at all (for example, iCloud right after launch or before the user signs in), use useIsCloudAvailable.

1. Install

2. Provide a Google Drive access token

3. Write and read a file

4. Use the React hook

Next steps

Using multiple providers

API Reference

Example project

On this page