FoodPilot Documentation
๐Ÿ“ฆ CodeCanyon Premium Item

FoodPilot

Complete multi-platform restaurant management system. Includes Laravel admin API, Next.js customer web app, and Flutter mobile app for Android & iOS.

๐Ÿฆ Flutter 3.x โšก Laravel 12 โ–ฒ Next.js 16 ๐Ÿค– Android ๐ŸŽ iOS
๐Ÿ“–

Introduction

FoodPilot is a complete multi-platform restaurant management system consisting of three interconnected applications:

โšก

Admin Panel

Laravel backend API + admin dashboard for restaurant owners and managers.

โ–ฒ

Customer Web App

Next.js web application for customers to browse menus and place orders.

๐Ÿฆ

Mobile App

Flutter app for Android & iOS โ€” full ordering experience on mobile.

All three apps communicate through the Laravel REST API. Follow this documentation to install and configure each component in the correct order.

๐Ÿ—๏ธ

System Architecture

All platforms connect to one Laravel REST API. Install the API first before configuring the web or mobile apps.

โ–ฒ Next.js App
โ† REST โ†’
โšก Laravel API
โ† REST โ†’
๐Ÿฆ Flutter App

What's Included

  • โœ“ Laravel API source code
  • โœ“ Next.js customer web app
  • โœ“ Flutter mobile app (Android + iOS)
  • โœ“ Postman API collection
  • โœ“ Documentation

Tech Stack

  • โ€ข PHP 8.3+ / Laravel 12
  • โ€ข Node.js 18+ / Next.js 16
  • โ€ข Flutter 3.x / Dart
  • โ€ข MySQL 5.7+ / MariaDB
๐Ÿ’ณ

Payment Gateway Settings

Configure PayPal, Paymob, Stripe, and Razorpay credentials from the admin panel. Go to Settings โ†’ Payment Settings โ†’ Payment Gateway Settings, choose the gateway tab, enter the credentials, then save the settings.

PayPal Paymob Stripe Razorpay
Payment Gateway Settings screen

General Configuration

  • โ€ข Enable the gateway to make it available at checkout.
  • โ€ข Turn on Sandbox / Test Mode while testing. No real charges are created while sandbox mode is enabled.
  • โ€ข Upload a gateway icon in JPG, PNG, WEBP, or SVG format. Maximum file size: 2MB.
  • โ€ข Add a customer-facing description that explains how the payment method works.

API Credentials

Copy keys and secrets from each provider dashboard. Gateway credentials are encrypted at rest after saving.

Sandbox / Test
Use test keys for verification.
Live / Production
Use live keys before accepting real orders.

PayPal

Enable PayPal and enter sandbox plus live application credentials.

Get credentials Currency converts to USD

If your currency is not available in PayPal, FoodPilot converts your currency value to USD using your configured exchange rate.

Sandbox / Test

  • Client ID: PayPal sandbox client ID
  • Client Secret: PayPal sandbox client secret
  • App ID: PayPal sandbox merchant app ID

Live / Production

  • Client ID: PayPal live client ID
  • Client Secret: PayPal live client secret
  • App ID: PayPal live app ID

Paymob

Accept card and wallet payments through Paymob.

Get credentials Cards & wallets

Paymob charges the order amount in your configured currency. Enter both test and production credentials before switching to live mode.

Sandbox / Test

  • API Key
  • Secret Key
  • Public Key
  • Integration ID
  • Iframe ID

Live / Production

  • API Key
  • Secret Key
  • Public Key
  • Integration ID
  • Iframe ID

Common

  • HMAC Secret

Stripe

Enable Stripe and enter keys from your Stripe Dashboard.

Get credentials Encrypted keys

Use sandbox mode with Stripe test keys while verifying checkout. Disable sandbox mode and save live keys before processing real payments.

Required Fields

  • Public Key
  • Secret Key

Description

Add a short description shown to customers at checkout.

Razorpay

Enable Razorpay and enter API credentials from the Razorpay Dashboard.

Get credentials Currency converts to INR

Required Fields

  • API Key
  • API Secret

Security

Saved Razorpay credentials are encrypted at rest.

๐Ÿ–ฅ๏ธ

Server Requirements (VPS Configuration)

Minimum recommended specs for running FoodPilot (Laravel API + Next.js frontend + MySQL) on a VPS.

๐Ÿง 

CPU

2 vCPUs minimum. 4 vCPUs recommended for production.

๐Ÿ’พ

RAM

2 GB minimum. 4 GB recommended.

๐Ÿง

OS

Ubuntu 22.04 LTS (recommended) or Debian 12.

