E-commerce Platform · Bangladesh

UK Bangla International — E-commerce Platform

Designed and developed a full-featured e-commerce platform for UK Bangla International — modern storefront, product and inventory management, customer accounts, payments, automated invoicing, Pathao Courier integration, and SEO-focused architecture for online retail in Bangladesh.

View Live Site
UK Bangla International e-commerce homepage and mobile shopping interface
Framework
Next.js
React SSR & App Router
Backend
Node.js
Express + REST APIs
Database
PostgreSQL
Prisma ORM Architecture
Logistics
Pathao
City · Zone · Area API
Client Type
E-commerce Business (Bangladesh)
Business Problem
Unstructured product catalogue, manual order workflows, stock discrepancy risks, and complex Bangladesh courier zoning.
Scope / Stack
Full-Stack E-commerce (Next.js, React, Node.js, Express, PostgreSQL, Prisma, Pathao Courier API, PDF Invoicing)
Delivery
8 Weeks
Outcome
Scalable online shopping platform, multi-level Pathao Courier integration, automated inventory & invoicing, and SEO-first architecture
Overview

A complete e-commerce platform built for product discovery, ordering and delivery

UK Bangla International is a Bangladesh retail business delivering authentic beauty, personal care, baby, and household products across a rich multi-category catalogue. Rising digital demand called for an online shopping platform with effortless discovery and a dependable purchase workflow.

Rather than a simple product showcase, Ab Nahid Agency treated the build as an end-to-end operational commerce system — unifying product variants, real-time inventory, guest checkout, Bangladesh-specific payments, Pathao delivery fees, automated PDF invoicing, order tracking, reviews, and full administrative control.

Challenge

Building a complete e-commerce workflow around Bangladesh-specific shopping and delivery requirements

A high-converting retail platform in Bangladesh must solve unstructured catalogues, dynamic stock, multi-tiered courier zoning, and diverse payment habits.

  • Product Catalogue ComplexityMulti-attribute variants (shade, volume, scent), SKU tracking, offer pricing, galleries, and demo videos across nine departments — without slowing browsing.
  • Inventory & Stock ManagementHigh-volume retail risks overselling and stock discrepancies without automated tracking of available, low-stock, and out-of-stock states per SKU.
  • Complete Checkout WorkflowForced account creation and cumbersome steps drive cart abandonment; the flow needed to serve guests and repeat customers with minimal friction.
  • Bangladesh Delivery RequirementsFlat-rate shipping fails here — checkout needs hierarchical City → Zone → Area selection with real-time delivery fees before confirmation.
  • Payment FlexibilityCash on Delivery, manual Mobile Financial Services verification (bKash, Nagad, Rocket), and an extensible architecture ready for automated gateways.
  • Structured Order LifecycleFulfillment across warehouses and couriers requires clear states — PENDING to CONFIRMED, READY, SHIPPED, DELIVERED, or CANCELLED — with audit logging.
  • Customer Management & RetentionLifetime value demands user accounts with saved addresses, order history, wishlists, and admin CRM segmentation of new versus VIP customers.
  • SEO at Scale Across Dynamic PagesHundreds of dynamic surfaces — categories, subcategories, brands, product URLs — needed SEO & speed optimization with clean canonicals and no crawl bloat.
Solution

A full-stack e-commerce architecture designed for products, customers, orders and delivery

We engineered a custom, full-stack commerce architecture tailored to UK Bangla International's operations: a Next.js development storefront with server-side rendering for fast product indexing, and Tailwind CSS for a refined, responsive shopping interface.

The backend runs Node.js and Express on PostgreSQL with Prisma ORM — strict schema validation, ACID-compliant order transactions, and fast multi-category filtering — with native Pathao Courier logistics, an administrative CRM, and on-demand PDF invoicing.

01

Next.js Storefront & Dynamic Discovery

Server-rendered pages with instant search, dynamic filtering, responsive mobile UX, and client-side cart, wishlist, and checkout state.

02

Node.js, Express & Prisma Backend

RESTful APIs with transactional order processing, JWT/role-based security, Zod validation, and zero inventory drift.

03

Pathao Logistics & Commerce Operations

City → Zone → Area routing, automatic delivery pricing, consignment creation, and PDF invoicing with admin fulfillment workflows.

Storefront Experience

Product discovery designed around a structured e-commerce catalogue

A clean, hierarchical catalogue guides shoppers from broad departments down to specific variants — with instant search, clear pricing, and availability signals on every screen.

Browsing

Multi-Tier Category & Brand Navigation

