Connect to an Atlas App Services App - React Native SDK

Before You Begin

1. Create an App Services App

2. Get Your App ID

Configure the App Client

To set up your App client, pass the App ID string to the id prop of the AppProvider. Wrap any components that need to access the App with the AppProvider. In this example, we wrap the UserProvider in the AppProvider to authenticate a user.

import React from 'react';
import {AppProvider, UserProvider} from '@realm/react';

export const AppWithAuthHook = () => {
  return (
    <View>
      <AppProvider id={APP_ID}>
        <UserProvider fallback={LogIn}>
          <MyApp />
        </UserProvider>
      </AppProvider>
    </View>
  );
};

You can create multiple App client instances to connect to multiple Apps. All App client instances that share the same App ID use the same underlying connection.

Retrieve an Instance of the App Client

All components wrapped within an AppProvider can access the App client with the useApp() hook.

import React from 'react';
import {useApp} from '@realm/react';

function MyApp() {
  const app = useApp();
  // Proceed to app logic...
}

Retrieve App Outside the App Provider

To retrieve an instance of the App Client from anywhere in your application, instantiate a new instance of Realm.App() from the realm package, then pass in your App ID.

import Realm from 'realm';
const app = Realm.App.getApp("<Your App ID>");

Encrypt App Metadata

You can encrypt the metadata that App Services stores on client devices. Use the values of the MetadataMode enum to determine encryption behavior.

To encrypt App metadata:

1. Import MetadataMode from Realm and import other dependencies:

   import React from 'react';
   import {Text, View} from 'react-native';
   import {MetadataMode} from 'realm';
   import {AppProvider} from '@realm/react';

2. Create an App configuration object that contains the metadata property.

3. Set metadata.mode to MetadataMode.Encryption.

4. Set metadata.encryptionKey to the key you want to use for encryption.

5. Pass the App configuration object to new Realm.App().

const EncryptMetadata = ({
  encryptionKey,
}: {
  encryptionKey: ArrayBuffer;
}) => {
  const metadataConfig = {
    mode: MetadataMode.Encryption,
    encryptionKey: encryptionKey,
  };
  return (
    <AppProvider
      id={APP_ID}
      metadata={metadataConfig}>
      <RestOfApp />
    </AppProvider>
  );
};

Connect to a Specific Server

By default, Atlas Device SDK connects to Atlas using the global baseURL of https://services.cloud.mongodb.com. In some cases, you may want to connect to a different server:

• Your App Services App uses local deployment, and you want to connect directly to a local baseURL in your region.

You can specify a baseURL as a prop for AppProvider. All AppConfiguration keys can be passed as props to AppProvider.