All work

ModeTech

Electronics store and admin console on one TanStack Start app. Guest checkout, staff roles, 994-product import, OpenTelemetry tracing.

Year
2026
Role
Sole developer
Stack
Bun, TanStack Start, PostgreSQL, Redis, Grafana
Links
modetech.shop
ModeTech homepage with featured productsModeTech power banks category with brand and sort filtersModeTech product page with price, discount, and add to cart

The public storefront at modetech.shop.

BrowserCaddyTanStack appPostgreSQLRedisObject storeGrafana CloudOTel Collectortraces, logs, metrics

One Bun process serves the store and the admin console. Highlighted: the app and the telemetry pipeline I added.

The job

ModeTech sells phone and computer accessories online in Pakistan. I built the storefront and the admin console as one TanStack Start app on Bun, and I run its servers. The first version shipped in three weeks, with more than 240 commits across about 80 pull requests.

Checkout without accounts

Checkout works without an account, so the server does all the trust work:

modetech.shop · guest checkout
Browser
App server
PostgreSQL
place order · key 7f3a · total Rs 9,400
current prices, discounts
2 lines
recomputed total Rs 9,850. Browser total ignored.
save order #1042 · key 7f3a
order #1042
place order · key 7f3a (again)
order for key 7f3a?
#1042 exists
order #1042, no new order
1 order

    A guest places an order. The browser sends the cart, an idempotency key, and a total it computed itself.

    Illustrative. Prices, the key, and the order number are made up.

    1. A guest places an order. The browser sends the cart, an idempotency key, and a total it computed itself.
    2. The server ignores that total. It loads current prices and discounts and recomputes every line.
    3. It saves the order under its idempotency key and returns it.
    4. The customer double-clicks. A second request arrives with the same key.
    5. The key already has an order, so the server returns that order. There is still only one.

    The admin console

    Staff manage products, categories, brands, discount codes, bulk promotions, and the homepage layout. A live dashboard and an order queue show what needs attention.

    Staff accounts use Better Auth with a permission grid and presets for common roles. Admin actions go to an audit trail. On the first run, the app creates an admin account and forces a password change before anything else works.

    Importing the catalogue

    The store had to open with a full catalogue. I wrote an import pipeline that pulled 994 products in 37 categories from an existing WooCommerce catalogue through its Store API, and mapped them onto a new tree with 7 parent categories. The pipeline optimizes each image before it uploads it to Oracle Object Storage.

    Data and safety

    Deploys and observability

    Staging and production run on an Oracle Cloud ARM server behind Caddy. One Bash script does a deploy: it builds locally, copies the build with rsync, runs migrations over an SSH tunnel, restarts the app with PM2, and checks health.

    OpenTelemetry traces every request and every database query. An OpenTelemetry Collector on the server sends the traces, the logs, and host and PostgreSQL metrics to Grafana Cloud. When a page is slow, I can see which query caused it.