Deployment Documentation - varunrachakatla/GDP_Group-3 GitHub Wiki

Requirements for deploying the code

For the front end code deployment we need Android and IOS

For Android Setup

Android Studio: Download and install Android Studio. Make sure you have the Android SDK and Android Virtual Device (AVD) setup.

Java Development Kit (JDK): Install JDK 8 or higher.

Environment Variables: Set up environment variables for ANDROID_HOME and ensure that the SDK tools and platform-tools are added to your PATH.

For iOS Setup

Xcode: Install the latest version of Xcode from the Mac App Store.

CocoaPods: Install CocoaPods using sudo gem install cocoapods.

For the backend code we have many web services among them we are going with render

Connect the server to Render

  1. Create an account on Render. (www.render.com). When you register, you will need to install render as a Github app and select which of your repos it can access to create a server. For ease in working with new repos, I would select all for the purposes of this class.

  2. You can find the documentation for Render here https://render.com/docs

  3. Assuming you are still logged into render, we want to create the service associated with your code. Click New+ and select Webservice.

  4. Select find the [server] repo in the list and click Connect.

  5. Now you will fill in the settings for the service. Use [server] as the name. Use “npm install” for the build command. Use “npm start” as the start command.

  6. Now you are ready to deploy the service by clicking on the button. Render will pop up the log and you can monitor the progress of spinning up the server. This will take a while, so we will not wait, but continue on with other tasks.

  7. Open a browser on the Render server app.

Steps Must a developer take to deploy code to production

Publishing to Google Play Store

Android requires that all apps be digitally signed with a certificate before they can be installed. In order to distribute your Android application via Google Play store it needs to be signed with a release key that then needs to be used for all future updates. Since 2017 it is possible for Google Play to manage signing releases automatically thanks to App Signing by Google Play functionality. However, before your application binary is uploaded to Google Play it needs to be signed with an upload key. The Signing Your Applications page on Android Developers documentation describes the topic in detail. This guide covers the process in brief, as well as lists the steps required to package the JavaScript bundle.

Generating an upload key

You can generate a private signing key using keytool.

Windows

On Windows keytool must be run from C:\Program Files\Java\jdkx.x.x_x\bin, as administrator.

keytool -genkeypair -v -storetype PKCS12 -keystore my-upload-key.keystore -alias my-key-alias -keyalg RSA -keysize 2048 -validity 10000

This command prompts you for passwords for the keystore and key and for the Distinguished Name fields for your key. It then generates the keystore as a file called my-upload-key.keystore.

The keystore contains a single key, valid for 10000 days. The alias is a name that you will use later when signing your app, so remember to take note of the alias.

Setting up Gradle variables

Place the my-upload-key.keystore file under the android/app directory in your project folder.

Edit the file ~/.gradle/gradle.properties or android/gradle.properties, and add the following (replace ***** with the correct keystore password, alias and key password),

MYAPP_UPLOAD_STORE_FILE=my-upload-key.keystore
MYAPP_UPLOAD_KEY_ALIAS=my-key-alias
MYAPP_UPLOAD_STORE_PASSWORD=*****
MYAPP_UPLOAD_KEY_PASSWORD=*****

These are going to be global Gradle variables, which we can later use in our Gradle config to sign our app.

macOS On macOS, if you're not sure where your JDK bin folder is, then perform the following command to find it:

/usr/libexec/java_home

It will output the directory of the JDK, which will look something like this:

/Library/Java/JavaVirtualMachines/jdkX.X.X_XXX.jdk/Contents/Home

Navigate to that directory by using the command cd /your/jdk/path and use the keytool command with sudo permission as shown below.

Adding signing config to your app's Gradle config The last configuration step that needs to be done is to setup release builds to be signed using upload key. Edit the file android/app/build.gradle in your project folder, and add the signing config,

