helius-labs / mtndao-mobile-workshop

Solana Mobile dApp Scaffold

A ready-to-go template Solana React Native dApp with dependencies installed and basic React UI components. It provides an interface to connect to locally installed wallet apps (that are MWA-compatible), view your account balance on devnet, and request an airdrop of SOL.

This React Native dApp is only fully functional on Android.

Featured Libarires

• Mobile Wallet Adapter for connecting to wallets and signing transactions/messages
• web3.js for constructing transactions and an RPC connection client.

Prerequisites

If you haven't setup a React Native development environment for Android, you'll need to do that first. Follow the Prerequisite Setup Guide.

Follow the guide to make sure you:

• setup your Android and React Native development environment.
• have an Android device or emulator.
• install an MWA compliant wallet app on your device/emulator.

Usage

1. Initialize project template

npx react-native init MySolanaDapp --template @solana-mobile/solana-mobile-dapp-scaffold --npm

note: The --npm flag is only needed if you're using Yarn 3 as a package manager. Once the template is initialized, you can delete the package-lock.json and run yarn install to continue using Yarn 3.

2. Install dependencies

• yarn install or npm install

3. Launch the app on your Android device/emulator

• npx react-native run-android

Troubleshooting

• TypeError: cli.init is not a function
  • This during template initialization means you have an old version of React Native CLI. This template only works with the new CLI. You can uninstall and reinstall it as directed here.

• error Failed to load configuration of your project.
  • Same as above, but for yarn. Uninstall and reinstall the CLI through yarn.

• Looks like your iOS environment is not properly set:
  • You can ignore this during template initialization and build the Android app as normal. This template is only compatible with Android.

• Usage Error: It seems you are trying to add a package using a https:... url; we now require package names to be explicitly specified.
  • This error happens on certain versions of yarn, and occurs if you try to initialize the template through the Github repo URL, rather than the npm package. To avoid this, use the @solana-mobile/solana-mobile-dapp-scaffold package as specified, or downgrade your yarn version to classic (1.22.x).

• error Couldn't find the ".../@solana-mobile/solana-mobile-dapp-scaffold/template.config.js file inside "@solana-mobile/solana-mobile-dapp-scaffold" template.
  • This is a known error that occurs with certain versions of yarn (>= 3.5.0). It is fixed by running the cli command with the --npm flag or downgrading your version of yarn.