Skip to main content

React Native

As we know react-native is frontend-based technology that helps create native UI apps by Javascript. Respectively this sdk could be also simply run as any other npm module (spoiler: not every module) inside react-native application.

Here will be instruction "How to integrate sdk to react-native?"

Install​

npm i @lidofinance/solido-sdk@latest

Polyfills​

There are some polyfills that are required for react-native engine, but we don't require them directly in our code, they are required by our dependency @solana/web3.js, which most likely you are already using. If not, please see How to use @solana/web3.js in a React Native app. In short, you need to add two main polyfills:

  • react-native-url-polyfill

URL.protocol is not implemented:

ERROR Error: URL.protocol is not implemented
ERROR Invariant Violation: Module AppRegistry is not a registered callable module
  • react-native-get-random-values

crypto.getRandomValues() not supported:

Error: crypto.getRandomValues() not supported. See https://github.com/uuidjs/uuid#getrandomvalues-not-supported

Finally, after installing them, your code will be something like this:

import 'react-native-get-random-values';
import 'react-native-url-polyfill/auto';

Also, you may get error Can‘t find variable:Buffer. It should be enough to install buffer and import it:

import {Buffer} from 'buffer';
global.Buffer = global.Buffer || Buffer;

Example​

An example React Native app that demonstrates how to use the solido-sdk on react-native with interaction of a mobile wallet:

Feel free to ask any questions if you get stuck: Discord: solana-dev-support.

note
  • The example is working only on Android, because Solana Mobile Wallet Adapter doesn't support IOS yet.
  • Please use @lidofinance/solido-sdk@0.8.0 or above, because we made some specific optimizations & refactoring that will be useful also for react-native applications.