Introduction

Chuckle Chat

If you have any questions that are beyond the scope of this help file, Please feel free to email via Support.

Basic

As This is complete system for web and mobile apps, it is compulsory to have some basic knowledge in both server side and mobile app development if you want to do the installation, setup and publishing with your branding yourself..

1. Flutter SDK and JDK with path setup in your IDE.
2. Real server related knowledge like apache or local machine server,nodejs we preferred to use a real server.
3. Server related knowledge and we preferred cPanel in your server for quick installation
4. Basic knowledge in PHP, Yii2, Nodejs and Flutter if you want to do some customization yourself (Not compulsory).
5. basic knowledge about google cloud and firebase.

Server

• Requires PHP v8.1 and MySQL.
• Mod_rewrite Apache
• Ctype PHP, JSON, PDO, XML, Zip, Gd Extension
• Nodejs v18.16.0
• SSL Required
• Preferred Server: DigitalOcean, AWS

Mobile app

• Android studio or VC code
• Flutter SDK setup (version 3.3.0 Stable)
• JDK with path setup (only for vs code)
• Xcode 13.2+ for IPA file build
• Android studio for APK file build

Install on server

After download the code from codecayon, upload the backend code zip file (Chuckle_chat_backend_v1.0.zip) in your server root and extract the zip file. Backend admin panel can be installed on a domain or subdomain: For Example, yourdomain.com OR xyz.yourdomain.com.

Database setup

Create a new database from your server MYSQL database “MySQL® Database Wizard”

Create a DB user to the database and link that database to the DB user and give permission

Import Mysql database file into your database. database file can be find in doc/db folder in given code.
For new setup use Chuckle_chat_v1_0.sql file

Db configuration can be updated in common/config/main-local.php.
Update dbname, username and password.

<?php
              return [
                  'components' => [
                      'db' => [
                          'class' => 'yii\db\Connection',
                          'dsn' => 'mysql:host=localhost;dbname=DB_NAME####',
                          'username' => '#####',
                          'password' => '######',
                          'charset' => 'utf8',
                      ],
                      'mailer' => [
                          'class' => 'yii\swiftmailer\Mailer',
                          'viewPath' => '@common/mail',
                          'transport' => [
                              'class' => 'Swift_SmtpTransport',
                              'host' => 'smtp-relay.sendinblue.com',  // e.g. smtp.mandrillapp.com or smtp.gmail.com
                              'username' => '############',
                              'password' => '###########',
                              'port' => '587', // Port 25 is a very common port too
                              'encryption' => 'tls', // It is often used, check your provider or mail server specs
                          ],
                      ],
                      


                  ],
              ];

            

Site Url and Envato purchase code

<?php

              'adminEmail' => 'admin@yourdomain.com',
              'supportEmail' => 'support@yourdomain.com',
              'senderEmail' => 'admin@yourdomain.com',
              'senderName' => 'Chuckle Chat',
              
              'siteMode' => 1, // 1 for live, 2 for testing , 3 demo
              'siteUrl' => 'http://example.com',// domain here
              'enventoPurchaseCode' => '##########', // envato purchase code
              'storageSystem'=> 1,// storage system (local storage =1, AWS S3=2, AZURE=3)
              's3' => [
                  'key' => '##############',
                  'secret' => '##############',
                  'region' => '##############',
                  'defaultBucket' => '#########', //name
                  'storageUrl'=>'https://[bucket_name].s3.amazonaws.com'  //aws s3 storage url /cdn url
                  
                  
              ],


            

All done for appache srever, your software is ready to run.
Admin Url : youdomin.com/backend/web/index.php
Login information :
Username : admin
Password : 123456

Nodejs Chat Socket Setup

We are using nodeJs socket programming for chat, Use following instruction for chat socket setup
All nodeJs chat code will be in /chat forder

Nodejs v18.16.0 must be installed on your server
To confirm you have nodejs install, try to run command in your console :

node -v

Output
v18.16.0

It the nodejs is already not install you can install Nodejs with few steups.
Open the ssh terminal and run following commands:

To get this version, you can use the apt package manager. Refresh your local package index first:

sudo apt update

sudo apt install nodejs

node -v

Output
v18.16.0

sudo apt install npm

You can update configuration filechat/config.json with given fields

{
  "port":4000,  //server port
    "live":{    // add your db information
      "host": "127.0.0.1",    
      "user": "######",
      "password": "######",
      "database": "#######"
    },
    "dev":{ // leave it blank
      "host": "####",
      "user": "#####",
      "password": "####",
      "database": "###"
    }
  },
  "encryptionKey":"##########################", // enter key for encryption chat eg. bbC2H19lkVsQDf74rtNMQdddFloLyws
  "storageUrl":"https://[bucket_name].s3.amazonaws.com   OR  https://yoursite.com/uploads",  //Use bucket url for AWS S3 OR use https://yoursite.com/upload for local storage   Check For S3
  "pushNotification":{    
      "databaseURL": "https://q#############.firebaseio.com"         See here
  },
  "voipNotification":{                                               Check documentation to create
    "key": "cert/AuthKey_#####.p8", // .p8 file
    "keyId": "########", //67J4MZG469
    "teamId": "########", // T937GPNTUY
    "bundleId":"###########"  //com.example.app
  },
  "sslCertificatePath":{
    "isSsl":true,   //if ssl not available then make fasle
    "key": "############/##privkey.pem",     // ssl key certificate path
    "cert": "##############/##fullchain.pem" // ssl certificate path
    
  }

        

