Shohruz Makhmudov — home / Drawing set 2026
W-03 TechGeek.uz — Smart-glasses storefront for Uzbekistan, RU / UZ Commerce Live

TechGeek.uz

A data-built storefront for smart glasses in Uzbekistan: 104 SKUs in Russian and Uzbek, prices in dollars or sum, checkout through Telegram.

Storefront hero (Russian version) with the headline “Gadgets from around the world. To your order.”, a Ray-Ban Meta render over an outlined “meta” wordmark and a floating product card.
Mobile hero with the stacked headline, the primary call to action and the product render, under a compact header with language switch, cart and menu.
  1. Variant configurator
  2. USD ↔ UZS at the central-bank rate
  3. Telegram-draft checkout
  4. RU / UZ technical SEO
Discipline
Commerce
Year
2025–26
Authorship
Own build
Status
Live
Role
Sole developer and operator of the web channel: design, front end, catalogue pipeline, serverless API and SEO.
Surfaces
Web storefront · desktop and mobile
Languages
RU · UZ
Stack
HTML · CSS · Vanilla JavaScript · Node.js build scripts · Vercel Functions · GitHub Actions · JSON-LD · Google Merchant feed
W-03.1TechGeek.uz Sheet 1 of 7

Survey — context and problem.

The problem

A variant-heavy catalogue, prices buyers think of in sum, no payment back end — and a v1 that exposed a bot token in public code.

TechGeek.uz sells Ray-Ban Meta, Oakley Meta and Meta smart glasses, plus WHOOP bands, to buyers across Uzbekistan. Everything is ordered on request and sourced from abroad; a manager closes each order in Telegram or by phone, and delivery across the country is free.

The catalogue is the hard part. Smart glasses come in a large matrix of generations, frames, colours, lenses and sizes, and local buyers cannot order from Meta’s store directly. Prices must be credible and readable in sum, not only in dollars. Grey-market worries make trust essential. The store has no payment processor or order back end, and it needs to be found on both Google and Yandex, in Russian and in Uzbek.

The first version, a dark wholesale landing page from December 2025, also pushed orders to Telegram from client-side code — which meant a bot token sat in public JavaScript. The job was to turn it into a retail storefront that is fast, honest about availability and safe by design.

W-03.2TechGeek.uz Sheet 2 of 7

Authorship — who built what.

Own buildSole developer and operator of the web channel: design, front end, catalogue pipeline, serverless API and SEO.Visibility: Public AI-assisted — I build with AI coding agents — Codex, Claude Code, Antigravity. Spec, architecture decisions, review, QA, deployment and handover are mine.

What was mine

  • Product and UX design of the v2 retail storefront
  • Catalogue pipeline: sourced product data → 104 SKUs → pages, sitemap and Merchant feed
  • Front end in hand-written HTML, CSS and vanilla JavaScript
  • Serverless proxy for the Central Bank of Uzbekistan exchange rate
  • Technical SEO: RU / UZ pages, hreflang, structured data, Merchant Center, Yandex and Bing
  • Security fix: removed the client-side bot and its token from the live code
  • Tests and CI site checks; a daily agent-run SEO routine with guardrails

AI in the loop

I build with AI coding agents — Codex, Claude Code, Antigravity. Spec, architecture decisions, review, QA, deployment and handover are mine.

Agents on this project: Codex · Antigravity

Credits & notes

  • Product names and imagery belong to Meta, Ray-Ban, Oakley and WHOOP. TechGeek.uz is an independent reseller, not an authorised dealer.
W-03.3TechGeek.uz Sheet 3 of 7

Plan — the system, drawn first.

The solution

A static storefront generated from sourced catalogue data: variant configurator, USD ↔ UZS at the central-bank rate, a Telegram-draft checkout and bilingual technical SEO.

Instead of typing products by hand, the storefront is generated. Public product data is collected from Meta’s store, normalised into 104 SKUs across 13 glasses families plus WHOOP, priced by a single rule and published by a deterministic build into model pages, homepage cards, the sitemap, structured data and a Google Merchant feed. A CI check fails the build if prices disagree anywhere. Each model gets a configurator that swaps image, price, SKU and URL state as colour, lens and size change. Prices switch between dollars and sum through a small Vercel function that proxies the Central Bank of Uzbekistan rate, caches it and returns an honest error rather than an invented number. The cart is local and tamper-proof, and checkout opens a pre-filled Telegram message — no bot token and no personal data in public code.

System schematic · Not to scale W-03.3
Users & surfaces Web storefront · desktop and mobile RU · UZ
04 · Interface Static HTML · CSS custom properties · vanilla JS · Manrope
02 · Logic Node.js build scripts · deterministic generator
03 · Intelligence Codex agent: daily SEO routine with guardrails
01 · Data catalog.json · 104 SKUs · sourced product JSON-LD
00 · Infra Vercel CDN · one Node function · GitHub Actions

Module key

  1. Catalogue with category, line, generation and sort filters and a live results count
  2. Variant configurator on every card and model page, with URL state
  3. USD / UZS switch backed by the Central Bank rate, marked as indicative
  4. Persistent, tamper-proof cart drawer with cross-tab sync
  5. Pre-filled Telegram order draft in Russian or Uzbek
  6. 13 model pages in two languages, buyer’s guides and a real 404
  7. Structured data: Organization, ProductGroup, Offer, Breadcrumb, FAQ and Article
  8. Google Merchant feed, sitemap, llms.txt, Yandex and Bing verification

