E-Commerce / Retail Tech

Belanja E-Commerce

A high-performance, mobile-first e-commerce web application featuring real-time domestic shipping calculations, secure electronic payments, dynamic discounting, and order tracking.

CategoryMobile-first B2C Marketplace
FocusCheckout, Shipping, Payments
RoleFull-Stack Engineer & API Integration
Belanja E-Commerce storefront dashboard preview

Overview

Belanja E-Commerce was developed for a regional physical retailer moving from informal chat-based sales channels to a self-service online store. The system automates inventory reservation, shipping estimation, payment reconciliation, and order tracking as order volume scales.

Problem

Retail staff had to manually check inventory, verify bank transfer receipts, query courier rates, record shipping details, and send tracking numbers. This caused delayed responses, overselling during promotions, postage errors, and cart abandonment.

Solution

We built a responsive SPA-like web application using Laravel, Livewire, and TailwindCSS. Checkout calculations are automated through courier APIs, payments are reconciled through signed webhooks, and cart selections stay synchronized across guest and authenticated sessions.

Checkout & Operations Architecture

The checkout flow combines real-time shipping rate lookup, payment gateway integration, hybrid cart synchronization, and pessimistic inventory locking. This keeps order creation, stock reservation, and payment status updates consistent even when customers leave the browser before payment is completed.

Key Features

  • Mobile-optimized storefront with sticky navigation, gesture-friendly layouts, and safe-area handling.
  • Automated courier rates for multiple domestic shipping carriers based on package weight and destination.
  • Payment gateway integration for virtual accounts, QRIS, and e-wallets with signed webhook callbacks.
  • Hybrid cart synchronization between session storage and authenticated database carts.
  • Pessimistic inventory locking to prevent overselling limited-stock items during high-traffic checkout.
  • Delivered-only product reviews and downloadable PDF invoices with role-based access.

Tech Stack

Laravel Livewire TailwindCSS Alpine.js Midtrans Biteship
FrameworkPHP, Laravel, Livewire, Alpine.js
InterfaceTailwindCSS with mobile-first storefront interactions
PaymentsPayment gateway integration with signed webhook callbacks
ShippingDomestic courier rate API integration
DataEloquent ORM with transaction isolation and inventory locks

Contribution

Architected the relational database schema, models, custom enum castings, and migrations; engineered payment and courier API wrappers; implemented secure webhook signature validation; built Livewire storefront pages; and created tests for third-party payment flows and discount payloads.

Impact

The system moves order confirmation, payment checking, postage lookup, and stock reservation from manual staff work into automated workflows. Inventory locking reduces overselling risk, while webhook-based reconciliation keeps order status and stock updates resilient.

Need A Commerce System That Scales?

We can help turn manual chat-based selling into a structured checkout, payment, shipping, and order management workflow.

Discuss Project