# Get Started

Welcome to Boom documentation! \
**Boom Live** is built using Flutter and has a **Parse Server** backend, making it available on both iOS and Android platforms.

Boom Live is a revolutionary Live Streaming app built with Flutter, designed to cater to all your interactive and entertainment needs. Unlike other apps, Boom is not created just for sale – our engineers have developed this app as if it were for our own company's use. Every aspect, from design to features, has been carefully considered and implemented to provide the best user experience possible.


# Setup Mailgun

You’ll need to be able to send emails with Mailgun. This is done using an API key assigned by Mailgun. In this article, we’ll show you how to obtain your Mailgun API key.

1. **Log into your** [**Mailgun**](https://www.mailgun.com/) **account.**
2. **Add and Verify your** [**domain**](https://help.mailgun.com/hc/en-us/articles/360026833053-Domain-Verification-Setup-Guide#h_01HTQRVJN6BHDKZEKHC93FK697)
3. **Then go to your** [**Account API Keys**](https://app.mailgun.com/settings/api_security) **page.**
4. **Under API Keys, locate the Private API Key field. Click on the eye icon to the right of the field to display your API key, and copy it.**

{% embed url="<https://www.youtube.com/watch?v=VI6aXV4YbdI>" %}

**Note:** this is needed for SignUp new Users with email, Password recovery for users registered with email and Welcome emails.\
if you will use only Social Logins (Facebook, Google and Apple login), you can ignore this step

<mark style="color:purple;">**Make sure that at the end of this progress, you have  saved for later use**</mark>:

* `API Key`
* `Domain or subdomain verified`


# Firebase setup

Firebase, developed by Google, is a comprehensive platform for building app infrastructure, enhancing app quality, and growing your business.

This guide will walk you through the basic steps to configure Firebase for both Android and iOS. Once set up, your app will benefit for free, these features:

* Google Login
* Phone Number Login
* Push Notifications with (Firebase cloud messaging - FCM)
* Firebase Crashlytics
* Google Analytics
* Firebase Monitoring
* Google Places (For Nearby Location)

### Step 1: Configure Firebase

#### Step 1.1: Create Project in Firebase Console

1. Open [https://console.firebase.google.com](https://console.firebase.google.com/).
2. Click on “Add project” and follow the instructions to create a new Firebase project.

#### Step 1.2: Add Firebase to Your iOS App

1. Open your Firebase project console.
2. Click the gear icon in the upper left corner and select **Project settings**.
3. In the **Your apps** section, select the iOS icon.
4. Fill in the information:
   * **iOS Bundle ID**: Use the bundle ID from your application. Ensure it's in reverse domain format (e.g., if your domain is example.com, the bundle ID should be `com.example.app`). Use only lowercase letters.
   * **App nickname**: This is only for distinguishing between applications on Firebase, so set it arbitrarily.
   * **App Store ID**: This parameter can be omitted.
5. Click **Register app**.
6. Download the `GoogleService-Info.plist` file and save it for later use.
7. Click **Next**.
8. Click **Skip this step**.
9. Complete the process of creating an iOS application on Firebase.

#### Step 1.3: Add Firebase to Your Android App

1. Open your Firebase project console.
2. Click the gear icon in the upper left corner and select **Project settings**.
3. In the **Your apps** section, select the Android icon.
4. Fill in the information:
   * **Android package name**: Use the package name from your application. Ensure it's in reverse domain format (e.g., if your domain is example.com, the package name should be `com.example.app`). Use only lowercase letters.
5. Click **Register app** (you can omit the Debug signing certificate SHA-1 parameter).
6. Download the `google-services.json` file and save it for later use.
7. Click **Next**.
8. Since your project setup is already complete, click **Next** to skip adding the Firebase SDK.
9. If Firebase does not detect your test device, click **Skip this step** to continue. If detected, click **Continue to console**.
10. Complete the process of creating an Android application on Firebase.

### Step 2: Set Up Authentication

<mark style="background-color:green;">This Step is</mark> <mark style="background-color:green;"></mark><mark style="background-color:green;">**opcional**</mark><mark style="background-color:green;">, complete it only if you want to Enable</mark> <mark style="background-color:green;"></mark><mark style="background-color:green;">**Google Login**</mark> <mark style="background-color:green;"></mark><mark style="background-color:green;">or</mark> <mark style="background-color:green;"></mark><mark style="background-color:green;">**Phone Login.**</mark>\ <mark style="background-color:green;">You can skip them or one of them if you don't pretend to use it.</mark>

#### Step 2.1: Enable Phone Login

1. In the Firebase console, go to **Authentication**.
2. Click on the **Sign-in method** tab.
3. Enable **Phone** as a sign-in provider.
4. Save your changes.

#### Step 2.2: Enable Google Login

1. In the Firebase console, go to **Authentication**.
2. Click on the **Sign-in method** tab.
3. Enable **Google** as a sign-in provider.
4. You will be prompted to choose the **Email** and **Project name**
5. Save your changes.

<mark style="color:purple;">**Make sure that at the end of this progress, you have downloaded and saved for later use 2 files:**</mark>

* `google-services.json`
* `GoogleService-Info.plist`<br>


# Admob Setup

Admob is used as one of powerful revenue income for this app, even if correctly setup, you also need to enbale it in your App Config.

### Step 1: Set Up an AdMob Account

1. Go to the [AdMob website](https://admob.google.com/) and log in with your Google account.
2. If you don’t have an AdMob account, follow the prompts to create one.

### Step 2: Create an AdMob App

1. In the AdMob dashboard, click on **Apps** in the sidebar.
2. Click the **Add app** button.
3. Select the platform (iOS or Android) for your app.
4. If your app is already published, select **Yes** and find it in the store. If not, select **No**.
5. Enter the app’s name and click **Add**.
6. Repeat the process for the other platform if you need both iOS and Android apps.

#### Step 2.1: Get the App ID

1. After adding your app, you will be redirected to the app’s dashboard.
2. The **App ID** will be displayed at the top of the screen. It will look like `ca-app-pub-xxxxxxxx~xxxxxxxx`.
3. Note down the App ID for both iOS and Android, they are different.&#x20;

### Step 3: Create an Ad Units (5 in total)

1. In your app’s dashboard, click on **Ad units** in the sidebar.
2. Click the **Add ad unit** button.
3. Select format **Banner** as the ad format
4. Enter a name for your ad unit (e.g., `HomebannerAd`).
5. Click **Create ad unit**.
6. The **Ad Unit ID** will be displayed. It will look like `ca-app-pub-xxxxxxxx/xxxxxxxx`.
7. Note down the Ad Unit ID for both iOS and Android.
8. Repeat the same procress for other formats:\
   \- **Open App Ad**\
   \- Home **Banner Ad**\
   **-** Live **Native Ad**\
   **- Rewarded Video Ad**

<mark style="color:purple;">**Make sure that at the end of this progress, you have  saved for later use**</mark>:

* `iOS AppID`
* `Android App Id`
* **`Ad Unit IDs`**` ``for each Ad formar and for both iOS and Android`


# Facebook Login Setup

Setup facebook Login to Enbale it in your App, if you don't need it, then skip this process

### Step 1: Set Up Your Facebook App

1. Go to the [Facebook Developers](https://developers.facebook.com/) website and log in.
2. Click on **My Apps** in the top right corner and then **Create App**.
3. Select **For Everything Else** and click **Next**.
4. Enter the **Display Name** for your app, provide your email, and select a category.
5. Click **Create App ID** and complete the security check.
6. Once the app is created, you will be redirected to the app dashboard.

#### Step 1.1: Configure Facebook Login

1. In the app dashboard, go to **Settings > Basic**.
2. Copy the **App ID** and **App Secret**; you will need these for Firebase.
3. In the **Add Platform** section, click **Add Platform** and select **iOS** and/or **Android** depending on your application.
4. For iOS:
   * Enter your **iOS Bundle ID**.
5. For Android:
   * Enter your **Package Name** and **Default Activity Class Name**.
6. Click **Save Changes**.

<mark style="color:purple;">**Make sure that at the end of this progress, you have  saved for later use**</mark>:

* `Facebook AppID`
* `Facebook Client Token`
* `Facebook App Secret`<br>


# Parse Server Setup

Parse Server is an open-source backend that runs Node. js and works with the Express web application framework. To truly understand what Parse Server does, you must first understand what backend as a

### Recommendation

Dative uses Parse Server as the backend. We will cover [SashiDo](https://www.sashido.io/?ref=QslegL9OQy) here, as it is the one we used, it offers managed parse server with auto indexed and scalling, you don't need to worry about databse, setups, indexing, scall, ect, just focus in your client side.\
\
**Note:** You are free to use [Back4App](https://back4app.com/) or any other provider, including your own [self-hosted](https://github.com/parse-community/parse-server) Parse Server.

### Step 1: Create a SashiDo Account

1. Open the [SashiDo website](https://www.sashido.io/?ref=QslegL9OQy).
2. Click on the **Get Started** button.
3. Fill in the registration form with your email, password, and other required information.
4. Click **Sign Up**.
5. Verify your email address by clicking on the verification link sent to your email.
6. Log in to your SashiDo account with your credentials.

### Step 2: Add a Parse Server App in SashiDo

1. After logging in, you will be directed to the SashiDo dashboard.
2. Click on the **Create a new app** button.
3. Enter a name for your new app. This name will be used to identify your app within the SashiDo dashboard.
4. Choose a data center location for your app. Select the region that is closest to your users for better performance.
5. Click on the **Create App** button.
6. Wait for the app to be created. This may take a few moments.

### Step 3: Configure Your Parse Server App

1. Once the app is created, you will be redirected to the app's dashboard.
2. On the dashboard, you will find essential details such as the **App ID**, **ClientKey**, Master Key, JavaScript Key, and REST API Key. Make sure to keep these keys secure as they are required for accessing your Parse Server.
3. To access your app's database, go to the **Database** tab in the dashboard. Here, you can manage your app's data, create new classes, and perform CRUD operations.
4. To configure your app's settings, go to the **Settings** tab. Here, you can set up various options such as push notifications, cloud code, and more.

### Monitor and Manage Your App

Use the SashiDo dashboard to monitor your app's performance, view logs, and manage your app's settings and all **Admin Panel Taks**.

Utilize the various tools and integrations available in the dashboard to enhance your app's functionality and performance.

<mark style="background-color:blue;">We are building a powerfull Admin Panel that will be delivered in Next Updates.</mark>


# Add Social Login

You need to add facebook appId in server side, failing to do it, your app will not be able to validate Facebook Login

### Step 1:&#x20;

1. Log in to your [SashiDo](https://www.sashido.io/) account and open your app's dashboard.
2. Go to the **App** **Settings** then **Users** tab in the dashboard.

### Step 1.1: Configure Facebook Login in SashiDo

1. Under **Social Login**, find **Allow Facebook authentication** and click **Enable**.
2. Enter the **App ID** and **App Secret** you copied from the [Facebook Developers dashboard](https://docs.booms.live/parse-server-setup/pages/JhVZ7zyuSabtzVVNQiIw#step-1.1-configure-facebook-login).
3. Click **Save** to apply the changes.

### Step 1.2: Configure Apple Login in SashiDo

1. Under **Social Login**, find **Allow Sign in with Apple** and click **Enable**.
2. Enter the **BUNDLE ID** the same used in [Firebase Setup.](https://docs.booms.live/parse-server-setup/pages/wyIteQnLmjeMvoeA8u9P#step-1.2-add-firebase-to-your-ios-app)
3. Click **Save** to apply the changes.

<mark style="background-color:blue;">Make sure that</mark> <mark style="background-color:blue;"></mark><mark style="background-color:blue;">**Allow username and password-based authentication**</mark> <mark style="background-color:blue;"></mark><mark style="background-color:blue;">and</mark> <mark style="background-color:blue;"></mark><mark style="background-color:blue;">**Allow anonymous users**</mark> <mark style="background-color:blue;"></mark><mark style="background-color:blue;">are enabled.</mark><br>

<figure><img src="https://content.gitbook.com/content/4J4nvdCW2wCekDwEIpzi/blobs/a8dOjprCfO5KkQ37myCm/Parse%20Server%20social%20Login.jpg" alt=""><figcaption><p>Enable Social Logins</p></figcaption></figure>


# Deploy Cloud Code

Cloud code is used for server side business login

1. In the SashiDo dashboard, go to the **Cloud Code** tab.
2. Click on **Open in GitHub** to link your app to a GitHub repository where you can manage your cloud code.
3. Clone your repository and override files in folder with the one you will download in `MainFiles.zip` from codecanyon
4. Unzip zip file and copy files in **`cloud_code`** folder and replace them in your cloned repository
5. Go to `cloud/config.js` and update with your app informations like App name,&#x20;

<figure><img src="https://content.gitbook.com/content/4J4nvdCW2wCekDwEIpzi/blobs/loFqKPyYxD6ATiGEEBJm/Cloud%20code%20setup.png" alt=""><figcaption><p>Note that in regular license, some files will be missing, since they are only for Extended License</p></figcaption></figure>

6. Push your cloud code to the repository. Any changes pushed to the repository will be automatically deployed to your app.
7. Now it's time to get and save your AppID, clientKey and Server Url for later use.

<figure><img src="https://content.gitbook.com/content/4J4nvdCW2wCekDwEIpzi/blobs/LmpvcvPuzL1kalRDeoMA/Parse%20Server%20Keys.png" alt=""><figcaption></figcaption></figure>

<mark style="color:purple;">**Make sure that at the end of this progress, you have  saved for later use:**</mark>

* `Application ID or`` `**`AppId`**
* `Client Key or`` `**`ClientKey`**
* `API URL Address or`` `**`ServerURL`**
* `LiveQuery URL Address or`` `**`LiveQueryURL`**


# Zegocloud Setup

Quickly obtain real-time audio and video communication capabilities and enjoy smooth, reliable audio and video experiences with high quality even in weak network condition.

Dative uses Zegocloud for Live streaming feature, zegocloud is cheaper and better several WebRTC providers. I'ts free to begin and you pay only when you grown check [Zegocloud Pricing.](https://www.zegocloud.com/pricing/product-list#live-streaming)

### Step 1: Create a ZEGOCLOUD Account

1. Go to the [ZEGOCLOUD website](https://www.zegocloud.com/).
2. Click on the **Sign Up** button located in the top right corner.
3. Fill in the registration form with your email, password, and other required information.
4. Click **Sign Up** to create your account.
5. Verify your email address by clicking on the verification link sent to your email.
6. Log in to your ZEGOCLOUD account with your credentials.

### Step 2: Create a New App in ZEGOCLOUD

1. After logging in, you will be directed to the ZEGOCLOUD dashboard.
2. Click on **Create a New Project** or **Add App**.
3. Enter the **App Name** for your new project.
4. Choose the **Industry** your app belongs to (e.g., Entertainment).
5. Select the **Scenario** that best describes your app (e.g., Live Streaming).
6. Click **Create** to generate your new app.

### Step 3: Get the App ID and App Sign

1. Once the app is created, you will be redirected to the app's dashboard.
2. The **App ID** and **App Sign** will be displayed on the dashboard. Note these down as you will need them for integrating live streaming into your application.

<figure><img src="https://content.gitbook.com/content/4J4nvdCW2wCekDwEIpzi/blobs/2O3vPrTXiFhvhltbvb15/Zegocloud%20appId.jpg" alt=""><figcaption><p>Zegocloud App Dashboard</p></figcaption></figure>

<mark style="color:purple;">**Make sure that at the end of this progress, you have  saved for later use:**</mark>

* `App ID ID`
* `App Sign`


# Get Dative Core API key

To ensure that the Dative source code is only used by authorized companies or individuals, and to make it easily updatable and scalable, we developed a Dative Core.

[Dative Core](https://pub.dev/packages/dative_core) manages most parts of your app installation automatically. \
With just one command, it will change the package name for your Android app and the bundle ID for your iOS app, set up Firebase, AdMob, Facebook, and more in both your Android and iOS apps. Generally, these are complex tasks, but the Dative Core handles them for you.

### Step 1: Create a Dative Core Account

1. Go to the [Dative Support Website](https://support.dative.me).
2. Click on the  **Sign Up new Account,**&#x63;lick in **Get Started**

<figure><img src="https://content.gitbook.com/content/4J4nvdCW2wCekDwEIpzi/blobs/7V8XzAQkKCGlnYJwn64y/Core%20Signup.jpg" alt=""><figcaption><p>Dative Core Signup new account</p></figcaption></figure>

3. Fill in the registration form with your email, password, and other required information.
4. Click **Continue** to create your account.

<figure><img src="https://content.gitbook.com/content/4J4nvdCW2wCekDwEIpzi/blobs/QH8XvVqwa7b2H8P0Bo9x/Core%20Signup%20finish.jpg" alt=""><figcaption><p>Dative Core Signup new account</p></figcaption></figure>

### Step 2: Register your App

You need to register your app to get **API Key**, note that you need to purchase the app exclusively in [**codester**](https://www.codester.com/maravilhosinga) to obten a **purchase code**.

<figure><img src="https://content.gitbook.com/content/4J4nvdCW2wCekDwEIpzi/blobs/IBFMqgyoS5psAgnvIG2v/Core%20Signup%20new%20app.jpg" alt=""><figcaption><p>Dative Core new app</p></figcaption></figure>

1. FIll the for with all required informations.
2. Project name may be anything
3. **Application ID** and **Client Key** is your [Parse server App ID](/parse-server-setup/deploy-cloud-code), we got it in this step.
4. iOS **Package name** use iOS Bundle ID, the same as in [Firebase Setup](https://docs.booms.live/pages/wyIteQnLmjeMvoeA8u9P#step-1.2-add-firebase-to-your-ios-app)&#x20;
5. Android **Package name** use the same as in [Firebase Setup](https://docs.booms.live/pages/wyIteQnLmjeMvoeA8u9P#step-1.3-add-firebase-to-your-android-app)&#x20;
6. **Purchase code**, get it in codester after purchase of Boom Live App.
7. After filling all informations, then click in **Continue**.

<figure><img src="https://content.gitbook.com/content/4J4nvdCW2wCekDwEIpzi/blobs/L5fWGEsFV9Z8YS2RgkNN/Core%20Signup%20new%20app%20finish.jpg" alt=""><figcaption><p>Register new Dative App</p></figcaption></figure>

### Step 3: Get your API Key

Once evething done, you can now copy your Dative Core API Key

<figure><img src="https://content.gitbook.com/content/4J4nvdCW2wCekDwEIpzi/blobs/PNCEVcMVfJleTSd7SwxY/Core%20Signup%20new%20app%20API%20key.jpg" alt=""><figcaption><p>Dative Core Manage app</p></figcaption></figure>

<mark style="color:purple;">**Make sure that at the end of this progress, you have  saved for later use:**</mark>

* `Core API Key`


# Import and install app

The Dative app is developed with Flutter. We recommend using Android Studio or Visual Studio Code, but you are free to use any supported IDE of your choice.

Before you import the purchsed code from [**codester**](https://www.codester.com/maravilhosinga) in your computer and begin your app development, make sure to first install and setup correctly Flutter and Dart, the setup depends on your operating system and it's version. [Install flutter](https://docs.flutter.dev/get-started/install)


# Import project

After making sure that Flutter is installed and updated in your computer.

### Step 1: Open Android Studio

1. Launch **Android Studio** on your computer.

### Step 2: Open a Dative Project

1. In the Android Studio welcome screen, click on **Open**.
2. Navigate to the directory where you extracted your purchased `boom_vx_x_x.zip` Flutter project is located.
3. Select the root folder of your project (this folder should contain the `pubspec.yaml` file).
4. Click **OK** to open the project.

### Step 3: Install Flutter and Dart Plugins

1. If you haven't already installed the Flutter and Dart plugins, you will be prompted to do so.
2. Go to **File > Settings** (or **Android Studio > Preferences** on macOS).
3. Select **Plugins** from the left sidebar.
4. In the **Marketplace** tab, search for **Flutter**.
5. Click **Install** next to the Flutter plugin.
6. You will also be prompted to install the Dart plugin; click **Install**.
7. Restart Android Studio to activate the plugins.

### Step 4: Configure Flutter SDK

1. After reopening Android Studio, it may prompt you to configure the Flutter SDK path.
2. Click **Configure** and then **SDK Manager**.
3. In the left sidebar, select **Flutter**.
4. Click on **...** to browse and select the path to your Flutter SDK directory.
   * If you don't have the Flutter SDK installed, you can download it from the official Flutter website.
5. Click **Apply** and then **OK**.


# Install the app

This is where things are dificult, but don't worry that we handle it automatically, you just need to run 1 single command and Dative Core do everything for you.

## Step 1: Copy your firebase files to the project

1. Get `google-services.json` and `GoogleService-Info.plist` files we asked to save for later use in [Firebase Setup](https://docs.booms.live/import-and-install-app/pages/wyIteQnLmjeMvoeA8u9P#step-2.2-enable-google-login)
2. Paste them in your project folder `../assets/files`
3. Ignore `google-services-web.js`, it will be required once web version will be released.

<figure><img src="https://content.gitbook.com/content/4J4nvdCW2wCekDwEIpzi/blobs/JOVwfkGcmzJzdchkST6X/setup_files.jpg" alt="" width="375"><figcaption><p>Firebase files</p></figcaption></figure>

## Step 2: Replace config Data

1. Open `../pubspec.yaml`
2. Under `dative_core`
3. Add API key (from [Dative Core](/get-dative-core-api-key#step-3-get-your-api-key)) and Purchase Code (from [codester](https://www.codester.com)) under `Config`
4. Then uder `Setup` add other informations like, [admob](https://docs.booms.live/import-and-install-app/pages/VxgoEGcNMx6XzM0AEyeF#step-2.1-get-the-app-id) appid, [facebook](https://docs.booms.live/import-and-install-app/pages/JhVZ7zyuSabtzVVNQiIw#step-1.1-configure-facebook-login) appId, etc...
5. Ignore the `firebase_web_client_id` it will be required once web version will be released.&#x20;

<figure><img src="https://content.gitbook.com/content/4J4nvdCW2wCekDwEIpzi/blobs/jYRLsDurM7NZ1JqSevtF/setup%20files%20core.jpg" alt=""><figcaption></figcaption></figure>

## Step 3. Run install command

1. Open the terminal within Android Studio by selecting **View > Tool Windows > Terminal**.
2. Run install command:

```bash
dart run dative_core:install
```

<figure><img src="https://content.gitbook.com/content/4J4nvdCW2wCekDwEIpzi/blobs/7p0mOYmLmmxV4Aqbhlnp/core%20run.jpg" alt="" width="375"><figcaption></figcaption></figure>

If there is any issue, will it print a message and how to fix, else you will logs.

<figure><img src="https://content.gitbook.com/content/4J4nvdCW2wCekDwEIpzi/blobs/1KHDUgpifS51ggrWlywZ/core%20run%20ok.jpg" alt=""><figcaption><p>App Installed</p></figcaption></figure>


# Setup zegocoud and Server

Now it's time to connect your app to your parse server

1. Open `.../lib/app/config.dart` file
2. Change your Parse [Server URL](/parse-server-setup#step-3-configure-your-parse-server-app) and [Live Query URL](/parse-server-setup#step-3-configure-your-parse-server-app)
3. Change your Zegocloud [AppID](/zegocloud-setup#step-3-get-the-app-id-and-app-sign) and [App Sign](/zegocloud-setup#step-3-get-the-app-id-and-app-sign)

<figure><img src="https://content.gitbook.com/content/4J4nvdCW2wCekDwEIpzi/blobs/x8jQLf1oG1K2nGBBoFZK/setup%20server%20app.jpg" alt=""><figcaption></figcaption></figure>


# Run and compile the app

### Step 1: Run Flutter Packages Get

1. Once the project is loaded, open the terminal within Android Studio by selecting **View > Tool Windows > Terminal**.
2. Run the following command to fetch the dependencies:

   ```bash
   flutter pub get
   ```

### Step 2: Run Your Flutter Project

1. Make sure you have a connected device or an emulator running.
2. In the top toolbar, select your target device from the device dropdown.
3. Click the **Run** button (green play icon) to build and run your Flutter project.


# Update Branding

Your app needs your brand that's why you need to also update your app icons, splash, logo name and colors.

It's really simple to update all.

## Step 1: Get your logos and icons in to the project

1. Copy your logo and paste your icons and logo, make sure to use exactly name and format you will found in these folders: `.../assets/icons` and `.../assets/images`

<figure><img src="https://content.gitbook.com/content/4J4nvdCW2wCekDwEIpzi/blobs/FgDRbTzsqQPFqr3yNsZc/app%20icons.jpg" alt=""><figcaption></figcaption></figure>

## Step 2: Run commands

Run commands to automatically create Icons, Splashes Screen, and place logos everywhere's needed

Open the terminal within Android Studio by selecting **View > Tool Windows > Terminal**.

1. Run command to generate splash screen:&#x20;

```bash
dart run flutter_native_splash:create
```

2. Run command to generate icons and logo:&#x20;

```bash
flutter pub run flutter_launcher_icons
```

## Step 3: Change app colors

1. To change your app colors, go and open `.../lib/theme/colors.dart` file
2. Find **kPrimaryColor, kSecondaryColor** and **kPrimaryLightColor**
3. Click on each line and change them, then save.


# Customizations

You can customize many important aspects of the app by changing their values in the config.dart and setup.dart files.

## Admob Adunit IDs&#x20;

At this time, if you have successfully compiled your app, you may notice that ads are showing in debug mode but not in release mode. This is because you need to update your own AdMob Ad Unit IDs.

1. Open `.../lib/app/config.dart`
2. [Find ad units](/admob-setup#step-3-create-an-a-d-units-5-in-total) and change them

<figure><img src="https://content.gitbook.com/content/4J4nvdCW2wCekDwEIpzi/blobs/O83wHtc5yY9QOct2WGXJ/custom%20admob%20units.jpg" alt=""><figcaption><p>Admob customization</p></figcaption></figure>

## App importants URLs

Even with a powerful, well-designed, and developed app, there are three required web pages that you must include before you publish the app in the Google Play Store and Apple App Store. These are the Privacy Policy, Terms of Use, and Help page..

1. Find urls and change them
2. Open `.../lib/app/config.dart`

<figure><img src="https://content.gitbook.com/content/4J4nvdCW2wCekDwEIpzi/blobs/SOrHHuFTkp0hzn6MKJtE/custom%20urls.jpg" alt=""><figcaption></figcaption></figure>

## App Configuration

In the file located in `.../lib/app/setup.dart` you will find several configurations of your app, they are default values are good, but you can adapt them per your needs.

<figure><img src="https://content.gitbook.com/content/4J4nvdCW2wCekDwEIpzi/blobs/ERwTOnVDZW5BSakAd8YG/custom%20setup.jpg" alt=""><figcaption></figcaption></figure>

## Remote Configuration

Things change and perhaps you may need to update some of your configurations. The problem is that users will also need to update the app for these changes to take effect.\
\
To help you, we made some of your configurations updateable online, directly in your dashboard, and they will also be available in the Admin Panel

1. Go to your Parse Server Dashboard
2. Click in **Config** Under **Core**

<figure><img src="https://content.gitbook.com/content/4J4nvdCW2wCekDwEIpzi/blobs/fyI3qQ2HieB1TJa5WsQM/remote%20config.jpg" alt=""><figcaption></figcaption></figure>

**This is the full list of remote config.**

| Type    | Parameter               | Default Value | Desctiption                |
| ------- | ----------------------- | ------------- | -------------------------- |
| Boolean | all\_ads\_activated     | false         | Show all Ads               |
| Boolean | apple\_login            | true          | Enable Apple login for iOS |
| Boolean | banner\_ads\_home       | true          | Show Banner Home Ads       |
| Boolean | facebook\_login         | true          | Facebook login             |
| Boolean | google\_login           | true          | Google Login               |
| Boolean | native\_ads\_encounters | true          | Show Native Ads            |
| Boolean | native\_ads\_live       | true          | Show Live Native Ads       |
| Boolean | open\_app\_ads          | true          | Show Open App Ads          |
| Boolean | phone\_login            | true          | Phone Login                |
| String  | stream\_id              | 123455678     | Zegocloud App ID           |
| String  | stream\_key             | xxxxxxxx      | Zegocloud App Sign         |
| String  | stream\_type            | zegocloud     | Stream provider            |
| Boolean | stripe\_payment         | false         | Payment by Card            |
| Boolean | withdraw\_bnb           | true          | BNB Payout method          |
| Boolean | withdraw\_payoneer      | true          | Payoneer Payout method     |
| Boolean | withdraw\_paypal        | true          | PayPal Payout method       |
| Boolean | withdraw\_usdt          | true          | USDT Payout method         |

<table data-header-hidden><thead><tr><th width="194">Type</th><th>Parameter</th><th width="152">Default value</th><th>Desctiption</th></tr></thead><tbody><tr><td>Number</td><td>payout_arrival_hours</td><td>48</td><td>Time needed to process payout (in Hours)</td></tr><tr><td>Number</td><td>payout_bnb_fees</td><td>1.5</td><td>Fees percentage charged to send BNB payout</td></tr><tr><td>Number</td><td>payout_payoneer_fees</td><td>2.5</td><td>Fees percentage charged to send Payoneer payout</td></tr><tr><td>Number</td><td>payout_paypal_fees</td><td>3.5</td><td>Fees percentage charged to send Paypal payout</td></tr><tr><td>Number</td><td>payout_usdt_fees</td><td>1.5</td><td>Fees percentage charged to send USDT payout</td></tr><tr><td>Number</td><td>live_ads_after</td><td>6</td><td>After how many each many Item to show native ad in Live Screen</td></tr><tr><td>Number</td><td>diamonds_earn_percent</td><td>60</td><td>Percent of credits to give the streamer, will be converted in diamonds, based on 60 diamonds = 1$</td></tr><tr><td>Number</td><td>diamonds_needed_to_redeem</td><td>5000</td><td>Minimum diamonds streamer need to ask for payout, based on 1$ = 200 Diamonds </td></tr><tr><td>Number</td><td>withdraw_percent</td><td>50</td><td>Percent of diamonds you will give to streamer, based on 100 credits = 1$</td></tr></tbody></table>

More parameters will be added. Note that for now, you need to add these parameters yourself, but it’s optional since if nothing is set, the default value will be used.

<mark style="background-color:green;">When the Advanced Admin Panel is added, these parameters will be added automatically</mark>.