Set up your CI and CD for React Native Part 2

Reading Time: 4 minutes

Generate signed builds for your mobile project

Why do we have to sign our APK/IPA files?

As I’ve already mentioned in the preview part of this article, code signing is an essential step since our cellphones have to verify that the application comes from a certified source. This way, they can validate that a third party source has not modified the original application.

This is what both platforms say about code signing:

“Application signing allows developers to identify the author of the application and to update their application without creating complicated interfaces and permissions. Every application that is run on the Android platform must be signed by the developer. Applications that attempt to install without being signed will be rejected by either Google Play or the package installer on the Android device.”

  • Google

“Code signing your app assures users that it is from a known source and the app hasn’t been modified since it was last signed. Before your app can integrate app services, be installed on a device, or be submitted to the App Store, it must be signed with a certificate issued by Apple.”

  • Apple

So, by having that information about code signing, we’re much more clear about why it is so important to sign our code using the tools for each platform that we’re going to review in the next steps.

 

Signing Android apps

To generate your Android keystore, you have to run the next line in your terminal:

$ keytool -genkey -v -keystore debug.keystore -storepass android -alias androiddebugkey -keypass android -keyalg RSA -keysize 2048 -validity 10000

https://cl.ly/163K2d2u0x1P

Some of the parameters that the keystore requires to be generated are these:

  • Keystore: This is going to be the name for our keystore.
  • Storepass: Password, to get access to our keystore.
  • Alias: The alias for our keystore.
  • Keypass: This is the password to get access to the private key.
  • Keyalg: Type of authentication (RSA for keystore).
  • Keysize: Indicates the bit number of our key (2048 for keystore).
  • Validity: The amount of days that the key will be active.

Once that we’ve run that line, the keytool generator will ask for some extra information to generate key data:

The previous step is a manual way to generate a Keystore, also Android Studio provides a tool to generate that key. We can find this tool in Build > Generate Signed APK… in Android Studio toolbar.

https://cl.ly/13381N0N1s1P

Then we will see a screen like this, click on Create New:

https://cl.ly/0T3p3q1n160U

A screen like this will be displayed containing the options that we filled in our terminal:

https://cl.ly/143O0k371B0L

We have to fill the same fields as we would do in a terminal, and we will get a Keystore for our Android application.

Important: For Development, you can create as many keys as you want, but you CAN ONLY HAVE ONE PRODUCTION KEY, and it can’t be replaced or you will lose your application identity, so if you generate a new one, it will be a new application for Google Play Store.

 

Now it’s time to configure Gradle to use our keystore to sign the builds. To start, add the next environment variables to nevercode:

NC_KEYSTORE_PASSWORD=[myKeystorePassword]
NC_KEY_ALIAS=[MyReleaseKey]
NC_KEY_PASSWORD=[myKeypassword]

Next one is to add our keystore file to nevercode:

NC_KEYSTORE_PATH=[File]

Note: We have to add the values that we used when our keystore was created.

 

If we added those variables to Nevercode’s Environment, we have to add some configs to our build.gradle:

android {
    ...
    defaultConfig { ... }

    signingConfigs {
        release {
            if (System.getenv()["CI"]) { // CI=true is exported by Nevercode
                storeFile file(System.getenv()["NC_KEYSTORE_PATH"])
                storePassword System.getenv()["NC_KEYSTORE_PASSWORD"]
                keyAlias System.getenv()["NC_KEY_ALIAS"]
                keyPassword System.getenv()["NC_KEY_PASSWORD"]
            }
        }
    }

    buildTypes {
        release {
            ...
            signingConfig signingConfigs.release
        }
    }
}

 

By adding these lines, we are indicating Gradle to use our keystore from Nevercode to generate a signed APK, so in this case, we won’t have to add our keystore to our CVS (it’s not recommended to add our keystore to source control).

Now Nevercode is ready to generate a signed build for our Android app using React Native.

 

Signing iOS apps

Apple Developer Account

First of all, to be able to generate a build for iOS, you must have an Apple Developer Account enrolled to Apple Developer Program (it has an annual cost of 99 USD).

If you don’t have an account yet, you can create yours joining to the next link: https://developer.apple.com/account/

Once you’re logged into your Developer Account, you will see this panel:

https://cl.ly/1R2d2I2C3v3S

We have to go to Certificates, ID’s & Profiles and we are going to see a section with this menu on the left side:

https://cl.ly/2I0A0G391R2Z

Certificates:

In this section, you have your development and distribution developer certificates for your computer.

Keys:

There’s where you can create cryptographic keys.

Identifiers:

There you can create your app IDs to give an identity to your app.

Devices:

In this section you, can add your physical devices to your account, so you can run your apps on those devices.

Provisioning Files:

In this section, you indicate to your app, what devices will be able to install the app, or if it is a provisioning file for development or distribution.

 

Configure our account to sign an app

Generating an App ID

We have to create an app Identifier for our app which can’t contain special characters. One example of an app identifier is: com.myAccounName.myAppName.

https://cl.ly/0r0A3R2p0Q39

Steps to generate an app ID

https://cl.ly/0V103t35442w

App ID will be able to enable services for our app, in this case we are going to use default services.

 

Adding devices for testing

Once we have our identifier generated, we would like to add some devices to test our account by adding a device name and its UID.

https://cl.ly/2K181K3u0E0Q

Generating provisioning files

Once we have completed these steps, we are going to generate a provisioning file for our development certificate. Also, we have to choose our app identifier to match it with this provisioning and we will add some devices to the provisioning to allow them to install the application.

https://cl.ly/3O0P1Y1h0B2c

We’re going to use a development provisioning.

https://cl.ly/3z2n0B353A3V

In this step, into App ID field, we are going to choose the App ID that we generated a few steps before.

https://cl.ly/3C1i1K2p3v0Z

In this section, we will select all the devices that we will add to our Provisioning file to be able to install it.

https://cl.ly/0s3n1E3J1Z3t

The final step is to add a name to our new Provisioning file.

And that’s all the configuration we need to generate IPAs for testing locally.

 

Configuring Nevercode to sign our Apps

In the last steps, we’ve been configuring our files and projects to be able to generate signed builds in a local way. Now we are going to set up Nevercode’s Environment for it to be able to generate signed Apps.

For iOS we just have to add our Developer Certificate and our Provisioning profile:

https://cl.ly/0n0c2m3p2a3b

Android is already configured to generate builds using Nevercode if we added the Environment variables correctly:

https://cl.ly/3M2g1c2O082N

And that’s all. If you follow the above steps, your CD will be working successfully!

If you want to know more about MagmaLabs, visit us here!

0 Shares:
Share 0
Tweet 0

— Previous article

Hacking With Google

Next article —

How to use devise and devise_token_auth

You May Also Like