Stack installed: Nginx ยท PHP 8.3 ยท MySQL 8 ยท Composer ยท Node.js 20 ยท PM2 ยท Certbot
โš ๏ธ

Important Server Documentation

Follow these notes when the application shows a server error or the client app cannot connect to the API.

500 Internal Server Error โ€” Common Fix

If you see a 500 Internal Server Error, the most common cause is a missing .env file or missing Laravel app key. Run these commands inside your Laravel project directory:

# 1. Generate .env from the example file
cp .env.example .env
# 2. Generate the application key
php artisan key:generate

Then update .env with your database credentials before continuing.

CORS Issue Fix โ€” Client App Not Working

If the client app cannot call the API because of a CORS error, set the CORS_ALLOWED_ORIGINS key in your Laravel .env file. You can allow multiple client domains by separating them with commas.

CORS_ALLOWED_ORIGINS=https://yourdomain.com,https://www.yourdomain.com,https://app.yourdomain.com

Use this only for trusted frontend domains. After updating the value, clear Laravel config cache if needed: php artisan config:clear.

Cookie Based API Warning

FoodPilot uses cookie based API responses. For cookies to work correctly, the API and client app must use the same main domain with different subdomains. If the API and client are on completely different domains, login, session, cart, checkout, or authenticated requests may not work.

# Recommended domain setup
API: https://api.yourdomain.com
Client: https://app.yourdomain.com
# Avoid using separate root domains
API: https://your-api-domain.com
Client: https://your-client-domain.com

This setup is required so browser cookies can be shared safely across subdomains and the client app can communicate with the API.

๐ŸŒ

Install & Configure Nginx

1. Install Nginx

sudo apt update
sudo apt install -y nginx
sudo systemctl enable nginx
sudo systemctl start nginx

2. Admin Panel virtual host โ€” /etc/nginx/sites-available/admin.yourdomain.com

server {
    listen 80;
    server_name admin.yourdomain.com www.admin.yourdomain.com;
    root /var/www/foodpilot-admin/public;
    index index.php;

    add_header X-Frame-Options "SAMEORIGIN";
    add_header X-Content-Type-Options "nosniff";

    location / {
        try_files $uri $uri/ /index.php?$query_string;
    }

    location ~ \.php$ {
        include snippets/fastcgi-php.conf;
        fastcgi_pass unix:/var/run/php/php8.3-fpm.sock;
    }

    location ~ /\.ht { deny all; }
}

3. Next.js frontend virtual host โ€” /etc/nginx/sites-available/yourdomain.com

server {
    listen 80;
    server_name yourdomain.com www.yourdomain.com;

    location / {
        proxy_pass http://localhost:3000;
        proxy_http_version 1.1;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection 'upgrade';
        proxy_set_header Host $host;
        proxy_cache_bypass $http_upgrade;
    }
}

4. Enable sites & reload


sudo ln -s /etc/nginx/sites-available/admin.yourdomain.com /etc/nginx/sites-enabled/
sudo ln -s /etc/nginx/sites-available/yourdomain.com /etc/nginx/sites-enabled/
sudo nginx -t
sudo systemctl reload nginx
๐Ÿ—„๏ธ

Install & Configure MySQL

1. Install MySQL 8

sudo apt install -y mysql-server
sudo systemctl enable mysql
sudo mysql_secure_installation

2. Create database & user

sudo mysql -u root -p

CREATE DATABASE foodpilot CHARACTER SET utf8mb4 COLLATE utf8mb4_unicode_ci;
CREATE USER 'fpuser'@'localhost' IDENTIFIED BY 'StrongPassword!';
GRANT ALL PRIVILEGES ON foodpilot.* TO 'fpuser'@'localhost';
FLUSH PRIVILEGES;
EXIT;

3. Update Laravel .env

DB_CONNECTION=mysql
DB_HOST=127.0.0.1
DB_PORT=3306
DB_DATABASE=foodpilot
DB_USERNAME=fpuser
DB_PASSWORD=StrongPassword!
๐Ÿ˜

Install PHP 8.3 & Extensions

sudo apt install -y software-properties-common
sudo add-apt-repository ppa:ondrej/php
sudo apt update
sudo apt install -y php8.3 php8.3-fpm php8.3-mysql php8.3-mbstring \
  php8.3-xml php8.3-bcmath php8.3-curl php8.3-zip php8.3-gd php8.3-intl

sudo systemctl enable php8.3-fpm
sudo systemctl start php8.3-fpm
Verify: php -v should show PHP 8.3.x
๐ŸŽผ

Install Composer