Step 3

Firbase Setup

Start node server

After installing all dependencies and updated the configuration, you must start node server :
Open a terminal and nvigate to the /chat folder that contain the file "index.js"
Run following command to start server :

          cd /path/to/your/root forlder/chat
          node index.js
        
        

          cd /path/to/your/root forlder/chat
          pm2 start index.js
        
        

Mandatory setup

Mail Configuration (SMTP)

Mail Configurations part admin can set his Mailer host, user name and his own encryption method and password for this SMTP Mail setup. This configuratin is used for sending mails.

MAil configuration can be updated in common/config/main-local.php.

<?php
        return [
            'components' => [
                'db' => [
                    'class' => 'yii\db\Connection',
                    'dsn' => 'mysql:host=localhost;dbname=DB_NAME####',
                    'username' => '#####',
                    'password' => '######',
                    'charset' => 'utf8',
                ],
                'mailer' => [
                    'class' => 'yii\swiftmailer\Mailer',
                    'viewPath' => '@common/mail',
                    'transport' => [
                        'class' => 'Swift_SmtpTransport',
                        'host' => 'smtp-relay.sendinblue.com',  // e.g. smtp.mandrillapp.com or smtp.gmail.com
                        'username' => '############',
                        'password' => '###########',
                        'port' => '587', // Port 25 is a very common port too
                        'encryption' => 'tls', // It is often used, check your provider or mail server specs
                    ],
                ],
                


            ],
        ];

      

Storage Setting

We are giving following three option to store media files. You can choose one storage system according to your requirements

• Local server storage
• AWS S3
• Azure Storage

<?php

        'adminEmail' => 'admin@yourdomain.com',
        'supportEmail' => 'support@yourdomain.com',
        'senderEmail' => 'admin@yourdomain.com',
        'senderName' => 'Chuckle Chat',
        
        'siteMode' => 1, // 1 for live, 2 for testing , 3 demo
        'siteUrl' => 'http://example.com',// domain here
        'enventoPurchaseCode' => '##########', // envato purchase code
        'storageSystem'=> 1,//  storage system ( local storage =1, AWS S3=2, AZURE=3)
        's3' => [
            'key' => '##############',
            'secret' => '##############',
            'region' => '##############',
            'defaultBucket' => '#########', //name
            'storageUrl'=>'https://[bucket_name].s3.amazonaws.com'  //aws s3 storage url
            
        ],
        'azureFs' => [
            'accountName' => '###########',
            'accountKey' => '##########',
            'container' => '#######'
            
        ],
        


      

<?php
        
        'adminEmail' => 'admin@yourdomain.com',
        'supportEmail' => 'support@yourdomain.com',
        'senderEmail' => 'admin@yourdomain.com',
        'senderName' => 'Chuckle Chat',
        
        'siteMode' => 1, // 1 for live, 2 for testing , 3 demo
        'siteUrl' => 'http://example.com',// domain here
        'enventoPurchaseCode' => '##########', // envato purchase code
        'storageSystem'=> 1,//  storage system ( local storage =1, AWS S3=2, AZURE=3)
        's3' => [
            'key' => '##############',
            'secret' => '##############',
            'region' => '##############',
            'defaultBucket' => '#########', //name
            'storageUrl'=>'https://[bucket_name].s3.amazonaws.com'  //aws s3 storage url
            
        ],
        'azureFs' => [
            'accountName' => '###########',
            'accountKey' => '##########',
            'container' => '#######'
            
        ],
        'testOtp' => '###',
        'apiKey.firebaseCloudMessaging'=> '##############',             See here
        'user.passwordResetTokenExpire' => 3600,


      

Agora key Setting

Setup Agora api key for audio video calling. You can get your keys. See here
After Getting the App ID, and App Certificate keys, update it from admin panel setting: Admin > Setting > App Setting

Amazone S3 Setup

We are using amazone s3 for storage files and images.

Create Bucket

You can create bucket on s3 with public access to follow this URL:
https://docs.aws.amazon.com/quickstarts/latest/s3backup/step-1-create-bucket.html .

Update AWS S3 Access key and secret access key

After generate the keys and secret, update it with bucket name on common/config/params.php

<?php
    
            'adminEmail' => 'admin@yourdomain.com',
            'supportEmail' => 'support@yourdomain.com',
            'senderEmail' => 'admin@yourdomain.com',
            'senderName' => 'Chuckle Chat',
            
            'siteMode' => 1, // 1 for live, 2 for testing 
            'siteUrl' => 'http://example.com',// domain here
            'storageSystem'=> 2,  // storage system (local storage =1, AWS S3=2)
            's3' => [
                'key' => '##############',
                'secret' => '##############',
                'region' => '##############',
                'defaultBucket' => '##############', //bucket name
                'storageUrl'=>'https://[bucket_name].s3.amazonaws.com '  //aws s3 storage url
                
                
            ],
    
    
          

