Get up and running with React Native SalesforceMobleSDK Project for iOS

The goal of this post is to show you an easy way to get up and running with React Native SalesforceMobleSDK for iOS.

In a nutshell, there are four things we have to do:

  1. Install Dependencies

  2. Create a Connected App In Salesforce

  3. Clone a project template

  4. Verify the Project Runs Locally

If you’re planning on building and releasing an app there are way more steps, but the goal of this post is to get you up and hacking!

Install Dependencies

The first thing we need to do is make sure you have all of the dependencies installed, if you don’t here are links to install guides:

  1. node — https://nodejs.org/en/

  2. xCode — https://developer.apple.com/xcode/

  3. CocoaPods — sudo gem install cocoapods -v 1.4

Note If You have a higher version of cocoapods, you will get an error like this:

Installed pod version (1.5.3) is more than the maximum supported version (1.4). Please downgrade your version of pod.

To resolve this issue, run sudo gem uninstall cocoapods .

Create a Connected App In Salesforce

  1. Login to your Salesforce Org

  2. Switch to Lightning Experience

  3. setup > search for app

  4. Click on Apps > App Manager

 

5. Click on New Connected App

6. Fill out the required fields.

 

 

jeff 2.png

7. Check Enable OAuth Settings

jeff 3.png

8. For Callback URL you can enter anything. Because we’re not going to redirect the user to a different website once auth’d. I suggest the format: myappname://auth/success

Jeff 4.png

9. Choose appropriate selected OAuth Scopes. (Use principle of least privilegehere.)

jeff 5.png

10. Save. Copy the Consumer Key and Callback URL values for later use.

Clone a Project Template

We’re going to use the ReactNativeTemplate part of SalesforceMobileSDK-Templates repo.

  1. Navigate to a directory that you want place this repo in terminal .

  2. git clone https://github.com/forcedotcom/SalesforceMobileSDK-Templates.git

Run Locally

  1. cd SalesforceMobileSDK-Templates/ReactNativeTemplate — Change into the ReactNativeTemplate Directory

  2. node ./installios.js — Run the install script

  3. open ios/ReactNativeTemplate.xcodeproj — Opens the project in XCode

  4. In xcode open up AppDelegate.m

jeff 6.png

5. Replace the values on line 39 and 40 with those found in your Salesforce Connected App Settings that we saved earlier.

jeff 7.png

6. npm run start — Runs the bundler for React Native.

7. Once you see Loading dependency graph, done. click on the play button in the upper left to run on the simulator.

 

jeff 8.png

That’s it you’ve now got a project running that you can hack around in and see how React Native interacts with Salesforce.