curl -sS https://getcomposer.org/installer | php
sudo mv composer.phar /usr/local/bin/composer
composer --version

Then inside your Laravel directory:

cd /var/www/foodpilot
composer install --optimize-autoloader --no-dev
โฌก

Install Node.js & npm

# Install via NodeSource (Node 20 LTS)
curl -fsSL https://deb.nodesource.com/setup_20.x | sudo -E bash -
sudo apt install -y nodejs

node -v   # v20.x.x
npm -v    # 10.x.x

Then inside your Next.js directory:

cd /var/www/foodpilot-client
npm install
npm run build
โš™๏ธ

Configure PM2 (Process Manager)

PM2 keeps the Next.js app running in the background and auto-restarts it on crash or reboot.

1. Install PM2 globally

sudo npm install -g pm2

2. Start Next.js app

cd /var/www/foodpilot-client
pm2 start npm --name "foodpilot-client" -- start
pm2 save

3. Enable startup on reboot

pm2 startup
# Run the command PM2 outputs, then:
pm2 save

Useful PM2 commands

pm2 list                          # show all processes
pm2 logs foodpilot-client      # tail logs
pm2 restart foodpilot-client   # restart
pm2 stop foodpilot-client      # stop
๐ŸŒ

Domain & DNS Configuration

Point your domain to the VPS IP via your registrar's DNS panel (GoDaddy, Namecheap, Cloudflare, etc.).

Type Name / Host Value TTL
A @ YOUR_VPS_IP Auto
A www YOUR_VPS_IP Auto
A admin YOUR_VPS_IP Auto
DNS propagation can take up to 48 hours. Check with dig yourdomain.com or dnschecker.org.
๐Ÿ”’

SSL Setup with Certbot (HTTPS)

Use Let's Encrypt via Certbot to get free SSL certificates for all domains.

1. Install Certbot

sudo apt install -y certbot python3-certbot-nginx

2. Obtain certificates

# Main domain (Next.js client)
sudo certbot --nginx -d yourdomain.com -d www.yourdomain.com

# Admin panel
sudo certbot --nginx -d admin.yourdomain.com -d www.admin.yourdomain.com

3. Certbot patches Nginx automatically. Verify HTTPS works:

sudo nginx -t && sudo systemctl reload nginx
curl -I https://yourdomain.com
curl -I https://admin.yourdomain.com

4. Auto-renewal (already set up by Certbot, verify with):

sudo certbot renew --dry-run
After SSL: Update your Laravel .env โ†’ APP_URL=https://admin.yourdomain.com and your Next.js .env โ†’ NEXT_PUBLIC_API_URL=https://admin.yourdomain.com/api
Shared Hosting โ€” cPanel
โœ…

Shared Hosting Requirements

Before deploying on shared hosting, confirm your cPanel environment supports the following. Contact your hosting provider if any item is missing.

โšก Laravel (Admin API)

  • โœ“ PHP 8.3+ via MultiPHP or PHP Selector
  • โœ“ MySQL 5.7+ or MariaDB
  • โœ“ Composer (SSH Terminal)
  • โœ“ SSH Terminal access (cPanel โ†’ Terminal)
  • โœ“ Addon Domain / Subdomain creation
  • โœ“ File Manager or FTP access
  • โœ“ AutoSSL / Let's Encrypt SSL

โ–ฒ Next.js (Client App)

  • โœ“ Option A โ€” Static export (any host)
  • โœ“ Option B โ€” Node.js App Manager (CloudLinux hosts)
  • โœ“ Option C โ€” Deploy to Vercel (recommended)
Most shared hosts do not support running a persistent Node.js process. Use static export or Vercel unless your host has Node.js App Manager.
โšก

Laravel Setup on cPanel

Deploy the Laravel admin API on shared hosting step by step.

1

Create a Subdomain & Point to public/

In cPanel โ†’ Domains โ†’ Subdomains, create admin.yourdomain.com and set its Document Root to the Laravel project's public/ folder:

/home/yourusername/admin.yourdomain.com/public

This ensures only the public/ directory is web-accessible. The rest of the Laravel app stays outside the web root.

2

Upload Project Files

Upload the Laravel project ZIP via cPanel โ†’ File Manager into /home/yourusername/admin.yourdomain.com/, then extract it:

# Via cPanel Terminal (SSH)
cd ~/admin.yourdomain.com
unzip laravel-admin.zip -d .
rm laravel-admin.zip

Alternatively use FTP (FileZilla) to upload all files directly.

3

Set PHP Version to 8.3

In cPanel โ†’ MultiPHP Manager (or PHP Selector), select the subdomain admin.yourdomain.com and set PHP to 8.3.