Azure Storage Setup

We are using microsoft azure for storage files and images.

Create access keys (Account Name, Account Key, Container)

You can create azure setup from :
https://learn.microsoft.com/en-us/azure/storage/common/storage-account-keys-manage?tabs=azure-portal .

Update Azure Access keys

After generate the keys update it on common/config/params.php

<?php
          'adminEmail' => 'admin@yourdomain.com',
          'supportEmail' => 'support@yourdomain.com',
          'senderEmail' => 'admin@yourdomain.com',
          'senderName' => 'Chuckle Chat',
          
          'siteMode' => 1, // 1 for live, 2 for testing , 3 demo
          'siteUrl' => 'http://example.com',// domain here
          'enventoPurchaseCode' => '##########', // envato purchase code
          'storageSystem'=> 3,//  storage system ( local storage =1, AWS S3=2, AZURE=3)
          's3' => [
              'key' => '##############',
              'secret' => '##############',
              'region' => '##############',
              'defaultBucket' => '#########', //name
              'storageUrl'=>'https://[bucket_name].s3.amazonaws.com'  //aws s3 storage url
              
          ],
          'azureFs' => [
              'accountName' => '##############',
              'accountKey' => '##############',
              'container' => '##############',
              
          ],
    
          

Project access URL

Admin Panel

Socket Url (socketApiBaseUrl)

Rest API Endpoint Url (restApiBaseUrl)

iPhone app setup

Go to developer.apple.com and login using credentials Follow the instructions given in the link below to create bundle identifier.

Keep note of bundle identifier as we need it in firebase ios app setup and flutter ios app setup.

Enbale apple pay and push notification

Your need to enable push notification and apple login option in create identifer that you created in step 1. See below screenshot for refrence

Setup iOS app source code

Change bundle identifier

Replace the bundle identifier with your created bundle identifier above in ios app setup in apple developer account

Change app name

Add new app name in display name field

Change app icons

Go to "Assets.xcassets" folder and replace app icon as shown in below screenshot

Android app setup

Replace package name

Open the "build.gradle" file in android code, Replace the package with your own created package name as shown in below screenshot.

Change app name

Change app icons

Firebase app setup for social login and push notificatoions

Create new firebase project

Create iOS app in firebase project

Follow the below screenshots to Create ios app.

Download the plist file , We will use it later in flutter app.

Create android app in firebase project

Follow the below screenshots to Create android app.

Download the json file , We will use it later in flutter app.

Download the service account key and get database url for nodejs setup

Copy the server key key for push notifictaion in backend server setup

Enable social logins

Go to Authentication tab from left menu and click on get started

Google login

Select google sign in and enable it

Link firebase project with source code

Third party api keys

Facebook login setup

Giphy setup

ChatGPT setup

Stripe setup

Razorpay setup

Setup Google map api key for showing google map for location sharing in chat

Setup Google Admob api key for showing google ads

Change api urls

Go to "app_config_constants.dart" file and change api server(PHP) url and socket server(Node.js) url as shown in below screenshot

Change app name

Go to "app_config_constants.dart" file and change app and as below screenshot

Change app version for force update

Go to "app_config_constants.dart" file and change currentVersion value to current version number of the app that you are going to publish

Change color scheme

Change localization strings

Common Setup problems/Answer

<?php
                  return [
                      'components' => [
                          'db' => [
                              'class' => 'yii\db\Connection',
                              'dsn' => 'mysql:host=localhost;dbname=DB_NAME####',
                              'username' => '#####',
                              'password' => '######',
                              'charset' => 'utf8',
                          ],
                          'mailer' => [
                              'class' => 'yii\swiftmailer\Mailer',
                              'viewPath' => '@common/mail',
                              'transport' => [
                                  'class' => 'Swift_SmtpTransport',
                                  'host' => 'smtp-relay.sendinblue.com',  // e.g. smtp.mandrillapp.com or smtp.gmail.com
                                  'username' => '############',
                                  'password' => '###########',
                                  'port' => '587', // Port 25 is a very common port too
                                  'encryption' => 'tls', // It is often used, check your provider or mail server specs
                              ],
                          ],
                          
          
          
                      ],
                  ];
          
                

Support

If this documentation doesn't answer your questions, So, Please send us Email or contact via Skype.

Email : codepearl.contact@gmail.com
Skype : codepearl.contact@gmail.com
Working Days : Monday To Friday

We are located in GMT +5:30 time zone and we answer all questions within 12-24 hours in weekdays. In some rare cases the waiting time can be to 48 hours. (except holiday seasons which might take longer).

Changelog

See what's new added, changed, fixed, improved or updated in the latest versions.

Version 1.0 (17 Oct. 2023)

Initial Release