Overview
Complete multivendor and multipurpose eCommerce solution
SuperApp is a complete multivendor and multipurpose eCommerce solution designed for operating various businesses simultaneously like Food, Groceries, eCommerce, Parcel, Pharmacy deliveries, etc from one platform. Developed for convenience, SuperApp offers a seamless experience through mobile apps and web interfaces.
It is built using Laravel (v12) and Flutter framework to offer a robust and scalable solution.
Laravel is a PHP framework known for its expressive and elegant syntax. It is robust and easy to understand, providing a solid foundation so you can focus on creating features without worrying about the underlying details.
Flutter, developed by Google, is an open-source framework for building mobile applications. It is used to create apps for both Android and iOS, making it a primary tool for cross-platform development.
SuperApp Components
SuperApp consists of the following components:
3 Mobile Applications:
- Customer Application: Developed using Flutter, available for Android, iOS, and web.
- Delivery Boy Application: Developed using Flutter for Android and iOS.
- Store Application: Developed using Flutter, available for Android and iOS.
2 Web Panels:
- Super Admin Panel: Built with Laravel, allowing role-based access management.
- Store Panel: Built with Laravel, allowing store owners to manage roles and access.
1 Landing Page
If anything goes wrong with the customization you made, we won’t be responsible for that.
Prerequisite
System requirements and dependencies
SuperApp is dependent on PHP version 8.2 or higher and MySQL version 5.7 or later. Additionally, the following server configurations and PHP extensions are necessary:
| Extension | Description | Required |
|---|---|---|
| Mod_rewrite for Apache | URL rewriting module | Yes |
| BCMath PHP extension | Arithmetic operations with numbers of arbitrary size | Yes |
| Ctype PHP extension | Character type checking | Yes |
| JSON extension | JSON data manipulation | Yes |
| Mbstring extension | Multibyte string functions | Yes |
| OpenSSL extension | Cryptography and SSL/TLS support | Yes |
| PDO extension | Database access abstraction | Yes |
| Tokeniser extension | PHP tokenization | Yes |
| XML extension | XML parsing | Yes |
| Zip extension | Zip archive handling | Yes |
| Fileinfo extension | File type detection | Yes |
| Gd extension | Image processing | Yes |
| Sodium extension | Modern cryptography | Yes |
| Mysql PDO extension | MySQL database access via PDO | Yes |
Typically, these extensions are enabled by default on most servers. However, it is advisable to verify the configuration with your hosting provider to ensure compatibility with the project.
Please do this very carefully. We will not be responsible for your mistake.
Environment Configuration
Setting up your server environment
CPanel Configuration
Before starting the admin installation, the database must be configured for the application.
Database Configuration
For creating the database, the following ways must be maintained:
Go to MySQL Databases in your cPanel
Create a new database for the application
Create a user for the database
Add the user to the database
Give privileges to the user
Avoid using hash ("#") in your database password as it may cause connection issues.
From one hosting provider to the next, the interface or step differs. Speak with your server provider if you're having trouble configuring the database. You can also get in touch with us for any type of consulting if you need it.
Domain Configuration
Navigate to your cPanel and locate the page for domain configuration. For SuperApp, it is essential to have two domains or subdomains.
- Utilise your main domain to host the customer web panel.
- Create a subdomain for the admin panel. For instance, if your domain is 'example.com', generate a subdomain such as 'admin.example.com' and host the admin panel on that subdomain.
Installation
Step-by-step installation guide
After downloading the code from Jeshify, upload the AdminNewInstall.zip in your directory and extract the zip file. SuperApp can be installed on your main domain or subdomain: For Example, yourdomain.com or subdomain.yourdomain.com
Upload the AdminNewInstall.zip file to your server directory
Extract the zip file in your hosting directory
Import database.sql in phpMyAdmin to the database we created earlier
Configure the .env file with your database credentials and other settings
Set proper file permissions (folders to 755, files to 644)
Default Admin Login URL: Your-domain/login/admin
Default Restaurant Panel Login URL: Your-domain/login/store
Your software is ready to run. Click on the Admin Panel or view the Landing Page.
Mandatory Setup
Essential configurations for admin panel
Map Configuration
Client should buy Map API from Google for enabling the maps into the panels. Without buying those APIs clients cannot load Google maps into the panels for selecting zones.
Now go to your admin panel then "Third party APIs" menu, here you will find two inputs for map api key client and map api key server. You can restrict the client with admin panel domain and the server key with your server ip address. If you don't want any restriction then you can use single api key for both field.
For generating map api key you can watch this video: Google Maps API Setup Tutorial
Business Setup
In the admin panel we have a menu called Business Setup where you can set your logo, timezone, country, time format, location, currency and many more things.
Mail Configuration
Mail Configurations part admin can set his Mailer name, host, driver, user name, Email ID and his own encryption method and password for this SMTP Mail setup. This configuration is used for sending password recovery mail for the store.
Firebase Configuration (for notification)
The Firebase Push Notification will send messages for general notifications, chatting notification, order place notification and every order status notification.
If you don't have a project, create one
Click on the settings icon from left sidebar (beside Project Overview) & Go to Project Settings
From the Project Settings, go to Service Accounts tab
Click on Generate new private Key to generate the key. It will automatically download a .json file
Open the file with any text editor, copy the contents in it, and add those to Service File Content in 3rd Party > Push Notification > Firebase Configuration in admin panel
Payment Configuration
In this part Admin will introduced with the payment gateways. Cash on delivery, Digital Payment like SSLCOMMERZ, Razor pay, Paypal, Stripe, Paystack, Senang Pay, Flutterwave, MercadoPago, Payment accept are available for payment gateways. He can make the necessary setup of making the status active and inactive of those payment gateways as well.
SMS Module Configuration
SMS Module is used for SMS Gateways for OTP sending in the simplest way of user verification. Customer will get OTP when they create their own account and for password recovery.
Flutter Prerequisites
Requirements for Flutter app development
- IDE: Android Studio or Vs code. Android Studio recommended
- JDK: Ensure that you download and install JDK 17 on your device
- Flutter SDK: setup (version 3.38.1 Stable)
- JDK 17: with path setup
- Xcode: 26.0 for IPA file build
- Supported platforms: Android, iOS and Web
These prerequisites are necessary for setting up the development environment for SuperApp's Flutter applications (Customer App, Delivery Boy App, and Store App).
Environment Setup
Setting up development environment for different OS
Windows Setup
Install Android Studio
Download Android Studio from the official website
Run the Installer and follow the installation wizard
Start Android Studio and install additional SDK components
Install Flutter SDK
Download Flutter SDK from the official website
Extract Flutter archive to a location on your machine
Add Flutter to System Path in Environment Variables
Verify Flutter installation by running flutter doctor in Command Prompt
Install Flutter and Dart plugins in Android Studio
Linux Setup
Similar steps apply for Linux with platform-specific installation packages.
Mac Setup
Similar steps apply for macOS with platform-specific installation packages.
App Mandatory Setups
Essential configurations for Flutter apps
Run an existing flutter project on IDE
To begin, it's essential to verify that your Flutter and Integrated Development Environment (IDE) setup has been configured accurately.
Execute the command flutter doctor in your terminal. If any issues arise during this process, make sure to address and resolve them promptly.
Open your project in Android Studio or VS Code
Run flutter pub get from the terminal in the project directory to fetch the dependencies
After the dependencies are installed, you should be able to run the app
Change App Logo and Icon
App Logo:
Go to <project>/assets/images/ and replace logo.png with your own logo.
Please use the exact file name as described; otherwise, it will not work.
App Icon:
You can generate your app icon using online tools. Then:
- Go to
/android/app/src/main/resand replace all mipmap folders with your generated icon android folder - Go to
/ios/Runner/Assets.xcassetsand replace Assets.xcassets with your generated Assets.xcassets folder
Change App Name
You need to set your app name in three different places:
Change Base URL
First you have to install your admin panel. For example: If your admin login url is https://your_domain.com/admin/auth/login then the base url will be https://your_domain.com
Ensure that don't put slash(/) at the end of your base url. It should be like: https://your_domain.com (not https://your_domain.com/)
Setup Firebase for Push Notification
First, you have to change your package name. Then have to create a Firebase project from https://console.firebase.google.com
Do not create multiple projects on your firebase console if you have multiple apps like User App or Web, Provider App and Serviceman App. Create only one project and add multiple apps under the project.
Android Setup:
- Add an Android app under your firebase project with your own package name and app name
- Download the google-services.json file and paste it in
<project>/android/app/folder - Replace notification_icon.png in
<project>/android/app/src/main/res/drawable/
iOS Setup:
- Add an iOS app under the same project and download GoogleService-Info.plist
- Paste it under
<project>/iOS/folder
Add Google Map API Key
You need to generate the google API key. Visit this link: https://developers.google.com/maps/documentation/embed/get-api-key
You need to enable the mentioned APIs: Direction API, Distance Matrix API, Geocoding API, Maps SDK for Android, Maps SDK for iOS, Maps JavaScript API, Place API, Geolocation API, Routes API, Place API (New)
You must need to add Billing to your Google Console for using this map key.
After generating the API key, you have to put it in 3 different places for Android, iOS and web:
Customization
Customizing your SuperApp installation
Country Code
If you wish, the application will set your country code automatically in the login, register, forget password or guest track order. To do this, just set up your country in the Admin Panel > Business Settings.
Language
Add New Language:
Go to /assets/language and create a new file with your language code (e.g., es.json for Spanish)
Copy all data from en.json and paste it into your created file
Translate all English text placed after colon(:) to your expected language
Add your country picture in the <Project>/assets/images folder
Update lib/utils/images.dart and lib/utils/app_constrants.dart files
Change App Color
If you want to customize app theme color then follow these steps:
Change App Font
At SuperApp, we use the Poppins font. However, if you want to change the app's font, then follow these steps:
Download your preferred font and paste it to <project>/assets/font/ folder
Mention them in <project>/pubspec.yaml file
Replace the font family name in the <project>/lib/util/app_constants.dart file
Change Notification Sound
Replace notification sound files in:
<project>/android/app/src/main/res/raw/notification.wav<project>/assets/notification.mp3ornotification.wav
Please use the exact file name as described. And make sure the audio file is small in duration and file size. Otherwise, it will not work.
App Build & Release
Building and releasing your SuperApp applications
Build for Android
Run the following command to build the APK:
This command will compile your Flutter code and generate the APK file. You can find the APK in the build/app/outputs/flutter-apk directory inside your project folder.
For generating split APKs for different architectures:
For deploying to Play Store, follow the official documentation: Flutter Android Deployment
Build for iOS
There is no general way to generate apps for iOS. Apple doesn't allow you to install apps like this. If you want to install it on your iOS device, then you have to deploy it on TestFlight or AppStore.
For deploying to App Store, follow the official documentation: Flutter iOS Deployment
For iOS builds, you need to have an Apple Developer account and proper certificates/provisioning profiles set up in Xcode.
System Update
Updating your SuperApp system
Safely Live System Update
Suppose your system's current version is V 2.0, now you want to update your system to V2.1 and also want to force users to update the system then you can follow this to update your system safely.
Generate your appbundle for PlayStore and ipa for AppStore using your update version's code (V 2.1)
Add this version in your project's lib/util/app_constants.dart file:
Update your app on both AppStore and PlayStore
Go to your Admin Panel > Configurations > Third Party > App Settings and set app minimum version to V 2.1
Only friction or double value will be added in the app version. So if your release version is 2.1.1, then add app version 2.2. Which is maintained for force update. In admin, there must be added the app version 2.2.
Always test the update process in a staging environment before applying it to your live system. This helps identify and fix any issues before they affect your users.