Bid4Cab Docs

What comes with Bid4Cab

Customer Website (React/Vite), Driver Application (React Native), and Admin Panel (Laravel/Filament) — all included with the driver bidding system.

Introduction

Bid4Cab is a white-label driver bidding-based taxi booking platform — a modern alternative to traditional dispatch systems. Instead of auto-assigning drivers, customers post trip requests and nearby drivers bid competitively for the ride. Customers can view all bids and select the best driver based on price, rating, and vehicle type.

Driver Bidding — Key Differentiator

Bid4Cab empowers customers to choose from multiple driver bids, creating a transparent and competitive marketplace. This drives better pricing and service quality.

Key Capabilities

Driver Bidding System — Drivers bid on trip requests; customers review and select
Real-time bid management via WebSocket (Laravel Reverb)
Fare Calculation (passenger, luggage, child, pet, wheelchair capacity)
PWA (Progressive Web App) Support
Daily Ride Booking Management
Filament-Based Admin Panel
Secure Payments with Razorpay / Stripe
Map Rendering (RouteMappy / MapLibre / Google Maps)
Trip & Ride Management
White-Label Branding Support
Driver Rating & Feedback System

Bidding Flow Overview

1. Request Posted

Customer creates trip with pickup/drop. System broadcasts to eligible nearby drivers.

2. Bidding Open

Drivers receive request and place bids. Configurable bidding window (default: 60s).

3. Customer Selects

Customer reviews bids sorted by price/rating. Smart recommendation highlights best value.

4. Trip Confirmed

Winning driver notified. Other bids cancelled. Trip begins with real-time tracking.

Getting Started

Prerequisite Knowledge

Basic understanding of React-based website (Vite)
Basic knowledge of backend setup (Laravel / Filament / API)
Familiarity with React Native (for driver app modifications)
Understanding of WebSocket concepts (for real-time bidding)

Version Requirements

Ensure the following software versions are installed before proceeding:

Backend Requirements

PHP: 8.2 or later (8.3 recommended)
Laravel: 11.x or later
MySQL: 8.0 or later (MariaDB 10.6+)
Composer: 2.5 or later
Redis: 7.x or later
Apache/Nginx: Latest stable

Frontend Requirements

Node.js: 20.x LTS or later
npm: 10.x or later
React: 19.x
Vite: 8.x or later
Tailwind CSS: 3.4.x or later

Android Development

Android Studio: 2024.1.1 (Ladybug) or later
Java JDK: 17 or later (JDK 21 recommended)
Android SDK: API Level 34
Build Tools: 34.0.0 or later
Gradle: 8.3 or later
React Native: 0.76.x

iOS Development (macOS only)

Xcode: 16.x or later
iOS SDK: iOS 17+
CocoaPods: 1.15.x or later
macOS: Sonoma 14.5+
React Native: 0.76.x
Apple Developer Account: Required ($99/year)

Software Requirements

Tool/Software	Min Version	Recommended	Purpose
Node.js	v18.x LTS	v20.x or v22.x	React Native & npm
npm	v9.x	v10.x+	Package management
PHP	8.1	8.2 or 8.3	Laravel backend
Composer	2.5	2.7+	PHP dependencies
MySQL	5.7	8.0 / MariaDB 10.11+	Database
Redis	6.2	7.x	Queue & caching
Android Studio	2023.1	2024.1 (Ladybug)	Android build
Java JDK	11	17 or 21	Android compilation
Xcode (macOS)	15.0	16.0+	iOS build
CocoaPods	1.12	1.15+	iOS dependencies
Git	2.30	Latest	Version control
VS Code	1.80	Latest	Code editor
Supervisor	4.x	Latest	Process mgmt (prod)

WebSocket Server (Laravel Reverb)

Bid4Cab uses Laravel Reverb for real-time bidding. This is the most critical component — it enables live bid updates between customers and drivers.

# Install Laravel Reverb
composer require laravel/reverb

# Publish configuration
php artisan reverb:install

# Start the Reverb server
php artisan reverb:start