Also enable these PHP extensions: pdo_mysql, mbstring, xml, curl, zip, gd, bcmath, intl.

4

Create MySQL Database

Go to cPanel โ†’ MySQL Databases:

  • Create database: yourusername_fpAdmin
  • Create user: yourusername_fpUser with a strong password
  • Add user to database with All Privileges
cPanel prefixes database and username with your cPanel account name automatically.
5

Configure .env

In cPanel โ†’ File Manager, rename .env.example โ†’ .env and edit it:

# App
APP_NAME=FoodPilot
APP_ENV=production
APP_DEBUG=false
APP_URL=https://admin.yourdomain.com

# Database
DB_CONNECTION=mysql
DB_HOST=127.0.0.1
DB_PORT=3306
DB_DATABASE=yourusername_fpAdmin
DB_USERNAME=yourusername_fpUser
DB_PASSWORD=StrongPassword!

# Mail
MAIL_MAILER=smtp
MAIL_HOST=mail.yourdomain.com
MAIL_PORT=587
MAIL_USERNAME=no-reply@yourdomain.com
MAIL_PASSWORD=your_email_password
MAIL_FROM_ADDRESS=no-reply@yourdomain.com
6

Install Composer & Run Artisan

Open cPanel โ†’ Terminal and run:

cd ~/admin.yourdomain.com

# Install Composer if not available globally
curl -sS https://getcomposer.org/installer | php
php composer.phar install --optimize-autoloader --no-dev

php artisan key:generate
php artisan migrate --force
php artisan db:seed --force
php artisan storage:link
php artisan config:cache
php artisan route:cache
php artisan optimize
7

Set Folder Permissions & Enable SSL

chmod -R 755 storage bootstrap/cache

Enable SSL: cPanel โ†’ SSL/TLS โ†’ AutoSSL (free) or install Let's Encrypt via the SSL/TLS Status panel for admin.yourdomain.com.

โœ“

Test the Installation

Visit the admin panel in your browser:

https://admin.yourdomain.com

Or test the API health endpoint:

curl -I https://admin.yourdomain.com/api/health
โ–ฒ

Next.js Setup on cPanel

Three deployment options depending on your host's capabilities โ€” choose the one that fits.

Option A

Static Export โ€” works on any shared host

No Node.js needed

Enable static export in next.config.js:

/** @type {import('next').NextConfig} */
const nextConfig = {
  output: 'export',
  trailingSlash: true,
}
module.exports = nextConfig

Build locally, then upload the generated out/ folder:

npm run build
# Uploads the contents of out/ to your subdomain root via FTP or File Manager
Limitation: Static export removes server-side features (API routes, SSR, ISR). All data must be fetched client-side from the Laravel API. Suitable if the Next.js app is purely a client-rendered SPA.
Option B

Node.js App Manager โ€” CloudLinux hosts

Full Next.js support

If your host has Node.js App Manager (Namecheap, A2 Hosting, etc.), create a Node.js app:

  1. cPanel โ†’ Software โ†’ Setup Node.js App
  2. Node.js version: 20.x ยท Application root: nextjs-client ยท Startup file: node_modules/.bin/next
  3. Upload project files to the application root via File Manager
  4. Click Run NPM Install inside the App Manager UI
  5. Start the app and note the internal port assigned
# Via cPanel Terminal
cd ~/nextjs-client
npm run build

Set environment variables in the Node.js App Manager panel or create a .env file from .env.example in the app root with:

NEXT_PUBLIC_APP_NAME=FoodPilot
NEXT_PUBLIC_APP_URL=https://yourdomain.com
NEXT_PUBLIC_API_URL=https://admin.yourdomain.com/api
Option C

Deploy to Vercel โ€” recommended

Free tier available

Keep your domain on cPanel (for email, Laravel) but deploy Next.js to Vercel โ€” skip Node.js headaches entirely:

npm i -g vercel
vercel login
vercel --prod

Add environment variables in Vercel โ†’ Project โ†’ Settings โ†’ Environment Variables:

NEXT_PUBLIC_APP_NAME=FoodPilot
NEXT_PUBLIC_APP_URL=https://yourdomain.com
NEXT_PUBLIC_API_URL=https://admin.yourdomain.com/api

Then point your domain to Vercel by adding a CNAME record in cPanel โ†’ Zone Editor:

Type Name Value
CNAME www cname.vercel-dns.com
A @ 76.76.21.21
Admin Panel โ€” Laravel
โœ…

Server Requirements

Verify your hosting environment before installation.

