Ionic Baba Commerce

Required Setup

First, this link will help you install and build your first Example Ionic app. https://ionicframework.com/docs/intro/cli Navigate to the project folder after downloading and extracting the main files from codecanyon.

cd BabaCommerce

Installing Node Modules

Open terminal and go to project folder and run following command

npm install

Building Web Build In Production

Copying Web Code

npx cap copy

Add Web Build

ionic build --prod

iOS Setup

Running Simulator

Run following command if you have installed node modules from previous command.

Add IOS Platform

npx cap add ios

For Opening the iOS Project

To open the project in Xcode, run:

 npx cap open ios

Android Setup

Add Andoird Platform

 npx cap add android

For Opening the Android Project

To open the project in Android Studio, run:

 npx cap open android

Configuration Setup

Required Setup

App Config

Open the project folder and go to the BabaCommerce\src\app\providers\config.ts file

• * change color of the theme

• * change the Home Style

• * change the Light/Dark Mode Theme

• * change Language LTR/RTL

you can customize the app with this config file

You can Change the SplashScreen and app Icon

For Android

Customize your launch screen app icon by creating a splashscreen.png -file , ic_launcher.png and ic_launcher_round.png and placing it in an appropriate drawable-folder. Android automatically scales drawable, so you do not necessarily need to provide images for all phone densities. You can create splash screens in the following folders:

• * drawable-port-hdpi

• * drawable-port-mdpi

• * drawable-port-xhdpi

• * drawable-port-xxhdpi

• * drawable-port-xxxhdpi

For Ios

Customize your splash screen

You can check this documentation for App icon and splash screen

https://www.joshmorony.com/deploying-capacitor-applications-to-ios-development-distribution/

LTR and RTL labels

Go into BabaCommerce\src\app\providers\gLJson.ts this file contains all English and Arabic labels. You can easily add new languages and edit these labels.

Default RTL setup

you can start the app in RTL mode for language like arabic

go into BabaCommerce\src\app\providers\config.ts file and set rtl value in initialstate value

localStorage.direction = "ltr"; // By Default (LTR)

localStorage.direction = "rtr"; // For RTL