Key decisions

  1. Why static HTML instead of a framework

    A storefront like this is content that changes between builds, not between clicks. Prebuilt pages with no npm runtime dependencies load fast, index cleanly and leave very little to patch.

  2. Why checkout is a Telegram draft, not a bot

    The v1 bot needed a token in the browser. A pre-filled t.me message needs no secret at all, keeps the manager’s workflow, and is tracked as intent — never as a sale.

  3. Why the catalogue is generated, not typed

    One source file feeds pages, structured data, the sitemap and the Merchant feed, and CI compares prices across all of them. A price cannot be right on one page and wrong on another.

  4. Why sum prices are marked indicative

    The rate comes from the Central Bank of Uzbekistan and is cached for an hour. If it cannot be fetched, the site says so instead of guessing, and rates older than ten days are rejected.

  5. Why availability says “on request”

    Nothing is marked in stock until fulfilment is confirmed, and quote-only items never show a zero or a fixed total. Honest availability is cheaper than a broken promise.

W-03.4TechGeek.uz Sheet 4 of 7

Elevations — the desktop screens.

Storefront hero (Russian version) with the headline “Gadgets from around the world. To your order.”, a Ray-Ban Meta render over an outlined “meta” wordmark and a floating product card.
Mobile hero with the stacked headline, the primary call to action and the product render, under a compact header with language switch, cart and menu.

All elevations 03

  1. Catalogue section with category tabs, line, generation and sort selects, a USD / UZS currency switch and the first row of smart-glasses cards.
    Fig. 4.1 Catalogue section with category tabs, line, generation and sort selects, a USD / UZS currency switch and the first row of smart-glasses cards.
  2. Electric-blue Ray-Ban Meta feature panel with a lime 12 MP camera callout and three numbered benefits.
    Fig. 4.2 Electric-blue Ray-Ban Meta feature panel with a lime 12 MP camera callout and three numbered benefits.
  3. Ray-Ban Meta Gen 1 vs Gen 2 buyer’s guide with a comparison table and “when to choose” cards.
    Fig. 4.3 Ray-Ban Meta Gen 1 vs Gen 2 buyer’s guide with a comparison table and “when to choose” cards.
W-03.5TechGeek.uz Sheet 5 of 7

Details — the mobile screens.

Two-column catalogue in Uzbek with prices in sum; each card has its own variant select and add-to-request button.
Mobile hero with the stacked headline, the primary call to action and the product render, under a compact header with language switch, cart and menu.
Mobile Oakley Meta Vanguard page with the Transitions Ember variant selected, the on-request status and the colour, lens and size selector.

Every mobile screen 05

Mobile hero with the stacked headline, the primary call to action and the product render, under a compact header with language switch, cart and menu.
Fig. 5.1 Mobile hero with the stacked headline, the primary call to action and the product render, under a compact header with language switch, cart and menu.
Two-column catalogue in Uzbek with prices in sum; each card has its own variant select and add-to-request button.
Fig. 5.2 Two-column catalogue in Uzbek with prices in sum; each card has its own variant select and add-to-request button.
Mobile Oakley Meta Vanguard page with the Transitions Ember variant selected, the on-request status and the colour, lens and size selector.
Fig. 5.3 Mobile Oakley Meta Vanguard page with the Transitions Ember variant selected, the on-request status and the colour, lens and size selector.
Full-screen mobile cart with two items, free delivery, the total and the Telegram-draft checkout with an explanatory note.
Fig. 5.4 Full-screen mobile cart with two items, free delivery, the total and the Telegram-draft checkout with an explanatory note.
The blue Ray-Ban Meta feature panel on mobile, reflowed into one column with the 12 MP callout and the benefit list.
Fig. 5.5 The blue Ray-Ban Meta feature panel on mobile, reflowed into one column with the 12 MP callout and the benefit list.
1 / 5
W-03.6TechGeek.uz Sheet 6 of 7

Materials schedule — the stack, and why.

W-03.6 · Materials schedule
LayerMaterialWhy
01Datacatalog.json · 104 SKUs · sourced product JSON-LDOne normalised source feeds every page, schema block and feed.
02LogicNode.js build scripts · deterministic generatorRebuilding the whole catalogue is one command, and CI checks prices end to end.
03IntelligenceCodex agent: daily SEO routine with guardrailsCrawl, index and feed health checked every day, with cooldowns, no invented data and human approval for anything external.
04InterfaceStatic HTML · CSS custom properties · vanilla JS · ManropeFast pages with no framework and self-hosted Cyrillic and Latin font subsets.
05InfraVercel CDN · one Node function · GitHub ActionsStatic hosting plus a single serverless proxy for the exchange rate; CI runs tests and site checks on every push.

Stack

  • HTML
  • CSS
  • Vanilla JavaScript
  • Node.js build scripts
  • Vercel Functions
  • GitHub Actions
  • JSON-LD
  • Google Merchant feed
W-03.7TechGeek.uz Sheet 7 of 7

Completion — outcome and links.

Verified facts

SKUs across 13 glasses families + WHOOP
104
Source: site check, 29 Sep 2026
indexable URLs, RU + UZ
44
Source: sitemap, 29 Sep 2026
npm runtime dependencies
0
Source: from the repository, Sep 2026
storefront languages
RU · UZ

Want to see it running?

I can walk you through the live system on demo data and explain the decisions behind it.

Request a walkthrough
Next sheet W-04 ARDIFIT AI Engine Clinical-safety rule engine and guard-railed GPT-4 coach (client work) AI & automation 2025–26