All case studies
Case study 10Full-Stack

Merchant Dashboards & Payments

React and TypeScript dashboards, checkout, and subscriptions, with load time cut from 3.2s to 1.4s.

Role
Full-stack engineer · dashboards and payments
Core stack
ReactTypeScriptNode.jsDjangoPostgreSQL
3.2s→1.4s
Median dashboard load time
Auditable
Transaction records for every payment event
CI
GitHub Actions with API and regression tests

Overview

Built merchant dashboards, checkout flows, and subscription management for retail clients, backed by payment webhooks and reconciliation that keep money and inventory consistent.

Merchants needed fast, accurate dashboards, and payments had to stay consistent even when providers retried webhooks or delivered them out of order.

Product walkthrough

The flow, screen by screen

Merchant dashboard
01 / 03

Merchant dashboard. Revenue, orders, and subscriptions at a glance, loading in 1.4s after query tuning and Redis caching (down from 3.2s).

ArchitectureCorePlatformAsync / control
order updatesMerchant dashboardReact · TypeScriptCheckout & subscriptionsReact · TypeScriptAPIsNode.js · DjangoRedis cachehot reportsPostgreSQLtuned reporting queriesPayment providerwebhooksWebhook handleridempotency · retriesReconciliationinventory sync · audit
Dashboards and checkout call shared APIs; payment webhooks are processed idempotently and reconciled into PostgreSQL, with Redis caching hot reports.

Approach

  1. 01Developed merchant dashboards, checkout flows, and subscription management in React and TypeScript, backed by Node.js and Django APIs.
  2. 02Implemented payment webhooks, reconciliation jobs, and inventory synchronization with idempotency keys, retry handling, and auditable transaction records.
  3. 03Optimized PostgreSQL reporting queries and introduced Redis caching for dashboard data.
  4. 04Added API integration tests and frontend regression coverage, containerized deployments, and introduced GitHub Actions.

Key decisions

Idempotent webhook handling

Providers retry deliveries; idempotency keys ensure each payment event is applied exactly once.

Fix the query, then cache

Tuning reporting queries first, then caching hot results, cut load time without hiding slow SQL.

Outcomes

  • Consistent payments and inventory under retries.
  • Faster, more reliable releases through CI and containers.
  • React
  • TypeScript
  • Node.js
  • Django
  • PostgreSQL
  • Redis
  • Docker
  • GitHub Actions

Working on something similar?

I work with clients worldwide, across any time zone. Tell me what you're building.