Expo Starter Template
The quickest option to get started with Expo development is using the Solana Mobile Expo dApp Template. Run a single CLI command to initialize an Expo app with pre-installed Solana libraries and UI components. Initialize the template with:Manual Installation
If you want to create a new Expo project from scratch then follow these steps. If you want to integrate an existing project with the SDK, then skip to installing the dependencies. As a prerequisite, follow the React Native official documentation and set up your environment for Android.Step 1 - Initialize a new Expo project
Step 2 - Install dependencies
A brief overview of each dependency
A brief overview of each dependency
@solana-mobile/mobile-wallet-adapter-protocol: A React Native/Javascript API enabling interaction with MWA-compatible wallets.@solana-mobile/mobile-wallet-adapter-protocol-web3js: A convenience wrapper to use common primitives from @solana/web3.js – such asTransactionandUint8Array.@solana/web3.js: Solana Web Library for interacting with Solana network through the JSON RPC API.react-native-get-random-valuesSecure random number generator polyfill forweb3.jsunderlying Crypto library on React Native.bufferBuffer polyfill also needed forweb3.json React Native.
Step 3 - Update App.js with polyfills
For Expo SDK 48 and below For basic Expo apps, the entrypoint file is usually in the root of the project (i.e:App.js, App.tsx, index.js).
Add the following two lines to the top of the entrypoint file:
For Expo SDK Version 49+ and Expo Router
If using Expo Router and Expo SDK Version 49+ the entrypoint and polyfill setup is different. See the specific instructions below.Polyfills: Expo SDK Version 49+ and Expo Router
Polyfills: Expo SDK Version 49+ and Expo Router
If you are using Expo SDK Version 49+ and Expo Router, the Then at the end, import
expo-crypto package will replace react-native-get-random-values and you’ll create your own entrypoint file for polyfilling.Install expo-crypto
expo-crypto is an official SDK by Expo that provides the polyfill functionality we need for libraries like @solana/web3.js. See official
docs for installation instructions.Entrypoint file polyfills
In the root of your project create a new entrypoint file (i.eindex.js). In this new file,
you can initialize the polyfills at the top of the file.In this case, we polyfill the global Crypto object with getRandomValues from expo-crypto.Paste the following code:"expo-router/entry" to ensure the app is using Expo Router.Update package.json entrypoint
Lastly, inpackage.json, update the main field to point to the new entrypoint file.Step 4 - Build and run the app
Now the project is properly installed and configured, all that’s left is to build a custom development APK, install it, then launch the Expo dev client. Follow the steps on the next section.Running the app
Custom Development Build
The traditional Expo Go development flow is only limited to certain hand-picked modules and does not support further customized native code, which Solana Mobile SDKs need. Instead, we’ll need to use a custom development build which makes Solana Mobile React Native libraries (i.e Mobile Wallet Adapter) fully compatible with Expo. Full steps of building and running a custom development build below.Local vs EAS builds
Theeas build command deploys a job to the EAS Build service that builds your APK using Expo’s build infrastructure.
You can also run the build process locally by adding the --local flag that runs, which builds and generates the APK on your computer. You’ll need Android Studio and Java correctly setup for this step.
See the Expo official documentation for local builds.
- EAS build
- Build locally
Build with eas buildYou can use Expo’s build service to build your app with no development environment setup required. Make sure you have an Expo account and have logged in with After it’s finished building you should receive a QR code and download URL to the
expo login.In the project directory, run the command:apk of your app. You can download this to your emulator/device.
