Automate your React Native App with Fastlane

Simplify Screenshots, beta deployment, app store deployment and signing in your React Native App 🚀

Introduction

Sometimes it is very long to create Screenshots, Beta builds, Distribute to testers, etc… for both iOS and Android. Why not automate these tasks?

That is when Fastlane comes to help us save a lot of time 😎.

What is Fastlane?

Fastlane is a collection of tools to automate the development and release process for iOS and Android.

It allows to do:

• Screenshots
• Beta deployment
• Store deployment
• Code signing

Fastlane works with React Native for both iOS and Android and that is what we are going to do 🎯

In this article, I will use a sample app from my previous article about Google AdMob

Setup

Before using Fastlane, we need to install it. These are the prerequisites:

• A Mac (Fastlane doesn’t work on Windows)
• A React Native app (Really? 😂)
• Xcode command-line tools:

$ xcode-select --install

• Fastlane uses Ruby so we need to install it:

$ brew install ruby

• And naturally, we need to install Fastlane:

$ sudo gem install fastlane -NV

iOS Part

In this part, we will use Fastlane to sign and deploy Betas for iOS.

Before using Fastlane you need to make sure these steps:

• Having Xcode 9 or Higher
• An Apple Developer Id (Email + Password) with admin Rights
• Set your app bundle identifier (e.g com.rnadmob)
• An app name in App Store Connect (In case you don’t have it, Fastlane will do for you 😎)
• An app icon (Apple won’t let you upload your app without it)
• Place a .gitignore file in iOS folder (So git will not take care about Fastlane files)

ios/.gitignore

Prepare the project

• Set your bundle identifier: General -> Identity section -> Bundle identifier
• Disable Automatic Signing: General -> Signing section
• Modify Build Settings for signing: Build Settings -> Signing section -> Code Signing Identity and set these values:

Setup Fastlane

We can now init the Fastlane project inside the iOS folder:

$ cd RNAdMob/ios
$ sudo fastlane init

You will be asked different questions:

• What you want to do:

Fastlane question

We will choose to “Automate beta distribution to TestFlight”

• Select Scheme:

Fastlane Scheme

In my case, I will use the first one

• Your Apple ID Username and Password

It is possible that you have 2FA enabled on your account so you will need to create and provide an “App-specific password”

It is also possible that multiple teams are found, select the right team.

• Create the app on the App Store Connect:

If your app is not already created, Fastlane will ask if you want it to create the App.

• Finish

Your setup is finished, Fastlane will now give you some information. 🥳

Beta deployment and Code Signing (With cert and sigh)

Every app on the App Store needs to be signed. The Code signing assures users that your app is from a known source that hasn’t been modified since it was last signed.

Fastlane allows us to sign an application automatically and quickly. The two main methods to sign with Fastlane are:

• Match: Store your private keys and certificates in a git repo to sync them across machines. This makes it easy to onboard new team members and sets up new Mac machines. This approach is secure and uses the technology you already use.
• Cert and Sigh: They allow you to sign your application without revoking existing certificates.

Fastlane uses two files for his configuration:

• Appfile: Stores information like Apple ID, App Identifier…
• Fastfile: Contains the lanes. A lane is comparable to a Task, Function.

We can find these files under ios/fastlane. In the Fastfile, we already have a “beta” lane:

Basic FastFile

That is the basic file that Fastlane has generated during init. We can describe different steps:

• increment_build_number: It will increment the build number in “info.plist” file. (You can’t have to build number identical on App Store Connect)
• build_app: We can deduce that it builds our app 😊
• upload_to_testflight: Upload the build to App Store Connect and Testflight

How to run this lane? You just need to be in ios/fastlane and run:

fastlane beta

The lane will begin to work but will fail. Why? Your app is not signed… So we need to add more steps to the lane.

Here is the new file with the modified lane:

Modified FastFile

In this new version, we added:

• get_certificates: It will create or get a certificate
• get_provisioning_profile: Create or get a provisioning profile
• update_project_provisioning: Set the provisioning profile
• update_project_team: Set the team for the project

Now you will be able to run:

fastlane beta

Beta deployment and Code Signing (With match)

As said in the Fastlane docs, match is probably the best solution to sign our App. Match allows us to share one code signing across all the development team.

Setting up match

Before setting up match, you will need to create a new private Git Repo. For example on https://github.com/.

Once you have created your private repo, you can run:

fastlane match init

You will be asked your GitHub repo URL (SSH is preferred). After you have given the GitHub repo, a “Matchfile” would be created in the Fastlane folder:

Basic MatchFile

Now that Match is set up, we can use it to create certificates and profiles:

# For the App Store
fastlane match appstore
# For the development
fastlane match development

During the process, you will be prompted your login keychain and a passphrase to en/decrypt your certificates.

Once it is done, your certificates will be pushed to the private Git repo:

Certs in GitHub

There is a lot of actions possible with Match, you can find more in the documentation.

Now that the match certificate and profile are created, we can use it in the “beta lane” as follow:

FastFile with Match

Android Part

You can use Fastlane for both iOS and Android platforms, now we will sign and deploy our Android app.

Before using Fastlane you need to make sure these steps:

• A Google Play Console account (Email + Password) with admin Rights
• Your app created on Play Console (Unfortunately Fastlane doesn’t do it with Android as iOS).
• Your Google credentials (More info here)
• Place a .gitignore file in iOS folder (So git will not take care about Fastlane files)

Android/.gitignore

Setup Fastlane

Just like iOS in “ios” folder, we need to initialize the project in the “android” folder:

$ cd RNAdMob/android
$ sudo fastlane init

You will be asked different questions:

• Package Name

Package Name

• The path to your JSON Secret file

JSON Secret file

• If you want to manage Metadata with Fastlane

• Finish

Your setup is finished, Fastlane will now give you some information. 🥳

Internal testing and Code Signing

As for iOS, we will create a Beta lane to deploy our code. Before that, we need to generate a signing key (Fastlane doesn’t do it). It is the same method as in the React Native Docs.

You need to be at the root of “android” folder:

keytool -genkey -v -keystore my-release-key.keystore -alias my-key-alias -keyalg RSA -keysize 2048 -validity 10000

Once the Keystore is generated, you can edit the Fastfile and modify the “beta” lane as follow:

Android FastFile

The lane will do the following things:

• Ask you your Store Password (The one you use to generate the signing key)
• Ask you the key password
• Build the app
• Upload it to the Play Store internal release: You need to comment this step the first time you upload to play store and do it manually. “Google doesn’t allow us to use their APIs for the first upload.”

🚧 You need to increment “versionCode” in “android/app/build.gradle” each time you want to use the lane. Unfortunately, Fastlane doesn’t do it automatically.

Fastlane allows us to automate multiple Tasks and gain a lot of time.

GitLab Repo: dmg.link/blog-fastlane-repo.

You can find my other articles and follow me here. Thanks for reading, I hope you learned something new today 🚀

How to “Sign in with Apple” on React Native

How to Use Face ID With React Native or Expo