Skip to content

Build Mobile App

Akram El Assas edited this page May 6, 2024 · 41 revisions

Prerequisites

To build BookCars mobile app, you need to have the following tools installed on your machine:

Install eas-cli with the following command:

npm i -g eas-cli

Configuration

  • You need to download the google-services.json file and place it in ./mobile root directory for push notifications. Otherwise, the mobile app won't build. Don't forget to set Firebase Server key in expo.dev > Credentials > Service Credentials > Google Cloud Messaging Token as stated in the documentation.

  • If you don't have an Expo account, you'll need to create one to build BookCars mobile app.

  • Go to expo.dev, Click on Pojects then Create a Project. Set BookCars as project name and click on Create.

  • Go to BookCars project and copy the project ID. Open ./mobile/app.json and paste the project ID in extra.eas.projectId.

  • Go to ./mobile folder and run the following command to login to expo:

npx expo login
  • Create an Expo Access Token from expo.dev (Account Settings > Access Tokens) and set api/.env BC_EXPO_ACCESS_TOKEN setting:
BC_EXPO_ACCESS_TOKEN=EXPO_ACCESS_TOKEN
  • Create mobile/.env file with the following content:
BC_API_HOST=https://bookcars.ma:4002
BC_DEFAULT_LANGUAGE=en
BC_PAGE_SIZE=20
BC_CARS_PAGE_SIZE=8
BC_BOOKINGS_PAGE_SIZE=8
BC_CDN_USERS=https://bookcars.ma/cdn/bookcars/users
BC_CDN_CARS=https://bookcars.ma/cdn/bookcars/cars
BC_COMPANY_IMAGE_WIDTH=60
BC_COMPANY_IMAGE_HEIGHT=30
BC_CAR_IMAGE_WIDTH=300
BC_CAR_IMAGE_HEIGHT=200
BC_MINIMUM_AGE=21
BC_STRIPE_PUBLISHABLE_KEY=STRIPE_PUBLISHABLE_KEY
BC_STRIPE_MERCHANT_IDENTIFIER=MERCHANT_IDENTIFIER
BC_STRIPE_COUNTRY_CODE=US
BC_STRIPE_CURRENCY_CODE=USD

Set the following options:

BC_API_HOST=https://bookcars.ma:4002
BC_CDN_USERS=https://bookcars.ma/cdn/bookcars/users
BC_CDN_CARS=https://bookcars.ma/cdn/bookcars/cars
BC_STRIPE_PUBLISHABLE_KEY=STRIPE_PUBLISHABLE_KEY
BC_STRIPE_MERCHANT_IDENTIFIER=MERCHANT_IDENTIFIER
BC_STRIPE_COUNTRY_CODE=US
BC_STRIPE_CURRENCY_CODE=USD

Replace https://bookcars.ma with an IP, hostname or FQDN.

If you want to enable stripe payment gateway, set stripe publishable key in BC_STRIPE_PUBLISHABLE_KEY. You can retrieve it from stripe dashboard.

BC_STRIPE_MERCHANT_IDENTIFIER is the merchant identifier you registered with Apple for use with Apple Pay.

BC_STRIPE_COUNTRY_CODE is the two-letter ISO 3166 code of the country of your business, e.g. "US". Required for Stripe payments.

BC_STRIPE_CURRENCY_CODE is the three-letter ISO 4217 alphabetic currency code, e.g. "USD" or "EUR". Required for Stripe payments. Must be a supported currency: https://docs.stripe.com/currencies

Production Build

If you want to use BookCars mobile app on production, you should use HTTPS in BookCars API and disable usesCleartextTraffic expo plugin in ./mobile/app.json by removing the line "./plugins/usesCleartextTraffic" in plugins section.

Instructions

  • Clone the source down to your machine:
git clone https://github.com/aelassas/bookcars.git
  • Go to mobile folder:
cd ./mobile
  • Run the following command
npm install

Android

EAS Build

To build BookCars Android app with EAS Build hosted service, run the following command:

npm run build:android

Local Build

macOS or Linux are required for local build. For Windows, you should use EAS Build.

You need to install Android Studio, openjdk-17, and set ANDROID_HOME and JAVA_HOME environment variables. Then, run the following command:

npm run build:android:local

On macOS, if you face some issues regrading local build, try to set ANDROID_HOME and JAVA_HOME environment variables in ./mobile/eas.json as follow:

{
  "cli": {
    "version": ">= 0.53.0"
  },
  "build": {
    "development": {
      "developmentClient": true,
      "distribution": "internal",
      "android": {
        "image": "latest",
        "gradleCommand": ":app:assembleDebug"
      },
      "ios": {
        "image": "latest",
        "buildConfiguration": "Debug"
      }
    },
    "preview": {
      "distribution": "internal"
    },
    "production": {
      "env": {
        "ANDROID_HOME": "/path/to/android/sdk",
        "JAVA_HOME": "/path/to/java/home"
      },
      "android": {
        "image": "latest",
        "buildType": "apk"
      },
      "ios": {
        "image": "latest"
      }
    }
  },
  "submit": {
    "production": {}
  }
}

iOS

You need a paid Apple Developer account to build the iOS app for both EAS builds and local builds.

EAS Build

To build BookCars iOS app, run the following command:

npm run build:ios

Local Build

You need to install fastlane and CocoaPods on macOS.

To build BookCars iOS app locally, run the following command:

npm run build:ios:local