Parent-child navigation across nine departments (Hair Care, Skin Care, Baby Items, Home & Kitchen, Toiletries…) with subcategory and brand filtering.

Hierarchical category filtering
Brand showcase pages
Breadcrumb context
Search & Filtering

Instant Search & Faceted Discovery

Locate items by keyword, brand, category, or SKU with price and stock filters.

Debounced instant suggestions
Price & stock filters
Client-side sorting
Product Page

Rich Product Detail Experience

Photo galleries with zoom, embedded demo videos, multi-variant selectors, and dynamic offer pricing.

Variants with live stock updates
Embedded demo videos
Wishlist & Buy Now
Product Management

Centralised product and catalogue management

A centralised e-commerce admin dashboard acts as the single source of truth for the entire catalogue — products, variants, media, and SEO metadata.

Complete Product Lifecycle Control

Create, edit, duplicate, and archive products with category and subcategory assignments.

Category & brand taxonomy
SKU / barcode tracking
Draft · Published · Inactive

Multi-Attribute Variant Matrix

Configure variations (100ml, 250ml, shades, scents) each with independent pricing, SKUs, and stock limits.

Attribute-specific SKUs
Regular & offer pricing
Variant image switching

Multimedia & Rich Content

Multiple high-resolution photos, primary thumbnail designation, embedded video URLs, and formatted descriptions.

CDN-optimised uploads
YouTube / Facebook embeds
Rich HTML descriptions
Inventory Control

Inventory management with real-time stock visibility

Real-time synchronization between storefront orders and warehouse stock prevents customers from ordering sold-out items, with automated thresholds for restocking.

Automated Stock Deductions

Inventory updates transactionally on checkout confirmation — multi-item carts never oversell available stock.

Low-Stock Alerts & Warnings

Configurable minimum thresholds trigger visual warning badges in the admin dashboard.

Storefront Availability States

'In Stock', 'Only X Left', and 'Out of Stock' badges, with checkout disabled for unavailable variants.

Cart & Checkout Flow

Flexible cart and checkout flow for registered and guest customers

Checkout was engineered to be fast, transparent, and mobile-friendly — supporting single-click Buy Now, a persistent cart, and full Guest Checkout without forced account creation.

Add to Cart & Instant Buy Now

Interactive slide-out cart drawer, or 'Buy Now' to jump straight to checkout with the selected variant.

Guest & Registered Checkout

One-step phone-and-address checkout for guests; pre-filled details for account holders.

Dynamic Price & Delivery Calculation

Order summaries show subtotal, coupon discounts, location-based shipping, and the final payable balance.

Delivery & Logistics

Bangladesh-focused delivery architecture with Pathao Courier integration

A direct Pathao Courier API integration automates location selection, delivery charge calculation, consignment creation, and tracking inside the order pipeline.

  1. 01
    Customer Selects City

    City chosen from the live Pathao directory (Dhaka, Chittagong, Sylhet…).

  2. 02
    System Loads Zones

    The backend returns available delivery zones for the selected city.

  3. 03
    Customer Selects Zone

    Specific zone selected (Dhanmondi, Gulshan, Uttara, Mirpur).

  4. 04
    System Loads Areas

    Local areas within the zone populate the dropdown selector.

  5. 05
    Delivery Price Computed

    Exact inside/outside-Dhaka courier rates calculated before submission.

  6. 06
    Order Confirmed

    Customer reviews the pricing breakdown and submits the order.

  7. 07
    Backend Order Creation

    Order persisted, shipping coordinates recorded, inventory locked.

  8. 08
    Pathao Consignment Issued

    One-click consignment generation with an official consignment ID.

  9. 09
    Logistics Tracking

    Consignment and parcel status saved for tracking and updates.

Order Lifecycle

Structured order management from checkout to delivery

The admin panel tracks orders across standardized lifecycle milestones — contents, customer details, payment proof, and courier info on one unified screen.

Status: PENDING

Order Placement & Verification

New orders land in PENDING; staff verify contact numbers, stock, and manual payment TrxIDs.

Status: CONFIRMED & READY

Fulfillment & Packaging

Confirmed orders move to packaging with printable pick-lists and automated PDF invoices.

Status: SHIPPED & DELIVERED

Courier Handover & Completion

Pathao handover marks orders SHIPPED with tracking; delivery confirmation moves them to DELIVERED.

Payment Architecture

Flexible payment architecture for Bangladesh e-commerce

With Cash on Delivery still dominant alongside Mobile Financial Services, the platform pairs current workflows with an extensible, gateway-ready architecture.

Cash on Delivery (COD)

Order nationwide with payment collected at the doorstep by the delivery courier.