PHP & Extensions

  • โœ“ PHP 8.3 or higher
  • โœ“ OpenSSL
  • โœ“ PDO Extension
  • โœ“ Mbstring Extension
  • โœ“ Tokenizer Extension
  • โœ“ XML Extension
  • โœ“ JSON Extension
  • โœ“ GD / Imagick
  • โœ“ Fileinfo Extension
  • โœ“ CURL Extension

Database & Server

  • โœ“ MySQL 5.7+ or MariaDB
  • โœ“ Composer 2.x
  • โœ“ Apache or Nginx
  • โœ“ SSL Certificate (HTTPS)
  • โœ“ 512MB+ RAM
  • โœ“ SSH or Terminal access
๐Ÿš€

Installation Guide

Deploy the Laravel admin panel on your VPS step by step.

1

Download from Envato

Log in to your CodeCanyon account โ†’ Downloads โ†’ FoodPilot โ†’ Download All Files & Documentation. Extract the ZIP on your local machine.

2

Create Admin Subdomain

In your domain registrar / DNS panel, add an A record pointing the subdomain to your VPS IP. If you already did this in the Server Setup section, skip ahead.

Type Name Value
A admin YOUR_VPS_IP
A www.admin YOUR_VPS_IP
3

Upload Project to Server

Choose one of the two methods:

Option A โ€” Git (recommended)

ssh user@YOUR_VPS_IP
sudo mkdir -p /var/www/admin.yourdomain.com
cd /var/www/admin.yourdomain.com
sudo git clone https://github.com/your-repo/foodpilot-admin.git .
sudo chown -R $USER:$USER /var/www/admin.yourdomain.com

Option B โ€” FTP / File Manager

Upload laravel-admin.zip into /var/www/admin.yourdomain.com via your FTP client or File Manager, then extract it:

cd /var/www/admin.yourdomain.com
sudo unzip laravel-admin.zip -d .
sudo rm laravel-admin.zip
4

Create MySQL Database

Via SSH, connect to MySQL and create a dedicated database and user:

sudo mysql -u root -p

CREATE DATABASE foodpilot_admin CHARACTER SET utf8mb4 COLLATE utf8mb4_unicode_ci;
CREATE USER 'fp_admin'@'localhost' IDENTIFIED BY 'StrongPassword!';
GRANT ALL PRIVILEGES ON foodpilot_admin.* TO 'fp_admin'@'localhost';
FLUSH PRIVILEGES;
EXIT;

Save these credentials โ€” you'll need them in the next step.

5

Configure .env File

Option A Manually copy and edit the file via SSH:
cd /var/www/admin.yourdomain.com
cp .env.example .env
nano .env

Fill in the values below:

# App
APP_NAME=FoodPilot
APP_ENV=production
APP_DEBUG=false
APP_URL=https://admin.yourdomain.com

# Database
DB_CONNECTION=mysql
DB_HOST=127.0.0.1
DB_PORT=3306
DB_DATABASE=foodpilot_admin
DB_USERNAME=fp_admin
DB_PASSWORD=StrongPassword!

# Mail
MAIL_MAILER=smtp
MAIL_HOST=smtp.mailtrap.io
MAIL_PORT=587
MAIL_USERNAME=your_email
MAIL_PASSWORD=your_password
MAIL_FROM_ADDRESS=no-reply@yourdomain.com
Option B Use the built-in web installer:

Visit the installer URL in your browser and follow the on-screen steps โ€” no SSH required.

https://admin.yourdomain.com/install

Before installing, copy .env.example to .env.

Installer Steps Preview

Click any image to enlarge. Place screenshots in image/installer/step1.png โ€ฆ step4.png.

6

Run Artisan Commands

SSH into your server and run from the project root:

cd /var/www/admin.yourdomain.com

composer install --optimize-autoloader --no-dev
php artisan key:generate
php artisan migrate --force
php artisan db:seed --force
php artisan storage:link
php artisan config:cache
php artisan route:cache
php artisan optimize
7

Set Folder Permissions

chmod -R 775 storage bootstrap/cache
chown -R www-data:www-data storage bootstrap/cache
โœ“

Test the Installation

Open your browser and visit the admin panel. You should see the login page.

https://admin.yourdomain.com

Or test the API health endpoint โ€” should return 200 OK:

curl -I https://admin.yourdomain.com/api/health
โš ๏ธ

Before going live, verify:

  • APP_DEBUG=false โ€” prevents exposing stack traces to users
  • Storage symlink exists: ls -la public/storage
  • Folder permissions set correctly on storage/ and bootstrap/cache/
  • SSL certificate active โ€” Nginx should redirect HTTP โ†’ HTTPS
โœจ

Admin Panel Features

