Web-app dev3, App test and build (Android)

This writing is about Expo Webview app build and submit to PlayStore. This is continued writing from previous one.

If you want to see for iOS application build, please have a look other article, because I made only Android application and submit to Play Store. To develop Android application, you need to make developer account at Google Play Console, pay 25$ just one time, but for iOS developer it is about 99$ every year. So it is not worth for beginner like me to make iOS developer account now. Maybe later with better skills..

1. Expo development build to test (Android)

• Prerequisite: you need to install Android Studio first. Development build will make virtual Android device for real time test and you need Android Studio for that virtual device.
• Run the command: npm install -g eas-cli

• Run the command: npx expo install expo-dev-client

• Run the command: eas login
• You need to have expo account for it. If you don't have it, make one in: https://expo.dev/

• In the App.js, put: import 'expo-dev-client';

• To make the eas.json file, run the command: eas build:configure

• Yes to make an EAS project. Then you can check your project in expo account too.

• Select the platform you want to build.

• Edit the eas.json for development build. Refer to Expo document, copy and paste it: https://docs.expo.dev/develop/development-builds/create-a-build/

{
  "build": {
    "development": {
      "developmentClient": true,
      "distribution": "internal"
    },
    "preview": {
      "distribution": "internal"
    },
    "production": {}
  }
}

• Run the command: eas build --profile development --platform android

• Select application id. When you submit this to Play Store later, people can find your application with application id.

• Enter Y to use remote Android credentials in Expo server.

• When build is completed, below message is shown up. Enter Y to install and run on emulator. And select an emulator. If emulator does not work well, refer to Expo document: https://docs.expo.dev/workflow/android-studio-emulator/#set-up-android-studios-tools

• If emulator is correctly set and opened, run the command as shown in emulator: npx expo start

• Press a to open Android

• Finally you will see your Web-view app in the emulator as below. In this status if you edit some code in App.js etc, then it will be reflected to emulator in real time directly. You can test and debug if something is wrong.

2. About Credentials

• In the previous stage, you saw credentials while you were making development build and made it in Expo Server. Then what is app credential?: It is similar to a signature or seal from the publisher when releasing an app.

• When building an app, App Credentials or Keystore files are typically created. These are later used when submitting app updates. In the case of building apps with Expo, credentials are often created and stored on Expo's servers. The problem arises when a new project is created separately, and a new set of credentials is made, which may not be compatible with the existing ones. This incompatibility prevents the app from being updated.
• Below example: Error occurs due to mismatched signatures when trying to update the app.

3. APK build to test (Android)

• With this APK build, you can make your application to apk file and test it in real device.
• Edit the eas.json for apk build as below. Refer to Expo document: https://docs.expo.dev/build-reference/apk/

{
  "build": {
    "preview": {
      "android": {
        "buildType": "apk"
      }
    },
    "preview2": {
      "android": {
        "gradleCommand": ":app:assembleRelease"
      }
    },
    "preview3": {
      "developmentClient": true
    },
    "preview4": {
      "distribution": "internal"
    },
    "production": {}
  }
}

• Run the command: eas build -p android --profile preview

• After this build, you can download apk file by entering some commands or in Expo web if you are logged in. Install it in real Android device to test it.

4. Production build to submit (Android)

• Production build is to submit your application to Play Store by making aab file. For detail, refer to Expo document: https://docs.expo.dev/tutorial/eas/android-production-build/
• First edit eas.json for production build. Default eas.json is for the production build so if you changed something and don't remember default value, then delete the eas.json and make it again by entering command: eas build:configure

{
  "cli": {
    "version": ">= 10.2.1"
  },
  "build": {
    "development": {
      "developmentClient": true,
      "distribution": "internal"
    },
    "preview": {
      "distribution": "internal"
    },
    "production": {}
  },
  "submit": {
    "production": {}
  }
}

• Run the command: eas build --platform android

• After this build, you can download aab file to submit to Play Store. Go to PlayConsole and upload it then Google will verify if your app is working fine and correct etc. etc. After some validation if everything fine, your app will be shown in Play Store.

Important!!

• Note that this is Web-view application and this kind of application needs 1 more extra validation such as if the web is really owned by the same owner of the application. About such validation I will write it next time.