Verify Your Installation

node --version    # Should show v20.x or higher
npm --version     # Should show 10.x or higher
php --version     # Should show 8.2 or higher
composer --version  # Should show 2.5 or higher
mysql --version   # Should show 8.0 or higher
java --version    # Should show 17 or higher
redis-cli ping    # Should return PONG

Complete Technology Stack

Bid4Cab is built using modern, scalable technologies optimized for real-time bidding.

Category	Technology	Version	Purpose
Frontend (Customer Website)
Framework	React	19.x	UI Library
Build Tool	Vite	8.x	Fast builds & HMR
Styling	Tailwind CSS	3.4.x	Utility-first CSS
Routing	React Router DOM	7.x	Page navigation
HTTP Client	Axios	1.7.x	API calls
Real-time	Laravel Echo + Reverb	Latest	Live bidding updates
Backend (Admin Panel & API)
Framework	Laravel	11.x	PHP Framework
Admin Panel	Filament	3.x	Admin Dashboard
Database	MySQL / MariaDB	8.0+ / 10.6+	Relational Database
Auth	Laravel Sanctum	4.x	API Token Auth
Broadcasting	Laravel Reverb	1.x	WebSocket for bidding
Queue	Laravel Horizon	Latest	Job queue (Redis)
Cache	Redis	7.x	Caching & sessions
Mobile App (Driver)
Framework	React Native	0.76.x	Cross-platform mobile
Navigation	React Navigation	7.x	Screen navigation
Maps	MapLibre GL	Latest	Map rendering
WebSocket	RN WebSocket	Built-in	Real-time bidding
Third-Party Services
Payment	Razorpay / Stripe	Latest	Online payments
SMS	Twilio / MSG91	Latest	OTP verification
Push	Firebase FCM	Latest	Real-time alerts
Maps	RouteMappy	Latest	Custom map tiles
Places	Google Places API	Latest	Autocomplete

Core Libraries

react
react-dom
react-router-dom
axios
date-fns
geolib
laravel-echo
pusher-js

UI & Styling

tailwindcss
@headlessui/react
react-select
react-phone-input-2

Real-time & Bidding

laravel-echo
pusher-js / reverb
react-native-websocket (driver app)

Installation

Run npm install to install all dependencies. For real-time bidding, ensure Laravel Echo and Reverb are properly configured.

Driver Bidding System — Core Feature

Bid4Cab's driver bidding system enables a transparent marketplace where multiple drivers can bid on a single trip request. This section explains the complete architecture, flow, and configuration.

Bidding System Architecture

The bidding system uses Laravel Reverb (WebSocket) for real-time communication. When a customer posts a trip request:

System validates locations and calculates estimated fare range
Broadcasts the request to all eligible nearby drivers (within configured radius)
Drivers receive the request via WebSocket + FCM push notification
Drivers submit bids; each bid is broadcasted back to the customer in real-time
Customer selects a bid, which locks other bids and creates a confirmed trip

Bid Lifecycle

Each bid goes through these states:

Pending — Bid submitted, awaiting customer review
Outbid — Another driver placed a lower/better bid
Selected — Customer chose this bid as the winner
Expired — Bidding window closed without selection
Withdrawn — Driver cancelled their own bid

Bidding Configuration (Admin Panel)

Bidding Window: Time in seconds for bidding (default: 60)
Min Bid: Floor price below which drivers cannot bid
Max Bid: Ceiling price capping bids
Bid Increment: Minimum price increment
Max Visible Bids: Number of bids shown to customer (top N)
Driver Radius: Max distance for eligible drivers (km)
Auto-Select: Auto-select only bid if bidding window expires

WebSocket Channels & Events

Channel: trip-request.{requestId}

.trip_request_created      // New trip request posted
.bid_placed                // New bid received
.bid_updated               // Bid price updated
.bid_withdrawn             // Driver withdrew bid
.bid_selected              // Customer selected winning bid
.trip_confirmed            // Trip confirmed, bidding closed

Important