Manual MFS Workflows (bKash / Nagad / Rocket)

Transfer to merchant numbers, then submit sender phone and Transaction ID for admin verification.

Extensible Online Gateway Architecture

Modular payment layer ready for SSLCommerz, Shurjopay, or bKash Direct without rewriting checkout.

Invoicing & Billing

Automated invoice generation for customer orders

An automated PDF engine produces standardized, print-ready invoices for every confirmed order — packing slip for the warehouse, proof of purchase for the customer.

Complete Order Itemization

Customer details, Invoice Number, Order ID, and a full item table with SKUs, variants, quantities, and unit prices.

Financial & Discount Breakdown

Subtotal, coupon savings, promotional discounts, delivery charges, and the net payable amount.

Shipping & Courier Information

Delivery notes, recipient instructions, and Pathao consignment identifiers on the document.

Customer Accounts & CRM

Customer account experience and administrative CRM

A self-service customer dashboard pairs with an administrative CRM to nurture relationships across the entire lifecycle.

Customer Account Dashboard

A personalized portal to monitor active orders, review purchase history, manage addresses, and curate a wishlist.

  • Order status & invoice downloads
  • Multi-address book
  • Wishlist → Add to Cart
  • Profile & password management

Admin E-commerce CRM

Operational visibility into customer behavior, order frequency, and aggregate spend for segmenting VIP buyers.

  • New / Repeat / Inactive segments
  • Lifetime order & revenue history
  • Staff notes & service logs
  • Admin-assisted order creation
Promotions & Engagement

Promotions, customer notifications and verified reviews

Flexible promotional engines, transactional notifications, and verified reviews drive sales velocity and social proof.

Promotions

Discounts & Flash Offers

Coupon codes (percentage or fixed), flash sales with countdown timers, offer labels, and free-shipping thresholds.

Coupon expiry validation
'Save 15%' offer badges
Free delivery by subtotal
Communication

Automated Order Notifications

Email confirmations at key milestones (Placed, Shipped) and instant admin alerts for new orders.

HTML confirmation emails
Admin new-order alerts
Push notification ready
Social Proof

Verified Customer Reviews

Star ratings and written reviews, with purchase history verified before granting buyer badges.

1–5 star ratings
Verified buyer badges
Admin moderation
SEO Architecture

SEO-first e-commerce architecture built for scalable organic search

Every page is built for scalable organic indexing — a technical SEO architecture with clean URL taxonomies, automated structured data, and internal linking hierarchies.

SEO-Friendly URL Taxonomy & Canonicalization

Clean, descriptive, human-readable slugs replace query-string parameters; canonical tags are strictly enforced across variations.

  • Clean URLs: /category/skin-care
  • Strict self-referencing canonicals
  • Clean pagination handling
Clean URLsCanonical TagsDuplicate Prevention

Dynamic Metadata & OpenGraph Protocols

Every category, brand, and product page generates unique titles, meta descriptions, and social cards for high-intent Bangladeshi search keywords.

  • Titles with brand & variant
  • Automated meta descriptions
  • OpenGraph & Twitter cards
Dynamic TitlesMeta DescriptionsOpenGraph

Structured Internal Linking Hierarchy

A crawlable linking mesh flows equity from the homepage through categories, brands, and products.

  • Home → Category → Brand → Product
  • Related Products links
  • Breadcrumb navigation
Internal MeshBreadcrumb LinksEquity Flow

JSON-LD Structured Data & XML Sitemaps

Schema.org JSON-LD delivers rich snippets, while a dynamic XML sitemap indexes all active public URLs.

  • BreadcrumbList markup
  • WebSite & Organization schema
  • Dynamic XML sitemap
BreadcrumbListSchema MarkupDynamic XML Sitemap
Performance & Reliability

Performance engineering and secure e-commerce operations

Modern performance engineering and enterprise-grade security keep conversion rates high on the mobile connections common across Bangladesh.

Server-Side Rendering & Edge Caching

Next.js SSR delivers instant HTML for mobile users and fully crawlable pages without client execution delays.

Next.js Image Optimisation & CDN Delivery

Automatic WebP/AVIF conversion, viewport-sized responsive srcsets, and dramatically smaller payloads.

Data Protection & Role-Based Access

JWT httpOnly authentication, bcrypt hashing, granular permissions, Zod validation, and parameterized Prisma queries.

Process

Structured engineering process for a scalable e-commerce platform

Week 1

Discovery & Commerce Architecture

Mapped catalog taxonomy, customer journeys, Bangladesh payment/courier requirements, and the relational database schema.

Week 2

UI/UX Design & Design System

