This article will guide you to build Android app with Premium Mobile Code. Note: the Premium Mobile Code is ONLY available on phpFox ULTIMATE license. In case you are holding other license types, please upgrade to phpFox ULTIMATE license first.

Now, let's start!

In this article, we assume that you already got the following knowledge:

  • How to use Android Studio to set up and build an Android app
  • How to create necessary Google certifications to build an Android app
  • How to configure a Firebase project for push notification on an Android app.

Prerequisite

Set up Tools and Environment

Install Android Studio

Install Nodejs & Dependencies

# support eslint 
npm install -g @babel/core@^7 @babel/cli@^7 eslint eslint-plugin-jest babel-eslint eslint-config-airbnb eslint-config-google eslint-plugin-flow-vars \
 eslint-plugin-import eslint-plugin-jsx-a11y eslint-plugin-node eslint-plugin-promise eslint-plugin-react \
 eslint-plugin-standard eslint-plugin-mocha eslint-plugin-jasmine babel-plugin-react-intl babel-plugin-transform-remove-console \
 yarn react-native-cli create-react-native-app

Setup Mobile Code

#install dependencies
 
cd MobileProject/
yarn install

Configure your Android app

Configure Push Notification with Firebase

Visit Google Firebase platform (https://console.firebase.google.com/), create a project

Update configuration.json under folder MobileProject/android/app/

Default file configuration.json will be as below:

{
 "appName": "YourAppName",
 "bundleId": "com.yourcompany.phpfoxmobile",
 "serverUrl": "https://yourphpfoxwebsite.com",
 "clientId": "CLIENT_ID",
 "clientSecret": "CLIENT_SECRET",
 "facebookAppId": "FACEBOOK_APP_ID",
 "googlePlacesClientId": "GOOGLE_PLACES_CLIENT_ID",
 "googleAdMobAppId": "GOOGLE_ADMOB_APP_ID",
 "firebaseEnabledAnalytic": true,
 "versionName": "1.x.x",
 "versionBuildNumber": 2,
 "theme": {
 "primaryColor": "#COLOR",
 "splashScreenBackgroundColor": "#COLOR",
 "grayBaseColor": "#111"
 },
 "privateInfo": {
 "storeFile": "yourcompany.keystore",
 "storePassword":"xxxxxxx",
 "keyAlias": "yourcompany",
 "keyPassword": "xxxxxxxx"
 }
}


Here is our detailed explanation for items in this file

appName

This is the app name displayed under the app logo on Android devices after installation. Ex: phpFox

bundleId

Bundle ID of your Android that you registered in Google Play Store Developer. Ex: com.yourcompany.phpfoxmobile or com.phpfox.phpfoxmobile

serverUrl

The URL of your phpFox website. Ex: https://mobileapi.phpfox.com

clientId and ClientSecret

Get these values in AdminCP > Apps > Installed > Restful API app ( /admincp/app/?id=phpFox_RESTful_API )

facebookAppId

Get value in AdminCP > Apps > Installed > Facebook Login app ( /admincp/setting/edit/?module-id=PHPfox_Facebook )

googlePlacesClientId

Follow instructions at https://developers.google.com/places/android-sdk/start to get this key for Android app.

googleAdMobAppId

Follow instructions at https://developers.google.com/admob/android/quick-start to get this key for Android app.

firebaseEnabledAnalytic

true OR false. If true, enable Firebase analytic. For further information take a look at Google Analytics for Firebase

versionName and versionBuildNumber

These two values control the versioning of your Android app in Google Play.

primaryColor

The primary color (in Hex color code, Ex: #2681D5) of your app. This color is applied to links, like button, navigation title, etc.

grayBaseColor

This color code is used for generating appropriate text color.

privateInfo

These items will be used when distributing Android app to Google Play. They can be generated within Android Studio.

Run your Android app

node ./server.js

When opening, you may receive some notice messages about missing libraries of Android Studio with instructions to install them. You can follow instructions to install missing libraries.