The bidding system requires Laravel Reverb with Redis. For production, use Supervisor to keep the Reverb server running. Ensure your hosting provider supports persistent WebSocket connections.

Installation Steps

1
Unzip source folder
Extract the downloaded source files to your working directory.
2
Copy to XAMPP
Copy admin folder to XAMPP → htdocs. Rename folder (e.g., Bid4Cab_admin).
3
Open Terminal
Navigate to project:
```
cd C:\xampp\htdocs\Bid4Cab_admin
```
4
Install Dependencies
```
composer install
```
Verify vendor folder exists.
5
Create Database
Open http://localhost/phpmyadmin → Create new database (e.g., bid4cab_db).

6

Configure .env File

Copy .env.example to .env and update:

DB_DATABASE=bid4cab_db
DB_USERNAME=root
DB_PASSWORD=

# Reverb (WebSocket for bidding)
REVERB_APP_ID=your-app-id
REVERB_APP_KEY=your-app-key
REVERB_APP_SECRET=your-app-secret
REVERB_HOST=localhost
REVERB_PORT=8080
REVERB_SCHEME=http

BROADCAST_DRIVER=reverb
QUEUE_CONNECTION=redis

7

Migrate & Seed

php artisan key:generate
php artisan migrate --seed
php artisan storage:link

8

Setup Reverb

composer require laravel/reverb
php artisan reverb:install
php artisan reverb:start

9

Run the Application

Open 3 terminals:

# Terminal 1: Laravel
php artisan serve

# Terminal 2: Reverb (WebSocket)
php artisan reverb:start

# Terminal 3: Queue Worker
php artisan queue:work

Admin Panel Access

Visit http://localhost:8000/admin

Email:	admin@bid4cab.com
Password:	password

Customer Website Setup (React + Vite)

1
Navigate to Website Folder
```
cd Bid4Cab_website
```
2
Install Dependencies
```
npm install
```

3

Configure Environment

Copy .env.example to .env:

VITE_API_URL=http://localhost:8000/api
VITE_REVERB_APP_KEY=your-app-key
VITE_REVERB_HOST=localhost
VITE_REVERB_PORT=8080
VITE_REVERB_SCHEME=http
VITE_MAP_PROVIDER=routemappy

4
Run Dev Server
```
npm run dev
```

Bidding Features on Website

Bidding Dashboard: Real-time bid comparison with price/rating sorting
Driver Profiles: Ratings, vehicle details, bid history
Smart Recommendation: Best value bid highlighted
Bid Timer: Countdown of remaining bidding time
Fare Estimator: Estimated range before posting request

Driver App Setup (React Native)

1
Navigate to Driver Folder
```
cd Bid4Cab_driver
```
2
Install Dependencies
```
npm install
```
3
iOS CocoaPods (macOS)
```
cd ios && pod install && cd ..
```

4

Configure API & WebSocket

Edit src/config/Constants.js:

export const api_url = 'http://localhost:8000/api';
export const wss_url = 'ws://localhost:8080';

5

Run App

# Android
npx react-native run-android

# iOS
npx react-native run-ios

Driver Bidding Features

Incoming Trips: Real-time trip request notifications
Quick Bid: One-tap preset amounts or custom input
Active Bids: Track submitted bids in real-time
Bid Status: Notifications when selected/outbid
Smart Pricing: Algorithm suggests competitive bid amounts

Customer Guide

This guide walks through the complete customer journey — from registration to booking, bid selection, and trip completion.

Register & Login

Open the website URL and click "Sign Up"
Enter your name, email, and mobile number
Verify via OTP sent to your mobile
Login using your mobile number + OTP or password

Post a Trip Request (Bidding)

Enter pickup location (use map or search)
Enter destination
Select vehicle type (Sedan, SUV, Auto, etc.)
Add ride details (passengers, luggage, child seat)
Review the estimated fare range
Click "Find Drivers" to post your trip for bidding

Review & Select a Bid

Nearby drivers will place bids in real-time
Each bid shows: fare, driver rating, vehicle, ETA
Bids are sorted by price (lowest first)
A smart recommendation badge highlights the best value
Tap "Select" on your preferred bid
Confirm selection to lock the driver