A complete Laravel-powered back-office to run every aspect of your food delivery business โ€” from live order tracking and menu control to POS terminals and QR-code menus.

Analytics Dashboard
๐Ÿ“Š Overview

Analytics Dashboard

Real-time bird's-eye view of your restaurant performance โ€” revenue trends, order volumes, and top-selling items all on one screen.

  • โœ“ Daily, weekly, and monthly revenue charts
  • โœ“ Total orders count and completion rate
  • โœ“ Top-selling menu items ranking
  • โœ“ Live order activity feed
  • โœ“ New customer growth over time
Detailed Statistics
๐Ÿ“ˆ Reports

Detailed Reports & Statistics

Drill down into granular business data with filterable reports and exportable charts to spot trends and make informed decisions.

  • โœ“ Revenue breakdown by category or branch
  • โœ“ Hourly sales heatmap
  • โœ“ Driver performance and delivery time stats
  • โœ“ Customer retention and repeat-order rate
  • โœ“ Export reports as CSV or PDF
Menu Management
๐Ÿฝ๏ธ Menu

Menu Management

Full control over your food catalog โ€” add rich descriptions, photos, and modifiers, and toggle availability without a page reload.

  • โœ“ Add/edit items with images and descriptions
  • โœ“ Organize by categories and subcategories
  • โœ“ Set prices, discounts, and add-ons
  • โœ“ Toggle item availability instantly
  • โœ“ Manage variants and portion sizes
Order Management
๐Ÿ“ฆ Orders

Order Management

Process, track, and manage every order from a single streamlined interface with real-time status updates pushed to customers automatically.

  • โœ“ Real-time incoming order notifications
  • โœ“ Status pipeline: pending โ†’ confirmed โ†’ out for delivery โ†’ delivered
  • โœ“ Assign orders to delivery drivers
  • โœ“ Itemized order detail and invoice view
  • โœ“ Filter by status, date range, or branch
Roles & Permissions
๐Ÿ” Access Control

Roles & Permissions

Define fine-grained access for every staff member โ€” from cashiers to branch managers โ€” using a flexible role-based permission system.

  • โœ“ Create unlimited custom roles
  • โœ“ Toggle individual permissions per role
  • โœ“ Assign multiple roles to one user
  • โœ“ Suspend / activate accounts instantly
  • โœ“ Full audit log of admin actions
Homepage Builder
๐Ÿ–ผ๏ธ Storefront

Homepage & Storefront Builder

Customize your customer-facing homepage without touching code โ€” manage hero banners, featured sections, and promotional slots from the admin panel.

  • โœ“ Drag-and-drop section ordering
  • โœ“ Hero banner with CTA button and image upload
  • โœ“ Featured categories and item spotlights
  • โœ“ Announcement ticker and notification bar
  • โœ“ Live preview before publishing
Responsive Customer Website
๐Ÿ“ฑ Web App

Responsive Customer Website

A fully responsive Next.js storefront served to customers โ€” looks and works great on desktop, tablet, and mobile out of the box.

  • โœ“ Mobile-first responsive layout
  • โœ“ Fast page loads with Next.js SSR/SSG
  • โœ“ Real-time cart and checkout flow
  • โœ“ Live order status tracking page
  • โœ“ PWA-ready for home screen installation
QR Code Menu
๐Ÿ“ท Dine-In

QR Code Menu

Generate per-table QR codes that open a branded digital menu instantly โ€” no app download required, no staff interaction needed.

  • โœ“ Auto-generated QR code per table or zone
  • โœ“ Scannable branded menu with categories
  • โœ“ Customers order and pay at the table
  • โœ“ Orders flow directly into the kitchen queue
  • โœ“ Print-ready QR code PDFs from admin
Point of Sale (POS)
๐Ÿ–ฅ๏ธ POS

Point of Sale (POS)

A full in-store POS terminal built into the admin panel โ€” handle walk-in orders, split payments, and print receipts without third-party hardware.

  • โœ“ Fast item search and cart builder
  • โœ“ Cash, card, and mixed payment support
  • โœ“ Apply coupons and discounts at checkout
  • โœ“ Thermal receipt printer integration
  • โœ“ POS orders sync with central order history
Client App โ€” Next.js
โœ…

Requirements

Make sure your machine and hosting meet the following before you begin.

๐Ÿ’ป Development Machine

  • โœ“ Node.js 20.x or higher
  • โœ“ npm 9+ or Yarn 1.22+
  • โœ“ Git

๐ŸŒ Hosting

  • โœ“ VPS with Node.js & PM2, or
  • โœ“ Vercel / Netlify recommended
  • โœ“ SSL Certificate (HTTPS)
