Skip to main content
Rajendra Kumar
React NativeMobile app

Trolly: Quick-Commerce 3-App Ecosystem

Three synchronised React Native apps (Customer, Vendor and Delivery) for hyperlocal quick commerce, built around a real-time order state machine and a shared networking core.

Platform
Mobile app
Built with
React Native
Tech stack
8 technologies

Project highlights

  • Three synchronised apps: Customer, Vendor and Delivery
  • Real-time order lifecycle over WebSockets, no polling
  • Persistent audio order alerts for merchants
  • Battery-aware background location tracking for riders

Overview

Trolly is a quick-commerce platform designed for 10 to 15 minute delivery cycles. It is made up of three mobile apps, one each for customers, vendors and delivery riders, all kept in sync through an event-driven order lifecycle and a shared API layer. Built with React Native CLI and TypeScript.

The problem

Fast delivery depends on three parties acting in step: the customer ordering, the store accepting and packing, and a rider picking up and delivering. A missed order alert, a stale order status or a rider whose location stops updating directly slows the whole chain.

The solution

A shared typed Axios client handles token rotation, uniform error formatting and request cancellation for all three apps. Redux Toolkit with normalised slices keeps the UI stable during rapid item updates, and WebSocket channels push order changes (PLACED, ACCEPTED, PACKED, PICKED_UP, DELIVERED) straight into each app's store.

  • Customer app

    dynamic catalogue, an optimistic cart that updates instantly and validates stock in the background, cached images for smooth scrolling through large catalogues, and a live order tracker covering store preparation, rider assignment and delivery progress.

  • Vendor app

    persistent order alerts using native Android notification channels with looping custom audio through Notifee, plus a single-screen pipeline for accepting orders, SLA countdown timers and item-level out-of-stock toggles.

  • Delivery app

    an Android foreground service that keeps publishing location while the app is backgrounded or the screen is locked, with address guidance, order confirmation and digital proof of delivery.

  • Separate sign-in for each app

    customers use email or Gmail, sellers use email or Gmail, and delivery partners use a mobile number and password.

  • Customer home

    a delivery address bar, search, category shortcuts such as grocery, fashion, beauty, mobile, electronics and watches, promo banners and popular items.

  • Order tracking

    an order summary with customer details and a step-by-step timeline from processed to shipped, out for delivery and arriving.

Architecture

  • All three apps talk to central REST and WebSocket services. Shared types and API services are extracted into reusable packages so payload shapes stay consistent across the three codebases.
  • Real-time WebSocket events replace polling for order status, which avoids battery-heavy polling loops. React Native CLI (rather than Expo managed) was used for full access to native modules such as foreground services and notification channels.

Challenges solved

  • 1

    Three independent clients

    shared types and networking code were modularised into reusable packages to cut duplicated logic and keep payloads consistent.

  • 2

    Merchants missing orders

    standard push notifications are easy to miss, so incoming orders use high-priority, persistent alerts that keep ringing until the merchant acknowledges the order.

  • 3

    Rider battery life

    location updates are throttled with distance filters and adaptive intervals (roughly every 10 to 15 metres or 5 seconds, depending on speed and displacement) instead of continuous raw GPS queries.

Outcomes

A working three-app ecosystem with live order status across customer, vendor and rider, loud order alerts for stores, background rider tracking within Android background-execution rules, and one consistent data contract across all clients.

Technology stack

  • React Native CLI
  • TypeScript
  • Redux Toolkit
  • Axios
  • WebSockets
  • Notifee
  • Android Foreground Services
  • react-native-fast-image

Screenshots

  • Customer app home screen with delivery address, search, category shortcuts, a promo banner and popular items
  • Customer app sign-in screen with email and password, forgot password and Gmail login
  • Onboarding screen with a delivery rider illustration, a How to use heading and a Skip button
  • Onboarding screen with a shopping illustration, a How to use heading and a Skip button
  • Seller app login screen with email and password, forgot password and Gmail login
  • Delivery partner app login screen with mobile number and password
  • Order tracking screen with an order summary, customer details and a timeline: order processed, shipped, out for delivery and arriving

More React Native work

Need something similar?

Tell me about your project and I will suggest a plan.

Start a conversation

All projects