Skip to content

example

Directory actions

More options

Directory actions

More options

Latest commit

 

History

History

example

README.md

react-native-share-sms Example App

This is an example app demonstrating the usage of @sourceship13/react-native-share-sms.

Features Demonstrated

  • Send SMS - Opens the Messages app directly with prefilled text
  • Share SMS - Opens the share sheet to choose from available apps

Getting Started

Note: Make sure you have completed the React Native Environment Setup guide before proceeding.

Prerequisites

  • Node.js 18+
  • Yarn or npm
  • Xcode (for iOS)
  • Android Studio (for Android)

Installation

From the root of the monorepo, install dependencies:

yarn install

Running the Example

Step 1: Start Metro

Start the Metro bundler from the root of the monorepo:

yarn example start

Step 2: Run the App

In a new terminal, run the app on your preferred platform:

iOS
# Install CocoaPods dependencies (first time only)
cd example/ios && bundle install && bundle exec pod install && cd ../..

# Run the app
yarn example ios

Note: SMS functionality requires a physical device. The simulator cannot send SMS messages.

Android
yarn example android

Note: SMS functionality works best on a physical device with the Messages app installed.

Usage Example

The example app demonstrates basic usage:

import { sendSMS, sendWithShareSMS } from '@sourceship13/react-native-share-sms';

// Direct SMS
const result = await sendSMS({
  body: 'Hello from React Native!',
  recipients: [], // Add phone numbers here
});

// Share Sheet
const shareResult = await sendWithShareSMS({
  body: 'Shared via share sheet!',
});

Project Structure

example/
├── src/
│   └── App.tsx      # Main example component
├── ios/             # iOS native project
├── android/         # Android native project
└── package.json     # Example app dependencies

Troubleshooting

iOS: "MFMessageComposeViewController is not available"

This error occurs on the iOS Simulator. Test on a physical device.

Android: No SMS app found

Ensure you have a default SMS app installed (e.g., Google Messages).

Build errors after updating the library

Clean and rebuild:

# iOS
cd example/ios && rm -rf Pods Podfile.lock && bundle exec pod install && cd ../..

# Android
cd example/android && ./gradlew clean && cd ../..

For more information, please visit CocoaPods Getting Started guide.

# Using npm
npm run ios

# OR using Yarn
yarn ios

If everything is set up correctly, you should see your new app running in the Android Emulator, iOS Simulator, or your connected device.

This is one way to run your app — you can also build it directly from Android Studio or Xcode.

Step 3: Modify your app

Now that you have successfully run the app, let's make changes!

Open App.tsx in your text editor of choice and make some changes. When you save, your app will automatically update and reflect these changes — this is powered by Fast Refresh.

When you want to forcefully reload, for example to reset the state of your app, you can perform a full reload:

  • Android: Press the R key twice or select "Reload" from the Dev Menu, accessed via Ctrl + M (Windows/Linux) or Cmd ⌘ + M (macOS).
  • iOS: Press R in iOS Simulator.

Congratulations! 🎉

You've successfully run and modified your React Native App. 🥳

Now what?

  • If you want to add this new React Native code to an existing application, check out the Integration guide.
  • If you're curious to learn more about React Native, check out the docs.

Troubleshooting

If you're having issues getting the above steps to work, see the Troubleshooting page.

Learn More

To learn more about React Native, take a look at the following resources: