Case Study

Web

FleetPulse – Enterprise Logistics & Intelligent Fleet Operations Management Platform

FleetPulse is a high-performance logistics and fleet operations web platform built with Next.js, React, and Tailwind CSS. It connects fleet managers, dispatchers, drivers, and end customers into a single real-time operations engine. The platform provides live GPS tracking and telemetry, interactive drag-and-drop trip dispatching with automated vehicle capacity validation, a guided 4-step shipment booking wizard with instant rate quoting, preventive fleet maintenance tracking, and an isolated customer self-service portal-all guarded by a centralized Role-Based Access Control (RBAC) architecture.

Next.js

Tailwind CSS

Framer Motion

Leaflet & React Leaflet

Single-Source RBAC & Next.js Proxy Route Guarding

FleetPulse – Enterprise Logistics & Intelligent Fleet Operations Management Platform screen 1

FleetPulse – Enterprise Logistics & Intelligent Fleet Operations Management Platform screen 2

FleetPulse – Enterprise Logistics & Intelligent Fleet Operations Management Platform screen 3

FleetPulse – Enterprise Logistics & Intelligent Fleet Operations Management Platform screen 11

FleetPulse – Enterprise Logistics & Intelligent Fleet Operations Management Platform screen 12

Challenges & solutions

The technical problems our team solved to ship a reliable, unified web experience.

Leaflet requires direct access to browser DOM APIs (`window`, `document`), causing immediate server-side rendering crashes (`window is not defined`) and client hydration mismatches when loaded through Next.js App Router.

Isolated all map-dependent components into client boundaries loaded dynamically via `next/dynamic` with `{ ssr: false }`, backed by a custom `useMounted` lifecycle hook and skeleton fallbacks to guarantee initialization occurs only after full DOM mounting.

In multi-stop trip dispatching, reordering stops or adding extra consignments on the fly risked exceeding a truck's safe gross payload or cargo volume without immediate dispatcher feedback.

Developed an in-memory reactive capacity engine inside the trip planner that instantly recalculates cumulative weight and volume metrics across all sequenced stops, immediately raising UI alert indicators and disabling dispatch confirmation if thresholds are exceeded.

Managing 5 distinct roles across complex nested routes risked permission discrepancies between server redirects, navigation sidebars, and the global search palette.

Built a centralized permission configuration (`src/lib/permissions.ts`) as the single source of truth. The Next.js edge proxy (`proxy.ts`), the application navigation shell, and the ⌘K Command Palette all consume this shared matrix, guaranteeing that unauthorized routes and search results are uniformly blocked and hidden at every layer.

Vehicle identifiers and hub names injected into Leaflet's raw HTML icon templates (`L.divIcon`) exposed dispatchers to stored script injection (XSS) from unvalidated database records.

Built and integrated a strict HTML sanitization and escaping utility (`escapeHtml`) across all custom marker and popup templates, neutralizing HTML entities before injection and safeguarding the dispatcher interface.

Key features

What users get in the finished, shipped product.

Granular Role-Based Access Control (RBAC) & Edge Route Guarding

Overview: Security architecture that restricts access across platform modules based on designated user responsibilities.
Features: Unified permission matrix across 5 roles (Administrator, Operations Manager, Dispatcher, Driver, Customer), edge-level route proxy protection (`proxy.ts`), persistent session handling, and an instant role-switching utility for operational testing.

Interactive Trip Dispatching & Drag-and-Drop Waypoint Planner

Overview: Visual dispatch center allowing operations teams to organize routes, sequence stops, and prevent vehicle overloading.
Features: Visual trip Kanban board (Scheduled, In Transit, At Stop, Delayed, Completed), route stop planner with drag-to-reorder waypoints, real-time payload vs. vehicle capacity calculations, and single-click stop completion workflows.

Full-Screen Live GPS Tracking & Geospatial Telemetry

Overview: High-precision map interface tracking active fleet movements, speeds, and delivery milestones in real time.
Features: Full-screen Leaflet map integration with dark/light Esri basemaps, live vehicle markers with dynamic status badges (speed, fuel %, heading), waypoint route polylines, and real-time ETA estimates.

4-Step Guided Shipment Booking Wizard & Dynamic Rate Quoting

Overview: Structured multi-stage workflow designed to schedule, price, and assign cargo consignments with zero data conflict.
Features: Progressive 4-stage wizard (Origin/Destination Details → Cargo Dimensions & Weight → Vehicle Assignment → Automated Rate Quote & Confirmation), step-level validation, live route previews, and proof-of-delivery (POD) document capture.

Preventive Fleet Maintenance & Asset Lifecycle Management

Overview: Proactive vehicle health and compliance engine designed to minimize breakdown downtime and track operating costs.
Features: Complete vehicle profile directory (specs, fuel, odometer, payload capacity), regulatory document and insurance expiry trackers with alert flags, scheduled servicing reminders, and maintenance expenditure history.

Dedicated Customer Self-Service Tracking Portal

Overview: Secure, customer-facing portal that allows external clients to monitor their shipments independently without administrative intervention.
Features: Instant tracking by Consignment / Tracking ID, visual delivery milestone stepper, active orders overview, delivery history, and printable commercial invoice access.

Global ⌘K Command Palette & Rapid Navigation Engine

Overview: Keyboard-first search interface enabling instant discovery and navigation across the entire logistics ecosystem.
Features: Global keyboard shortcut (`⌘K` / `Ctrl+K`), real-time indexed search across shipments, vehicles, drivers, and settings, role-filtered search suggestions, and direct shortcut actions.

Tech integrations

Third-party SDKs & libraries

5 core integrations powered

Esri ArcGIS Canvas Basemaps

Core system integration

Lucide React & Lottie Web

Core system integration

Recharts

Core system integration

Native Browser Print & Document Layout Engine

Core system integration

Tabular CSV Data Export Engine

Core system integration

More Case Studies

Related Work

Similar Projects We've Built

TransportPro - Transport Management Software

TransportPro is a comprehensive transport and logistics management system purpose-built for India’s freight and transport industry. It provides a centralized platform for managing shipment loading, delivery tracking, GST-compliant billing, fleet operations, financial reporting, and stock management — enabling transport businesses to replace paper registers and Excel sheets with a streamlined, digital-first platform.

Next.jsTailwind CSS+2

View Case Study

GeoSentry

GeoSentry is a professional-grade geofencing and real-time location monitoring mobile application built using Flutter. It allows users to define custom geographic zones on an interactive Google Maps interface and receive real-time alerts whenever a monitored device enters or exits these zones. The application is perfect for a variety of use cases such as personal safety, […]

FlutterDart+6

View Case Study

Sprut – Taxi Booking & Personal Assistance App

Sprut is a next-generation taxi booking and personal assistance mobile application designed to provide fast, reliable, and convenient transportation services. The app enables users to order taxis instantly, track rides in real time, schedule pre-bookings, and manage ride history with ease. Built using Flutter with GetX state management, the application focuses on performance, real-time updates, […]

FlutterDart+4

View Case Study

LoScoop

LoScoop connects travelers with real locals in Nashville for one-on-one chats. Get personalized tips on food, bars, events, hidden gems, and more straight from people who actually live there. Whether you’re looking for secret streets, live music spots, or the best brunch, LoScoop helps you discover Nashville like a local.

FlutterflowFirebase

View Case Study

View All Work

Have a similar idea? Let's build it together.

From concept to launch, we turn your vision into a world-class product.

Get a free consultation Back to portfolio