...
android {
    ...
    defaultConfig { ... }
    signingConfigs {
        release {
            if (project.hasProperty('MYAPP_UPLOAD_STORE_FILE')) {
                storeFile file(MYAPP_UPLOAD_STORE_FILE)
                storePassword MYAPP_UPLOAD_STORE_PASSWORD
                keyAlias MYAPP_UPLOAD_KEY_ALIAS
                keyPassword MYAPP_UPLOAD_KEY_PASSWORD
            }
        }
    }
    buildTypes {
        release {
            ...
            signingConfig signingConfigs.release
        }
    }
}
...

Generating the release AAB Run the following command in a terminal:

npx react-native build-android --mode=release

This command uses Gradle's bundleRelease under the hood that bundles all the JavaScript needed to run your app into the AAB (Android App Bundle). If you need to change the way the JavaScript bundle and/or drawable resources are bundled (e.g. if you changed the default file/folder names or the general structure of the project), have a look at android/app/build.gradle to see how you can update it to reflect these changes.

The generated AAB can be found under android/app/build/outputs/bundle/release/app-release.aab, and is ready to be uploaded to Google Play.

In order for Google Play to accept AAB format the App Signing by Google Play needs to be configured for your application on the Google Play Console. If you are updating an existing app that doesn't use App Signing by Google Play, please check our migration section to learn how to perform that configuration change.

Testing the release build of your app

Before uploading the release build to the Play Store, make sure you test it thoroughly. First uninstall any previous version of the app you already have installed. Install it on the device using the following command in the project root:

npm run android -- --mode="release"

Note that --mode release is only available if you've set up signing as described above.

You can terminate any running bundler instances, since all your framework and JavaScript code is bundled in the APK's assets.

Publishing to Apple App Store

The publishing process is the same as any other native iOS app, with some additional considerations to take into account.

  1. Configure release scheme

Building an app for distribution in the App Store requires using the Release scheme in Xcode. Apps built for Release will automatically disable the in-app Dev Menu, which will prevent your users from inadvertently accessing the menu in production. It will also bundle the JavaScript locally, so you can put the app on a device and test whilst not connected to the computer.

To configure your app to be built using the Release scheme, go to Product → Scheme → Edit Scheme. Select the Run tab in the sidebar, then set the Build Configuration dropdown to Release

Pro Tips

As your App Bundle grows in size, you may start to see a blank screen flash between your splash screen and the display of your root application view. If this is the case, you can add the following code to AppDelegate.m in order to keep your splash screen displayed during the transition.

 
 // Place this code after "[self.window makeKeyAndVisible]" and before "return YES;"

  UIStoryboard *sb = [UIStoryboard storyboardWithName:@"LaunchScreen" bundle:nil];

  UIViewController *vc = [sb instantiateInitialViewController];

  rootView.loadingView = vc.view;

The static bundle is built every time you target a physical device, even in Debug. If you want to save time, turn off bundle generation in Debug by adding the following to your shell script in the Xcode Build Phase Bundle React Native code and images:

 if [ "${CONFIGURATION}" == "Debug" ]; then
  export SKIP_BUNDLING=true
 fi
  1. Build app for release

You can now build your app for release by tapping Cmd ⌘ + B or selecting Product → Build from the menu bar. Once built for release, you'll be able to distribute the app to beta testers and submit the app to the App Store.

Once you are done with the testing and ready to publish to App Store, follow along with this guide.

Launch your terminal, and navigate into the iOS folder of your app and type open ..

Double click on Storegrab.xcworkspace.

It should launch XCode.

Click on Product → Archive. Make sure to set the device to "Any iOS Device (arm64)".

After the archive is completed, in the archive window, click on Distribute App.

Click on App Store Connect now (if you want to publish in App Store).

Click Upload → Make sure all the check boxes are selected, hit Next.

Choose between Automatically manage signing and Manually manage signing based on your needs.

Click on Upload.

Now you can find it in the App Store Connect under TestFlight.

Now fill up the necessary information and in the Build Section, select the build of the app and click on Save → Submit For Review.

  1. Screenshots

The Apple Store requires you have screenshots for the latest devices. The reference for such devices would be found here. Note that screenshots for some display sizes are not required if they are provided for other sizes.