Built the Tailwind CSS design system — product cards, navigation, cart drawer, checkout, dashboards, and admin panels.

Week 3–4

Next.js Storefront Development

SSR storefront with instant search, variant selectors, offer pricing, wishlist, and guest/authenticated checkout.

Week 4–5

Backend & Database Engineering

Node.js/Express REST APIs on PostgreSQL with Prisma — secure auth, transactional inventory, order state management.

Week 6–7

Integrations & Commerce Operations

Pathao City-Zone-Area API, automated PDF invoicing, transactional emails, and admin CRM capabilities.

Week 8

SEO, Performance & Production Readiness

Canonical URLs, dynamic sitemaps, JSON-LD markup, image optimization, and end-to-end checkout testing.

Results

A complete e-commerce foundation built for growth

An enterprise-grade digital retail operation tailored to the Bangladesh market — effortless discovery in front, automated fulfillment behind.

Storefront
Full E-commerce Platform
Structured discovery, variant selectors, instant search, cart drawer, and guest checkout.
Catalog
Centralised Product & Stock Control
Unified control of categories, brands, variants, SKUs, pricing, media, and auto inventory deductions.
Logistics
Pathao Courier Integration
City → Zone → Area selection with automatic fees, consignments, and tracking.
Operations
Automated PDF Invoicing
Instant itemized invoices with SKUs, consignment info, and discount breakdowns.
SEO
Search-Ready Architecture
Clean canonical URLs, dynamic metadata, and JSON-LD across hundreds of pages.
CRM
Admin & Customer Management
Full order lifecycle, customer segmentation, repeat-buyer analytics, self-service dashboards.
Technology Stack

Modern full-stack e-commerce technology stack

Frontend & UI
  • Next.js (App Router)
  • React
  • TypeScript
  • Tailwind CSS
  • Lucide & React Icons
  • Responsive Mobile Layouts
Backend & Database
  • Node.js
  • Express.js
  • PostgreSQL
  • Prisma ORM
  • RESTful APIs
  • Zod Validation
  • JWT Authentication
Logistics & Commerce Operations
  • Pathao Courier API
  • City · Zone · Area Routing
  • PDF Invoice Engine
  • Transactional Email Notifications
  • Custom Admin CRM Dashboard
  • Customer Portal
Business Impact

More than an online store: an operational commerce system

The platform connects every stage of the retail journey into an automated, transparent operational pipeline.

Orders are no longer taken on social media and tracked in spreadsheets — every customer touchpoint feeds administrative fulfillment, inventory replenishment, and courier logistics automatically.

Connected Operational Commerce Flow
01
Discovery
SEO, categories & search
02
Selection
Variants, media & offers
03
Cart
Slide-out cart & Buy Now
04
Checkout
Guest or saved profile
05
Payment
COD or MFS verification
06
Orders
Admin verification & pick
07
Inventory
Auto stock deduction
08
Logistics
Pathao consignment & PDF
09
Tracking
Consignment & parcel status
10
Retention
Accounts, wishlist & CRM
01

Eliminated Manual Logistics Overhead

Automated location lookup and Pathao consignment generation eliminated hours of manual data entry per shipping batch.

02

Reduced Stock Discrepancies

Transactional inventory sync across variants protects the business from overselling out-of-stock SKUs.

03

Built for Scalable Organic Acquisition

An SEO-first URL and taxonomy foundation to rank for high-intent beauty and household searches in Bangladesh.

Key Insights

What this project required

Key engineering and operational takeaways from building a custom e-commerce platform for the Bangladesh retail market.

01

E-Commerce Architecture Must Match Business Operations

A store must reflect warehouse packing, invoice printing, and payment verification workflows to deliver real value.

02

Logistics Hierarchy Dictates Checkout Design

Flat-rate shipping loses margin — dynamic City → Zone → Area courier costing in checkout is critical.

03

Product Taxonomy Determines Both UX and SEO

Clean categories, subcategories, and brands defined early serve both navigation and crawlability.

04

Inventory and Order Logic Must Be Transactional

Prisma/PostgreSQL transactions keep inventory, orders, and payment logs in sync under high traffic.

05

Admin Workflows Matter as Much as Storefront UX

Bulk actions, pick-lists, instant invoices, and status filters prevent daily fulfillment bottlenecks.

06

SEO Cannot Be Added as an Afterthought

URLs, canonicals, OpenGraph, and structured data must be baked into server components from day one.

Like what you see?

Need a custom e-commerce platform?

Whether you are launching a new online store or replacing an outdated e-commerce system, we can design and build a fast, SEO-friendly platform tailored to your actual business workflow.