Below is some information on the process I followed to create the app for the QueerSocial website.  Perhaps it may help others.

I use Ubuntu linux but probably the principles are the same for Windows users.

QueerSocial Android App creation

1 Accounts

(a) OneSignal

Create a onesignal account and make an app for the UNA app.

(b) Firebase

Follow instuctions at https://documentation.onesignal.com/docs/generate-a-google-server-api-key

(c) UNA Website

From Studio, select Settings then Push notifications. Fill in OneSignal App ID and REST API Key from the onesignal app settings.

2 Workstation Set up (Ubuntu)

(a) NPM

Install NPM as per https://docs.npmjs.com/downloading-and-installing-node-js-and-npm

sudo apt install nodejs
sudo apt install npm

Node version manager

curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.34.0/install.sh | bash
command -v nvm   (should output ‘nvm’ if install wnet okay)
sudo apt-get install python g++ make

NOTE: if current installed npmis not compatible with Node.js version you are using you can update your npmusing

npm install npm@latest -g

( see https://github.com/nodejs/help/issues/1877 ) You can log in at https://www.npmjs.com/login

(b) React Native, Android dev & Watchman

Install React & Android studio following the info for “React Native CLI Quickstart” NOT Expo one at https://facebook.github.io/react-native/docs/getting-started

sudo npm install -g react-native-cli

For Watchman (see https://facebook.github.io/watchman/docs/install.html#installing-from-source)
you will first need to install libssl-dev, autoconf, automake, libtool, pkg-config and python-dev

sudo apt install libtool etc

(c) Java

Install Java (see https://www.digitalocean.com/community/tutorials/how-to-install-java-with-apt-on-ubuntu-18-04)

sudo apt install default-jre
sudo apt install default-jdk

 

3 Building

(a) Files

Download the UNA-Mobile project files (zip or git clone).

To rename app to QueerSocial with site url queersocial.net you need to change the following strings:

UNA.IO => QueerSocial
com.una.android => com.queersocial.android
com.una.ios => com.queersocial.ios

in the following files:

App.js
app.json
android/app/BUCK
android/app/build.gradle
android/app/src/main/AndroidManifest.xml
android/app/src/main/res/values/strings.xml

Then rename folder:

android/app/src/main/java/com/una/android/ TO android/app/src/main/java/com/queersocial/android/

Then edit these two files as per above:

 

android/app/src/main/java/com/queersocial/android/MainActivity.java
android/app/src/main/java/com/queersocial/android/MainApplication.java

Add your OneSignal app ID to the file App.js:

 

const ONESIGNALAPPID = 'nnn';

(b) Images

Change all images to your own in /img/ folder, leaving the same images dimensions.

To change launcher and icons it's recommended to use special script, it can be installed using the following command:

 

npm i -D @bam.tech/react-native-make

Then you can generate app icons for Android using the following command:

react-native set-icon --platform android --path ./img/icon-android.png

To generate splash for Android, some trick is needed (make sure that you replace Kookaburra with your own app name):

Change "name": "kookaburra"in package.jsonfile to "name": "kookaburra/android".
Then run the following command:

react-native set-splash --platform android --path ./img/background.png --resize contain

Then change "name": "kookaburra/android"back to "name": "kookaburra"in package.jsonfile.

 

(c) Build the project

Initial compile

npm install

( and npm audit fix if required )

Set variable:

export ANDROID_HOME=/path/to/android/sdk

From project folder run:

sudo chown -R $USER:$(id -gn $USER) /home/cnayl/.config
yo rn-toolbox:assets --splash ./img/background.png –android

Create the debug.keystore by running the following from the /android/app/ folder:

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

To bundle the react-native stuff , from project folder:

react-native bundle --platform android --dev false --entry-file index.js --bundle-output android/app/src/main/assets/index.android.bundle --assets-dest android/app/src/main/res/

Then with emulator running to check things work okay so far:

react-native run-android

 

4 Android App

In Android Studio, Open as “Android project” the /android/ folder.

If prompted, apply upgrades etc.

Right click on the app/res folder, then click on New and then click on Image Asset

• In the Icon Type field select Launcher Icons (Adaptive and Legacy)

• In the path field, select logo_android.png file (in /android/app/src/main)

• Once done, click on the Next button and then on the Finish button.

 

5 Add OneSignal code

To add push notification support, follow instructions at:

https://documentation.onesignal.com/docs/android-sdk-setup#section-1-adding-onesignal-dependencies

Continuing on, update file android/app/src/main/java/com/queersocial/android/MainApplication.java as per:

 

https://documentation.onesignal.com/docs/android-sdk-setup#section-2-add-required-code

Customise notification icon https://documentation.onesignal.com/docs/customize-notification-icons

You can then run app from Android studio on device emulator.

---

If you are facing issue in generating signed apk, you can try to do this in your android/app/build.gradle file

android {
lintOptions {
checkReleaseBuilds false
}
}

 

---

TO DO STILL:

Select Build variant as Release, Create package for testing, Publish!   This is covered in part 2 of this blog post.

---

QUESTIONS

I had these questions and made the assumptions shown and it seems to work!

 

In file App.js should this be changed to reflect our app name? (I’m assuming no)

userAgent={"UNAMobileApp/Mobile (" + Platform.OS + ")"}

 

In file MainActivity.java should this be kept as una or changed? (I’m assuming yes)

 protected String getMainComponentName() {
        return "una";
    }