๐Ÿš€

Installation Guide

Deploy the Next.js client app on your server step by step.

1

Configure Domain (DNS Record)

In your domain registrar / DNS panel, add the following A records pointing to your VPS IP. If already done in the Server Setup section, skip ahead.

Type Name Value
A @ YOUR_VPS_IP
A www YOUR_VPS_IP

These records serve yourdomain.com and www.yourdomain.com from your VPS.

2

Extract & Install Dependencies

Navigate into the Next.js client folder and install all packages:

cd nextjs-client
npm install
3

Configure Environment

Copy .env.example โ†’ .env and update your values:

# App
NEXT_PUBLIC_APP_NAME=FoodPilot
NEXT_PUBLIC_APP_URL=https://yourdomain.com

Change NEXT_PUBLIC_APP_NAME to your own brand name โ€” this appears in the browser tab, header, and emails.

4

Build for Production & Start with PM2

Build the optimised bundle, then launch as a persistent background process:

npm run build

pm2 start npm --name "foodpilot-client" -- start
pm2 save
pm2 startup   # copy & run the command PM2 outputs
Verify it's running:
pm2 list
pm2 logs foodpilot-client
โ–ฒ

Deploy to Vercel alternative

Skip PM2 and Nginx entirely โ€” Vercel handles builds, CDN, and SSL automatically:

npm i -g vercel
vercel login
vercel --prod

Add all NEXT_PUBLIC_* env variables under Vercel โ†’ Project โ†’ Settings โ†’ Environment Variables.

โš ๏ธ

Before going live, verify:

  • NEXT_PUBLIC_API_URL points to your live Laravel API โ€” https://admin.yourdomain.com/api
  • PM2 process is running: pm2 list
  • Nginx proxy is active and forwarding port 3000 with HTTPS
โœจ

Client App Features

Key screens of the Next.js customer web application.

Dynamic Homepage
๐Ÿ  Homepage

Dynamic Homepage

The first thing customers see โ€” designed to drive engagement with promotions and fast food discovery.

  • โœ“ Hero banner with custom promotions
  • โœ“ Featured restaurant listings
  • โœ“ Quick category navigation bar
  • โœ“ Top-rated food items grid
  • โœ“ Search bar with instant results
Menu & Categories
๐Ÿ• Menu

Menu & Categories

Clean, fast browsing experience for customers to explore the full menu with smart filtering.

  • โœ“ Category and subcategory filtering
  • โœ“ Search by food name or ingredient
  • โœ“ Dietary badges (Vegan, Halal, Spicy)
  • โœ“ Food item detail modal with images
  • โœ“ Add to cart with custom options
Cart & Checkout
๐Ÿ›’ Checkout

Cart & Checkout

Frictionless checkout flow from cart review to payment confirmation in just a few taps.

  • โœ“ Cart item management and quantities
  • โœ“ Apply coupon codes
  • โœ“ Saved delivery address selection
  • โœ“ Multiple payment methods
  • โœ“ Order summary and total breakdown
Real-Time Order Tracking
๐Ÿ“ Tracking

Real-Time Order Tracking

Customers can follow their order every step of the way with live map and status updates.

  • โœ“ Step-by-step order status timeline
  • โœ“ Live map with driver location
  • โœ“ Estimated arrival time
  • โœ“ Push notification updates
  • โœ“ Contact driver option
Customer Profile
๐Ÿ‘ค Profile

Customer Profile

A personalized space for customers to manage their account, orders, and preferences.

  • โœ“ Edit profile and contact information
  • โœ“ Manage saved delivery addresses
  • โœ“ Full order history with reorder
  • โœ“ Wallet balance and top-up
  • โœ“ Notification preferences
Authentication Flow
๐Ÿ” Auth

Authentication Flow

Secure, smooth sign-up and login experience with OTP phone verification and social login options.

  • โœ“ Email and phone registration
  • โœ“ OTP-based phone verification
  • โœ“ Social login (Google, Facebook)
  • โœ“ Forgot password with email reset
  • โœ“ Remember device for quick login
Mobile App โ€” Flutter
โœ…

Requirements

Make sure your development machine meets the following before running or building the Flutter app.

๐Ÿ’ป Development Machine

  • โœ“ Flutter 3.x or higher
  • โœ“ Dart 3.x
  • โœ“ Android Studio or VS Code
  • โœ“ Git

๐Ÿ“ฑ Platform SDKs

  • โœ“ Android SDK (API 21+)
  • โœ“ Xcode 15+ (macOS only, for iOS)
  • โœ“ CocoaPods (for iOS dependencies)
