Loading

Deployment

This section will guide how to config to push notification, crashlytic report and public the app to Google/Apple Store


Push notification

We are using Firebase for storing your offline data. It syncs across your devices when logging in with the same account and is also used for pushing notification. After finishing this step, you can mostly complete the getting start of the guide.
Step 1: register an account via Firebase: https://console.firebase.google.com/
Step 2: create new project:

Step 3: Generate a new server key to push notification (Setting > Cloud Messaging):

Step 4: Add your server key to WEB SOURCE CODE: config/custom.js

Then restart Web server, now you can push notification from web backend to mobile app, who installed the app.

Refers this package for fcm-node:
https://www.npmjs.com/package/fcm-node

Publish Android app

Change Android package name

The application might not function properly until all services are re-config according to new project package name. Making a new branch is strongly recommend.

Modify package name for Android require you to edit old package name to new one, then manually make a new folder structure according to your new package name and move data into the new folder.

Open /android/app/BUCK change com.kindie to you own package.

android_build_config(
...
package = 'com.kindie',
)
android_resource(
...
package = 'com.kindie',
)

Open android/app/src/main/java/com/kindie/MainActivity.java and change com.kindie to your own package.
Open android/app/src/main/AndroidManifest.xml change com.kindie to your own package
Open android/app/build.gradle change com.kindie to your own package

Move all file inside older folder android/app/src/main/java/com/kindie to the new one, example: android/app/src/main/java/com/your-package/app-name

Remember to delete previous empty folder.

Change Android project keystore

Generating a signing key: You can generate a private signing key using keytool. On Windows keytool must be run from C:\Program Files\Java\jdkx.x.x_x\bin

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

This command prompts you for passwords for the keystore and key, and to provide the Distinguished Name fields for your key. It then generates the keystore as a file called my-release-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. Remember to keep your keystore file private and never commit it to version control.

Setting up gradle variables

Place the my-release-key.keystore file under the /android/app directory in your project folder.
Edit the file /android/gradle.properties and add the following (replace * with the correct keystore password, alias and key password)

MYAPP_RELEASE_STORE_FILE=my-release-key.keystore
MYAPP_RELEASE_KEY_ALIAS=my-key-alias
MYAPP_RELEASE_STORE_PASSWORD=*****
MYAPP_RELEASE_KEY_PASSWORD=*****

For more details, take a look at Generating Signed APK from React Native.

Publish iOS app

Change iOS bundle ID

For iOS apps, ensure that every bundle ID is unique within your app bundle. For example, if your app bundle includes a helper app, ensure that its bundle ID is different from your app’s bundle ID. Follow these steps to change the bundle ID prefix in the General pane in the project editor.

To set the bundle ID prefix
In the project navigator, select the project and your target to display the project editor. Click General and, if necessary, click the disclosure triangle next to Identity to reveal the settings. Enter the bundle ID prefix in the “Bundle Identifier” field.

To set the bundle ID
In the project navigator, select the project and your target to display the project editor. Click Info. Enter the bundle ID in the Value column of the “Bundle identifier” row.

For more details, take a look at APP Distribution Guide from Apple and from https://facebook.github.io/react-native/docs/running-on-device.html#building-your-app-for-production

Have fun!

Leave a Reply

Your email address will not be published. Required fields are marked *