Track Trip & Complete Payment

View driver details, vehicle info, and real-time ETA
Communicate with driver via Chat or Call
After trip ends, final fare is displayed
Pay via Razorpay/Stripe or Cash
Rate your driver (1–5 stars) with optional review

Driver Guide

This guide covers everything drivers need — from logging in to bidding on trips and managing earnings.

Download and install the Driver App
Login with your registered mobile number (OTP verification)
Complete your profile: name, email, address
Add vehicle details: make, model, year, color, plate
Upload required documents (License, RC, Insurance)
Wait for admin approval

Bidding on Trips

Toggle "Online" to receive trip requests
When a request arrives, you see: pickup/drop, distance, fare range
Tap a preset bid amount or enter custom bid
Your bid is submitted and visible to the customer
If selected: you get full trip details and navigation
If outbid: you can revise your bid higher

Complete Trip

Navigate to pickup using built-in maps
Tap "Start Trip" after passenger boards
Follow navigation to destination
Tap "End Trip" at destination
Collect payment (cash) or confirm auto-payment

Earnings

View Daily Earnings — completed rides today
View Transaction History — detailed breakdown
Track commission deducted by admin
Withdraw via Bank Transfer / UPI / Wallet

Admin Guide

This guide covers the complete admin workflow — managing drivers, configuring bidding rules, monitoring trips, and generating reports.

Navigate to http://yourdomain.com/admin
Enter your admin email and password
Default: admin@bid4cab.com / password
Change default password immediately after first login

Configure Bidding Settings

Go to Settings → Bidding Configuration
Set Bidding Window: duration in seconds (default: 60)
Set Minimum/Maximum Bid: price limits
Set Bid Increment: minimum price step
Set Driver Radius: max distance for eligible drivers
Set Max Visible Bids: number shown to customers

Manage Drivers

View all registered drivers and their status
Review Pending Approvals with uploaded documents
Approve/Reject driver applications
View driver ratings, earnings, and bid history

Monitor Trips

View all active, completed, cancelled trips
See bidding history for each trip
View fare breakdown and payment status
Export reports to CSV

Reports & Analytics

Ride Reports — total rides, cancellations, completion rate
Revenue Reports — admin earnings, driver payouts
Bidding Analytics — average bids per trip, bid acceptance rates
Driver Performance — ratings, earnings, bid win rate

Changing App Name

Android: Update android/app/src/main/res/values/strings.xml — change <string name="app_name">Bid4Cab Driver</string>

iOS: Update ios/Bid4CabDriver/Info.plist — change CFBundleDisplayName

Changing App Icon

Android: Replace icons in android/app/src/main/res/mipmap-* folders

iOS: Replace images in Images.xcassets/AppIcon.appiconset

Changing Package Name

Update android/app/build.gradle: applicationId "com.yourcompany.bid4cabdriver"
Update android/app/src/main/AndroidManifest.xml: package="com.yourcompany.bid4cabdriver"
Rename the Java package directory structure accordingly
Clean and rebuild the project

Warning: Changing package name after Play Store release creates a new app listing.

Bid Amount Presets

Modify default bid amounts in src/config/Constants.js:

export const BID_PRESETS = [5, 10, 15, 20, 25];
export const MIN_BID = 3;
export const MAX_BID = 100;
export const BID_INCREMENT = 1;

For custom development, contact sales@menpanitech.com

Version 1.0.0 (Initial Release)

Core driver bidding system
Customer bid review and selection
Real-time WebSocket updates (Reverb)
Bid presets and smart pricing suggestions

Firebase Project Setup

Go to Firebase Console and create a project
Register Android app with your package name
Download google-services.json → place in android/app/
For iOS, download GoogleService-Info.plist → add to Xcode
Enable Authentication (Phone, Email, Google)
Enable Cloud Messaging (FCM) for push notifications

FCM for Bidding Notifications

FCM notifies drivers about new trip requests and bid status changes even when backgrounded.

