Introduction

The app is connected with Laravel 6 based CMS using REST APIs, the following documentation will guide you through the process to connect the app with your backend. This guide assumes you have some experience in setting up PHP based web applications and Laravel Framework 6. Our mobile app supports Android platform, please ensure you have Android setup on your machine before following this tutorial, if you are new, please follow Android Developer Guide.

Before you begin please ensure you have all of the dependenices to succesfully build and deploy this project. You will need:

  1. Server with Php version 7.2 or above and Mysql 5.7 and above database

  2. System running following versions

       Node.js version 8.9.3
   Ionic 3.9.2
   Cordova 9
   Java 8 for Android
  3. Firebase account with billing enabled
  4. OneSignal account

Instructions for setting up server

Following section explains how to setup our Laravel based code on server and configure it properly

  1. Server Requirement

    The server on which you are going to deploy the backend must fulfill the following requirements:

    • PHP >= 7.2.0
    • Mysql 5.7
    • BCMath PHP Extension
    • Ctype PHP Extension
    • JSON PHP Extension
    • OpenSSL PHP Extension
    • PDO PHP Extension
    • Mbstring PHP Extension
    • Tokenizer PHP Extension
    • XML PHP Extension

  2. Deploying Backend

    Follow these steps:

    • Extract the cookfu.zip on your server
    • For example if your domain is http://cookfu.com then you will be able to access the backend as http://cookfu.com/cookfu/public
    • Use our simple Installation Wizard to setup your server by visiting /installer
    • For example, http://cookfu.com/cookfu/public/installer
    • Fill up the form and your server will be configured now
    • After you hit the install button, you will also get the url of admin panel
    • If you want to make any customization or have any specific requirement, please follow below points, otherwise you can now skip to Mobile App section below

  3. Configuration

    All the major configuration values you will need to set in .env file which is present in root folder of the accompanied source code. This file must be writable by webserver’s user. Following are the most important values, you may set other values in .env as well if you have experience and requirment to do so:

    • App related - Very Important:
      • APP_NAME: Title of your app
      • APP_URL: Url of your backend
      • APP_DEBUG: Set it to false in production environment
    • Database related - Very Important:
      • DB_HOST: Database host, usually it’s localhost
      • DB_PORT: Database port, incase of mysql it’s usually 3306
      • DB_DATABASE: Database Name
      • DB_USERNAME: Database username
      • DB_PASSWORD: Database password
    • Email Related: Email integration is provided with Mailgun, Amazon SES, SMTP. For more details refer to https://laravel.com/docs/5.5/mail. If you are integrating with mailgun, you can simply set following values in .env
      • MAILGUN_DOMAIN
      • MAILGUN_SECRET

      Also make sure to update following keys with valid values:

      • MAIL_FROM_ADDRESS
      • MAIL_FROM_NAME

      If you need more configuration or advance setting, you can look for keys starting with MAIL_ in .env

    • Push Notification: For push notification our system uses OneSignal. Create an account on OneSignal here.
      • Step 1: Create new OneSignal Account
      • Step 2: Create three new apps in OneSignal. One for customer app, one for store app and one for driver app
      • Step 3: Update the following keys in .env file of our project
      • ONESIGNAL_APP_ID_CUSTOMER
      • ONESIGNAL_REST_API_CUSTOMER
      • ONESIGNAL_APP_ID_STORE
      • ONESIGNAL_REST_API_STORE
      • ONESIGNAL_APP_ID_DRIVER
      • ONESIGNAL_REST_API_DRIVER

    • Payment gateway: Our system comes integerated with 3 major payment gateways out of the box i.e. Stripe, Paypal and Payu. While Paypal and Payu are configured client side, you will need to update your .env file for Stripe Integeration. Since all of these payment gateways are for Credit/Debit card payment we suggest to use one of them only. Enabling all or any of two them is not tested.

      Stripe:

      • STRIPE_KEY
      • STRIPE_SECRET

  4. Database

    In accompanied source code you will find a sql file named cookfu.sql. Create the database and then import the file in your database.

  5. Image upload

    Make sure public/storage is writable by webserver user. In general giving 777 permission to public/storage is sufficient.

  6. Admin Panel

    • Open public/admin/assets/appConfig.json
    • Update value of appName, apiBaseUrl and mapsApiKey(Google Maps API key)
    • Make sure you have enabled Maps Javascript API and Billing in your https://console.cloud.google.com account as well and entered the correct key in mapsApiKey variable

  7. Customize Admin Panel

    Admin panel is developed in Angular 7 and shipped in seperate folder. You will need to update app title and base url. If you need to make any changes in admin other than this, follow next steps

    • Open cookfu-admin.zip, it’s an Angualr 7 based project, nodejs version 8 is required
    • Run npm install command
    • If you are not familiar with Angular 7 we will suggest you to get basic idea from https://angular.io/guide/quickstart
    • After making the required changes run a command ng build --prod
    • Now angular would have created/updated the dist folder in root folder with updated compiled files
    • You need to copy all the files in dist folder to you Laravel’s public/admin folder.
    • For example cp -r cookfu-angular/dist/* cookfu/public/admin/ assuming cookfu-angular is your angular project folder and cookfu is your laravel project folder

Instructions for building mobile app

Following section explains how to connect mobile app to server and build it properly

  1. Setup Firebase

    • Login to http://console.firebase.google.com
    • Click on Add project to add new project.
    • Enter the name of your project and click on Create Project
    • Now you have to Register apps in this project.
    • Click Add app
    • Choose platform android for Android apps and ios for iOS Apps
    • Each app has its unique ID known as “Package name” or “ApplicationId”. For more info on how to name one visit https://developer.android.com/studio/build/application-id
    • Enter Android Package Name in case of Android and iOS bundle id in case of iOS. In both platforms this is your apps’s packge name.
    • Enter a App Nickname
    • Enter your app signing certificate(Optional but important in order to make features work like social login and otp verification. here is how to have one -> https://developers.google.com/android/guides/client-auth)
    • Click Register app.
    • Upon succesful registration of app you’ll be provided with your configuration file
    • In case of Android this will be named google-services.json and in case of iOS this will be named GoogleService-Info.plist
    • SHA-1 keys - In case of Android enter your debug or release SHA-1 key depending on your build type(debug or release). Refer https://stackoverflow.com/questions/15727912/sha-1-fingerprint-of-keystore-certificate for help.
    • Next click continue or skip to proceed and Repeat this step 2 more times to register app for Restaurant’s application and Driver’s application
    • Upon registering 3 applications in your firebase project you should have 3 applicationIds and 3 configuration files(google-services.json).
    • Phone Authentication - Enable Phone auth from Authentication in side menu.
    • Database - Enable Realtime Database in Test Mode from Database in side menu. We recommend that you enter some random value in here so that it doesn’t reset.

    • Storage - Enable Storage from from side menu. When asked for databse rules enter following.

      rules_version = '2';
service firebase.storage {
  match /b/{bucket}/o {
    match /{allPaths=**} {
      allow read, write;
    }
  }
}

  2. Google API keys

  3. Download/Setup NodeJs and Ionic

    • Following softwares must be installed on your system before you start building your app.

        Node.js version 8.9.3
  Ionic 3.9.2
  Cordova 9
    • Having exact version is neccesary to succesfully building the app. If you are having any trouble in build, please ensure you have the same versions installed as mentioned above
    • To install Node.js version 8.9.3 on your system https://nodejs.org/en/blog/release/v8.9.3/. Verify installattion by running node -v you should see version 8.9.3 output.
    • To install ionic@3.9.2 run npm install -g ionic@3.9.2
    • To install cordova@9.0.0 run npm install -g cordova@9.0.0

  4. Configure Application

    • Add google-services.json aquired from Step 1 into respective project’s app folder.
    • Before starting to build your app you need to edit config.xml and src/app/app.config.ts files

    • In config.xml make following changes:

      • Application’s package name/application id in id parameter in line no. 2
      • Application name in line number 3

    • app.config.ts includes all other necessary configuration. Let’s look at each of them.

      • appName - Name of your application, this one is used to display app’s name inside the app.
      • apiBase - Enter your api base url. For example https://cookfu.com/cookfu/public/
      • googleApiKey This is used for google maps services. In firebase console go to Project -> Project Overview -> Project Setting -> General and copy Web API Key and paste in here.
      • oneSignalAppId - Register your apps here https://app.onesignal.com/ (3 - user’s, store’s and delivery guy’s application). Get respective OneSignal app ID’s to copy in here.
      • oneSignalGPSenderId - In firebase console go to Project -> Project Overview -> Project Setting -> Cloud Messaging tab and copy Sender ID and paste in here.
      • firebaseConfig Used for firebase realtime database and phone authentication. See this for setup instructions https://firebase.google.com/docs/web/setup#config-object

  5. Configure Payment Gateways

  6. Running Project

    Once you have configured your application, you can run and test in browser by following these steps:

    • Open your desired terminal and navigate to the source folder.
    • Run npm install to install project dependencies.
    • Run ionic serve to run your project in browser.

  7. Android Builds

  8. Deploy App

    Deploying apps on Google Play Store and Apple App Store is out of the scope of this document. Kindly refer to this guide for further instructions.

Support

If you are facing any issue while using our project you can reach us to at our Support email. Any other way of communication is not supported. Make sure you have followed each and every step mentioned in the doumentation before raising your support request

You need to share following information in your support request:

  1. Clear statement about what issue you are facing
  2. Screenshots of the problem you are facing. Screenshot must indicate the exact problem you are facing.
  3. Console logs from browser’s developer tools indicating error
  4. Base url of your project, link to the server where you deployed the backend. Backend support can not be provided for localhost
  5. Admin credentials of your backend, if you have changed the default one
  6. Access to your server if problem is related to your backend deployment
  7. src/app/app.config.ts file from mobile app source code
  8. package.json file from mobile app source code

If you do not include the above information in your support request, your support request will not be entertained