App Center Setup
Download APK
Requirements
-
Sign Up on App Center and create a new App.
How to use this repo
- Clone this repo:
[email protected]:andrefangeloni/mb-talk-app-center.git
; - Navigate to the downloaded folder and then run
yarn
on terminal to install dependencies; - Install Pods:
cd ios && pod install && cd ..
(iOS only); - Rename
env-template.json
toenv.json
and paste yourAPI_KEY
generated on TMDB; - Follow the instructions below, generate your own api's keys and paste on the respective files.
Installation
- Open terminal and run
npm install -g appcenter-cli
- Run
appcenter login
. This opens a browser and generates a new API token. - Copy the API token from the browser, and paste this into terminal.
Adding dependencies on your project
yarn add appcenter appcenter-analytics appcenter-crashes react-native-code-push
Getting Started
Reference: Visual Studio App Center
Android:
1 - Create a new file with the name appcenter-config.json in android/app/src/main/assets/
with the following content and replace {APP_SECRET_VALUE} with your app secret value.
{
"app_secret": "{APP_SECRET_VALUE}"
}
Note: If the folder named assets doesn't exist, it should be created under project_root/android/app/src/main/assets
2 - In your android/settings.gradle
file, make the following additions:
project(':react-native-code-push').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-code-push/android/app')
include ':app', ':react-native-code-push'
3 - In your android/app/build.gradle
file, add the codepush.gradle
...
apply from: "../../node_modules/react-native/react.gradle"
apply from: "../../node_modules/react-native-code-push/android/codepush.gradle"
...
4 - Update the MainApplication.java
file to use CodePush via the following changes:
...
// 4.1 - Import the plugin class.
import com.microsoft.codepush.react.CodePush;
public class MainApplication extends Application implements ReactApplication {
private final ReactNativeHost mReactNativeHost = new ReactNativeHost(this) {
...
// 4.2 - Override the getJSBundleFile method to let
// the CodePush runtime determine where to get the JS
// bundle location from on each app start
...
@Override
protected String getJSBundleFile() {
return CodePush.getJSBundleFile();
}
};
}
5 - Open terminal and run appcenter codepush deployment list -a <ownerName>/<appName> -k
5.1 - Copy the Production Deployment Key
6 - Modify the app's res/values/strings.xml
to include the following lines:
<resources>
<string name="app_name">{app_name}</string>
<string moduleConfig="true" name="CodePushDeploymentKey">{DeploymentKey}</string>
<string
moduleConfig="true"
translatable="false"
name="appCenterCrashes_whenToSendCrashes"
>
DO_NOT_ASK_JAVASCRIPT
</string>
<string
moduleConfig="true"
translatable="false"
name="appCenterAnalytics_whenToEnableAnalytics"
>
ALWAYS_SEND
</string>
</resources>
iOS:
1 - Open terminal and run cd ios && pod install && cd ..
2 - Create a new file with the name AppCenter-Config.plist in ios/<app_name>/
with the following content and replace {APP_SECRET_VALUE} with your app secret value.
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "https://www.apple.com/DTDs/PropertyList-1.0.dtd">
<plist version="1.0">
<dict>
<key>AppSecret</key>
<string>{APP_SECRET_VALUE}</string>
</dict>
</plist>
3 - Add the following content on AppDelegate.m
#import <AppCenterReactNative.h>
#import <AppCenterReactNativeAnalytics.h>
#import <AppCenterReactNativeCrashes.h>
#import <CodePush/CodePush.h>
3.1 - Add these lines to the didFinishLaunchingWithOptions method
[AppCenterReactNative register];
[AppCenterReactNativeAnalytics registerWithInitiallyEnabled:true];
[AppCenterReactNativeCrashes registerWithAutomaticProcessing];
3.2 - Replace else condition:
from:
- (NSURL *)sourceURLForBridge:(RCTBridge *)bridge
{
#if DEBUG
return [[RCTBundleURLProvider sharedSettings] jsBundleURLForBundleRoot:@"index" fallbackResource:nil];
#else
return [[NSBundle mainBundle] URLForResource:@"main" withExtension:@"jsbundle"];
#endif
}
to:
- (NSURL *)sourceURLForBridge:(RCTBridge *)bridge
{
#if DEBUG
return [[RCTBundleURLProvider sharedSettings] jsBundleURLForBundleRoot:@"index" fallbackResource:nil];
#else
return [CodePush bundleURL];
#endif
}
4 - Open terminal and run appcenter codepush deployment list -a <ownerName>/<appName> -k
4.1 - Copy the Production Deployment Key
5 - Open Info.plist
file, add new entry named CodePushDeploymentKey and paste the value.
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
<plist version="1.0">
<dict>
...
<key>CodePushDeploymentKey</key>
<string>{DeploymentKey}</string>
</dict>
CodePush Usage
- Run on terminal:
appcenter codepush release-react -a <owner>/<project_name> -m -d Production
π
LICENSE
This project is licensed under the MIT License - see the LICENSE file for details.
Author
- π¨π»βπ» LinkedIn: AndrΓ© Angeloni