Bundle ID Configuration

Android: android/app/build.gradle → applicationId
iOS: Xcode → Target → General → Bundle Identifier
Format: com.yourcompany.bid4cab
Must match across Firebase, Google Play, and App Store Connect

Generate Keystore

keytool -genkey -v -keystore bid4cab-release.keystore \
  -alias bid4cab-key \
  -keyalg RSA -keysize 2048 -validity 10000

Place in android/app/ and configure build.gradle signing config.

Build APK

cd android
./gradlew assembleRelease

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

Build AAB (Play Store)

cd android
./gradlew bundleRelease

Output: app/build/outputs/bundle/release/app-release.aab

Install CocoaPods

sudo gem install cocoapods
cd ios && pod install

Always open .xcworkspace file in Xcode.

iOS Firebase

Add iOS app in Firebase Console → download GoogleService-Info.plist → add to Xcode root.

Bundle ID (iOS)

Xcode → Target → General → Bundle Identifier: com.yourcompany.bid4cabdriver

iOS Icons

Replace icons in Images.xcassets/AppIcon.appiconset with all required sizes.

Run iOS

npx react-native run-ios

Release Build

Xcode → Product → Archive → Distribute App → App Store Connect.

Requires Apple Developer Program ($99/year).

API Configuration

# Website (.env)
VITE_API_URL=http://localhost:8000/api
VITE_WS_URL=ws://localhost:8080

# Driver App (Constants.js)
export const api_url = 'http://localhost:8000/api';
export const wss_url = 'ws://localhost:8080';

Bidding API Endpoints

POST /api/trip-request       # Post new trip for bidding
POST /api/place-bid          # Place bid on trip
GET  /api/bids/{id}          # Get all bids for trip
POST /api/select-bid/{id}    # Select winning bid
POST /api/cancel-trip        # Cancel trip request

Customer Website

npm run build
# Deploy /dist to Vercel, Netlify, etc.

Admin Panel (Production Checklist)

Set APP_ENV=production and APP_DEBUG=false
Run php artisan optimize
Configure Supervisor for queue workers and Reverb
Set up Redis for sessions and cache
Enable HTTPS with Let's Encrypt
Open port 8080 for WebSocket connections

Supported Providers

RouteMappy — Custom taxi tiles (paid)
MapLibre — Open-source (included)
Google Maps — Requires API key
Mapbox — Requires account
OpenStreetMap — Free

RouteMappy

RouteMappy is a paid service. Contact sales@menpanitech.com for pricing.

export const ROUTEMAPPY_KEY = 'your-routemappy-key';
export const ROUTEMAPPY_STYLE = 'https://tiles.routemappy.com/styles/default/style.json';

Razorpay

RAZORPAY_KEY_ID=your_key_id
RAZORPAY_KEY_SECRET=your_key_secret

Stripe

STRIPE_KEY=pk_live_your_publishable_key
STRIPE_SECRET=sk_live_your_secret_key

FCM Setup

Firebase Console → Project Settings → Cloud Messaging
Copy Server Key and Sender ID

Update .env:

FCM_SERVER_KEY=your_fcm_server_key
FCM_SENDER_ID=your_sender_id

FCM is used for: trip request alerts, bid status notifications, trip updates.

Gmail SMTP

MAIL_MAILER=smtp
MAIL_HOST=smtp.gmail.com
MAIL_PORT=587
MAIL_USERNAME=your@gmail.com
MAIL_PASSWORD=your_app_password
MAIL_ENCRYPTION=tls

Use an App Password from Google Account → Security → 2-Step Verification.

Testing on Devices

Android: Enable Developer Options + USB Debugging
iOS: Use development provisioning profile
Use ngrok to expose local server for mobile testing:

ngrok http 8000
ngrok http 8080  # WebSocket

Email Support

support@bid4cab.com

Sales & Licensing

sales@menpanitech.com

RouteMappy Map Services

Website: routemappy.com

Support Hours: Mon–Fri, 9:00 AM – 6:00 PM (IST)

Overview