0ms
Sync LatencyInstant reactive UI updates via Firebase Stream listeners
100%
Duplicate FreeSmart cart query auto-increments quantity instead of duplicating
4-Stage
Delivery StepperPayment → Packaging → In Transit → Delivered lifecycle
5
App DomainsHome, Wishlist, Smart Basket, Order Tracking, and Profile
60 FPS
Hero AnimationSmooth Material 3 Hero widget image transitions
Dual
Auth RegistrationFirebase Auth + Firestore user profile dual-write
The Operational Mandate
Context & High-Stakes Constraints
Traditional mobile e-commerce applications often suffer from sluggish manual-refresh paradigms, fragmented state management, and cart duplication issues. The goal of DeliFood was to construct a responsive, stream-driven food ordering application built natively in Flutter and backed by Google Cloud Firestore.
Core Mandate: Build an intuitive mobile food delivery interface delivering instant real-time synchronization for products, carts, wishlists, and order delivery statuses with zero latency.
02MOBILE APPLICATION INTERFACES
The DeliFood Mobile Experience in Action
Explore the reactive mobile interface of DeliFood — featuring real-time stream-driven catalogs, smart cart quantity deduplication, fluid Hero animations, and multi-stage delivery tracking.
🔒app.delifood.mobile
01 / 05Official Brand Presentation
Official Project Showcase & Mobile Flyer
Official mobile application presentation flyer showcasing DeliFood's on-demand culinary delivery architecture, modern iOS & Android UI design, and real-time cloud ordering.
◆ Cross-Platform Flutter Visual Architecture◆ Fullstack Firebase Real-Time Ecosystem◆ Modern On-Demand Food Delivery Experience
03CAPABILITIES & WORKFLOW
Core Capabilities & Order Fulfillment Workflow
Engineered for smooth, high-throughput mobile retail — combining reactive data streaming, gesture-driven cart management, real-time wishlist toggling, and multi-stage delivery logistics.
Stream-Driven Reactive UI
Every core view subscribes directly to Cloud Firestore snapshots via StreamBuilder, updating catalog items, cart quantities, and wishlist states instantaneously without manual pull-to-refresh.
Smart Basket & Deduplication Engine
Intelligent cart operations check for existing items in user collections, auto-incrementing quantity (quantity + 1) on duplicate picks and supporting swipe-to-dismiss deletion.
Dual-Write Identity & Profile Security
Secure Firebase Authentication combined with atomic Firestore user document writes storing demographic metadata, birth dates via date picker, and server timestamps.
4-Stage Visual Delivery Stepper
Comprehensive order lifecycle tracking guiding customers from order placement to doorstep arrival, complete with granular transit checkpoints and horizontal item summaries.
8 Mission-Critical Modules
Each module is engineered with robust transactional boundaries, modular isolation, and comprehensive audit trails.
MODULE // 01 OF 08Core Architecture
Stream-Driven Catalog & Live Query Filtering
Real-time product discovery engine streaming directly from Cloud Firestore with zero manual refreshes.
- Live Stream Snapshots: Persistent listener on products collection automatically broadcasting price, stock, or item changes to the UI.
- Client-Side Substring Filtering: Dual-criteria search evaluating title substrings and active categories (Hottest, Popular, New Combo, Top).
- Dynamic View Shifting: Automatically swaps between promotional hero carousels (Special & Recommended) and search grid results.
- Interactive Coupon Claim: Built-in promotional voucher dialog with celebration feedback and instant discount application.
Order Fulfillment & Delivery Lifecycle
From cart checkout to doorstep delivery — every order transitions through an asynchronous Firestore state machine with automated subcollection synchronization.
Stage 01Cart & Checkout
Basket Checkout & Address Input
Customer selects items, validates cart quantities, and inputs delivery address via modal bottom sheet. Subtotal and flat delivery fees are computed dynamically.
Cart Snapshot & Order Creation
Stage 02Kitchen & Inventory
Order Processing & Kitchen Prep
Kitchen receives order status 'Processing'. Cart items are atomically migrated to /orders and cleared from /cart to prevent duplicate fulfillment.
Status Update → Processing & Packaging
Stage 03Courier & Arrival
Transit Dispatch & Doorstep Handover
Driver is assigned. Live stepper updates to 'In Transit' with timestamped sorting checkpoints until final delivery verification.
Status Update → In Transit → Delivered
Atomic Cart Migration & Duplicate Prevention Guarantee
During checkout, all cart documents are atomically read, transformed into order items, and deleted from the active cart in a single batch sequence. This ensures customers never experience ghost items or accidental double checkouts.
04SYSTEM ANATOMY & ARCHITECTURE
Feature-First Modular & Stream BaaS Architecture
Engineered with a clean separation between reactive Flutter presentation widgets, a centralized Data Access Object (DatabaseService), and Google Cloud Firestore streams.
Pattern: Feature-First Flutter + Firebase BaaS
Protocol: Asynchronous Firestore Streams (gRPC / WSS)
Mobile Client (Flutter)
Dart ^3.8.1 + Material 3Cross-platform mobile application utilizing StreamBuilder, custom Open Sauce typography, Hero transition animations, and Dismissible gestures.
Service & Data Access Layer
DatabaseService (DAO)Centralized Data Access Object abstracting Firestore CRUD operations, stream mappings, smart deduplication queries, and database seeding.
Identity & Security Guard
Firebase AuthenticationToken-based stateless authentication engine enforcing email/password validation, credential hashing, and secure user session management.
Reactive NoSQL Database
Cloud FirestoreDistributed cloud document database delivering real-time snapshot streams across products, user profiles, carts, wishlists, and order collections.
Local Storage & Assets
Asset Bundles & FontsBundled Open Sauce One font family, CustomIcon glyphs, and local high-res food combo image assets.
Curated Technology Stack
A modern engineering stack combining high-throughput user interfaces, modular backend architecture, and resilient data layers.
Mobile Application
Flutter 3.xCross-Platform Mobile Framework
Dart ^3.8.1Strongly Typed Client Language
Provider 6State Management & DI
Open Sauce OneCustom Typography Hierarchy
Material 3Modern UI Design System
Curved Navigation BarCurved Bottom Tab Navigation
IntlIndonesian Currency & Date Formatting
Cupertino IconsiOS-Style Iconography
Backend & Cloud Services
Cloud FirestoreReal-time NoSQL Cloud Database
Firebase AuthUser Identity & Session Security
Firebase CorePlatform Client Handshake
Firebase CLICloud Configuration & Deployment
DevOps & Code Quality
Flutter Lints 5Dart Static Analysis & Style Enforcement
Flutter TestWidget & Unit Testing Framework
Git & GitHubSource Control & Collaborative Versioning
Codebase Structure & Data Models
Clear boundary separation between system components, paired with modular schemas and structured repositories.
📁 lib/features/ (Feature-First Modules)
├──home/ — HomeScreen, Hero DetailPage, ItemFoodModel, promotional sections
├──cart/ — CartScreen with swipe-to-dismiss, InputAdress bottom sheet modal
├──whislist/ — WhislistScreen with 2-column reactive grid and instant toggle
├──track_status/ — TrackStatusScreen with 4-stage stepper and transit logs
├──profile/ — ProfileScreen with Firestore user data fetching and logout
├──onboarding/ — SplashScreen, Onboarding intro, and SignupPage dual-write
Database Entities & Schema Models
Firestore: /products
Global catalog collection containing title, price, rating, category tags, local/network image paths, and culinary descriptions.
Firestore: /users/{uid}
User profile document storing full name, email, birth date, delivery address, and server-side creation timestamp.
Firestore: /users/{uid}/cart
Active user basket items with smart quantity counters (+1 auto-increment) and addedAt server timestamps.
Firestore: /users/{uid}/wishlist
User favorited items with single-tap toggle capability (atomic write or delete).
Firestore: /users/{uid}/orders
Order history recording purchased items array snapshot, total_price, status progression, and order_date.
05SECURITY, API & PRODUCTION IMPACT
Hardened Perimeter & Data Safety
Cloud security architecture combining Firebase Auth token verification, user-scoped Firestore access, and server-side timestamp validation.
API Endpoints & Routing Architecture
Authentication (Firebase Auth)
POSTcreateUserWithEmailAndPasswordUser registration with email/password and dual-write to Firestore
POSTsignInWithEmailAndPasswordStateless session authentication with granular exception handling
POSTsignOutSession termination and navigation stack reset
Catalog & Products (Firestore Streams)
GETcollection('products').snapshots()Real-time stream of all products with client substring filtering
POSTseedDatabase()Automated catalog verification and demo combo menu insertion
Cart Operations (Subcollection /cart)
GET/users/{uid}/cart.snapshots()Real-time shopping basket stream with subtotal and fee computation
POSTaddToCart(ItemFoodModel)Smart cart query: auto-increments quantity or creates new document
DELETEremoveFromCart(docId)Instant document deletion triggered by Dismissible swipe gesture
POSTcheckout(totalPrice)Atomic cart-to-order migration and cart clearing
Wishlist & Orders (Subcollections /wishlist & /orders)
POSTtoggleWhislist(ItemFoodModel)Atomic heart toggle: deletes if exists, adds if absent
GET/users/{uid}/wishlist.snapshots()Real-time user wishlist stream rendered in 2-column grid
GET/users/{uid}/orders.snapshots()Order history stream ordered by order_date descending
Enterprise Security & Governance Standards
Firebase Auth Credential Guard
Stateless token-based authentication with granular exception handlers for invalid-email, wrong-password, and brute-force too-many-requests throttling.
User-Scoped Subcollection Isolation
Cart, wishlist, and order subcollections are strictly scoped under each user's unique uid, preventing cross-user data exposure.
Server-Verified Timestamps
Transactional operations utilize FieldValue.serverTimestamp() to neutralize client device clock tampering and ensure audit integrity.
Smart Cart Deduplication Logic
Pre-write query inspection prevents duplicate rows, consolidating identical items into a single document with incremented quantities.
Engineering Challenges & Production Results
How critical technical bottlenecks were overcome and verified under real production conditions.
Challenge // 01
Preventing duplicate cart items without introducing heavy client-side state bloat. Solved by implementing a pre-write Firestore query in addToCart() that inspects existing document titles, incrementing quantity (+1) if already present or creating a new document with quantity: 1.
Challenge // 02
Maintaining fluid 60 FPS scrolling while streaming real-time catalog and search queries. Solved by leveraging client-side substring filtering over active Firestore snapshot streams, eliminating redundant read index queries.
Challenge // 03
Designing an engaging multi-stage order tracking visualization. Built a custom 4-stage delivery stepper paired with chronological transit checkpoints and horizontal item summaries.