Verify your setup: flutter doctor โ€” all items should show a green checkmark before proceeding.
๐Ÿš€

Installation Guide

Get the Flutter app running on your local machine step by step.

1

Extract & Open Project

Extract the downloaded ZIP and open the Flutter project folder:

cd flutter-app
flutter pub get
2

Configure Base URL

Point the app to your live Laravel API โ€” see the Base URL section below for details.

3

Run on Device / Emulator

flutter run

Specify a target: flutter run -d android or flutter run -d ios

4

Build for Release

# Android APK / AAB
flutter build apk --release
flutter build appbundle --release

# iOS (macOS only)
flutter build ios --release
๐Ÿ”—

Base URL Setup

Connect the Flutter app to your deployed Laravel API.

// MyApp/lib/core/config/app_config.dart
static const String apiBaseUrl = String.fromEnvironment(
  'API_BASE_URL',
  defaultValue: 'https://your.admindomain.com/api',  // here replace your domain
);
โš ๏ธ

Base URL must point to the admin api domain, not the web app domain. No trailing slash.

โœ๏ธ

Change App Name

1. Android

// android/app/src/main/AndroidManifest.xml
android:label="YourAppName"

2. iOS

// ios/Runner/Info.plist
<key>CFBundleName</key>
<string>YourAppName</string>
๐Ÿ“ฆ

Change Package Name

Update Android namespace globally before publishing.

// android/app/build.gradle
android {
  namespace = "com.yourcompany.yourapp"
  defaultConfig {
    applicationId = "com.yourcompany.yourapp"
  }
}

Global Find & Replace

Windows/Linux: Ctrl+Shift+R macOS: โŒ˜+Shift+R

Verify these files after replacement:

  • android/app/build.gradle
  • android/app/src/main/AndroidManifest.xml
  • android/app/src/debug/AndroidManifest.xml
  • android/app/src/main/java/ (or kotlin/)
flutter clean && flutter pub get && flutter run
๐ŸŽจ

Change App Icon

Generate icon sets and replace for both platforms.

Generate all sizes with appicon.co โ€” upload a 1024ร—1024 PNG and download all sizes.

MyApp/assets/images/logo.png

MyApp/assets/images/top_logo.png

flutter clean && flutter pub get

To generate all platform app icons, run this command

flutter pub run flutter_launcher_icons:main
โœ“

Successfully generated launcher icons

flutter run
๐Ÿค–

Build for Android

Release APK

flutter build apk --release
# Output: build/app/outputs/flutter-apk/app-release.apk

Split APKs (smaller download size)

flutter build apk --target-platform android-arm,android-arm64,android-x64 --split-per-abi

AAB โ€” Google Play Store

Create signing keystore:

# macOS/Linux
keytool -genkey -v -keystore ~/upload-keystore.jks \
  -keyalg RSA -keysize 2048 -validity 10000 -alias upload

# Windows PowerShell
keytool -genkey -v -keystore $env:USERPROFILE\upload-keystore.jks `
  -storetype JKS -keyalg RSA -keysize 2048 -validity 10000 -alias upload

Create android/key.properties:

storePassword=your_store_password
keyPassword=your_key_password
keyAlias=upload
storeFile=../upload-keystore.jks

Build:

flutter build appbundle
# Output: build/app/outputs/bundle/release/app-release.aab
๐ŸŽ

Build for iOS

โš ๏ธ

Requires macOS with Xcode 14+ and an active Apple Developer account ($99/year).

1

Create Certificate Signing Request

Keychain Access โ†’ Certificate Assistant โ†’ Request a Certificate from a Certificate Authority โ†’ Save to disk.

2

Create iOS Distribution Certificate

Apple Developer portal โ†’ Certificates, IDs & Profiles โ†’ Create iOS Distribution certificate using your CSR file.

3

Open in Xcode

open ios/Runner.xcworkspace

Set Bundle Identifier, Version, Team, and Signing Certificate in target settings.

4

Build & Archive

flutter build ipa

Then: Xcode โ†’ Product โ†’ Archive โ†’ Distribute App โ†’ App Store Connect โ†’ Upload.

๐Ÿ“‹

Changelog

v1.0.0 Initial Release
  • โœ“ Flutter mobile app (Android + iOS)
  • โœ“ Laravel 12 REST API backend
  • โœ“ Next.js 16 customer web app
  • โœ“ Admin dashboard with full order management
  • โœ“ Real-time order tracking
  • โœ“ Push notification support

Update changelog on every release to keep buyers informed.

Thank you for choosing FoodPilot. For support, visit your CodeCanyon purchase page.