Monday, May 4, 2020

Develop android applications with react-native, without installing android studio - Troubleshooting

 In this previous post we discussed about hot to install Android SDK without installing Android Studio. It is pretty much sure most of the audience couldn't complete it without facing some difficulties. This post contains the Questions and answer help for few problems you could face.

Q: Keystore file '/<project-root>/android/app/debug.keystore' not found for signing config 'debug'
A: https://github.com/facebook/react-native/issues/25629 contains this answer. You have to go <project-root>/android/app/ and run this command

keytool -genkey -v -keystore debug.keystore -storepass android -alias androiddebugkey -keypass android -keyalg RSA -keysize 2048 -validity 10000
and run npx react-native run-android warning-mode=all

Q: Cannot find System Java Compiler. Ensure that you have installed a JDK (not just a JRE) and configured your JAVA_HOME system variable to point to the according directory,
I have installed jdk 8 and java & javac commands also working
A: add "JAVA_HOME" system variable as "C:\Program Files\Java\jdk1.8.0_241" matching with your installation folder
Open a new terminal and try npx react-native run-android warning-mode=all

Q: I was debugging my application in real device, next time I started debugging, it fails to start debug application in the device
A: uninstall the previous installation and start debugging script in the machine
adb shell pm uninstall <your-package-name>
ex: adb shell pm uninstall com.abc
Then re-run npx react-native run-android warning-mode=all

Q. Still I cant start my debugging session
We need to retry with some advanced cleaning
adb shell pm uninstall <your-package-name>
cd <project-root>/android
.\gradlew clean
npm install --save-dev jetifier
npx jetify
npx react-native run-android warning-mode=all 


Q. Making the production release
.\gradlew clean
.\gradlew assembleRelease 


Q. Vector icons not rendered, unknown square symbol
goto: android/app/build.gradle
add: apply from: "../../node_modules/react-native-vector-icons/fonts.gradle"








Q. Error: rngesturehandlermodule.default.direction
open android/app/src/main/java/com/ks2/MainActivity.java
import com.facebook.react.ReactActivityDelegate;
import com.facebook.react.ReactRootView;
import com.swmansion.gesturehandler.react.RNGestureHandlerEnabledRootView;

// after protected String getMainComponentName()
@Override
protected ReactActivityDelegate createReactActivityDelegate() {
  return new ReactActivityDelegate(this, getMainComponentName()) {
    @Override
    protected ReactRootView createRootView() {
      return new RNGestureHandlerEnabledRootView(MainActivity.this);
    }
  };
}


Saturday, May 2, 2020

Develop android applications with react-native, without installing android studio

As a React-Native developer it is not mandatory to use Android Studio to develop applications. And some people don't like to install Android Studio since it consumes lot of system resources. But it is must to have 'Android SDK tools' installed in our machine to build android applications. So we are going to install 'Android SDK tools' without installing 'Android Studio'.

I used windows 10 as my development environment in this tutorial.

Pre-requisites:
You can refer this post if you encounter problems during this tutorial

I used the 'Android-SDK-tools' zip archive, and extracted in a folder in 'C:\' drive.
Then add these items to 'system variable'.
ANDROID_HOME : 'Android-SDK-tools' zip extracted location
ANDROID_SDK_ROOT : 'Android-SDK-tools' zip extracted location






Now edit PATH variable, add (append) path to 'platform-tools' folder as below



After that open a new 'powershell window' and make sure`java`, `javac`, `adb` commands are working.

Now open SDK manager and download required SDK packages. I used https://github.com/Starotitorov/tic-tac-toe to this demonstration.






Now you can see the codebase for our 'tictactoe' app, and we need to run it in android environment. I used an actual device, which is enabled the USB debugging, since it was hard to run an emulator in my machine.
  • Run `npm install`
  • Run `npx react-native run-android`
`npx react-native run-android` it is expected to start downloading all the necessary files required for Android and Gradle, and making the app-debug.apk and install it on the device.

It is good to use `npx react-native run-android warning-mode=all` to get a detailed description of the app debugging status.

Did you get any errors when running the Android application? Check this post for the FAQ related with running react-native application. This contains answers for the following problems,
  • Keystore file '/<project-folder>/android/app/debug.keystore' not found for signing config 'debug' 
  • Cannot find System Java Compiler. Ensure that you have installed a JDK (not just a JRE) and configured your JAVA_HOME system variable to point to the according directory
  • Emulator or device not found error