Alwafi for Computers
A bilingual storefront, a 24-model commerce backend, and the pipeline that ships it
- Design · Frontend · Backend · Database design · Infrastructure
Alwafi for Computers (الوافي للحاسبات) is a Baghdad technology retailer with three decades of trading behind it. Storefront, API, data model, and infrastructure — designed, built, and run end to end.
The problem
The previous site had no caching layer. Every page view reached the database, so the store paid for the same query on every visitor.
600ms is not a slow graph — it is a customer comparing three laptops on a phone. And it failed in the wrong direction: the busier the shop got, the worse it served the people arriving to buy.
The design
The storefront as drawn in Adobe XD — desktop and phone, light and dark.
Architecture
Two codebases, deployed independently. Language is a route segment, so both directions are real, server-rendered, cacheable URLs.
- Next.js App Router · React Compiler · Tailwind
- Express · TypeScript · Zod at every boundary
- MongoDB · 24 models · Redis on read paths
- ~12k lines API · 23 route groups · 25 services
Not just a catalogue
The model list is closer to a small commerce platform than a storefront.
Access control
Affiliates
Own analytics
Transactional email
Live notifications
Verified orders
Price matching
AI descriptions
The shop runs it
A retailer whose pricing moves daily cannot wait on a developer. So the admin is bespoke — 28 sections. A generic CMS was never on the table: it would have meant fighting someone else's content shapes forever.
- Homepage sections, navbar, brand logos, card styles
- Pages, buying guides, promo pages, spec templates
- Products with approvals, orders, promo codes, reviews
- Translations edited in-dashboard — Arabic is not a dev task
- Its own SEO panel: business details, share cards, debug
Every section is gated by the permission system, so the same dashboard is safe for a junior staff member and for the owner.
Two directions
The store runs in English and Arabic. Arabic is right-to-left, so layout, iconography, and every directional affordance mirror — while numerals, SKUs, and Latin brand names stay left-to-right inside the same line of text.
Localisation runs on both sides of the wire: message formatting in the client, and a localisation layer in the API so emails, notifications, and order statuses arrive in the right language too.
Being found
A storefront nobody can find is a brochure.
~24 schema.org types — Product, Offer, returns and shipping policy, ratings, FAQ, opening hours
- hreflang alternates and explicit canonicals on every URL
Per-product OG images rendered at the edge, configurable from the dashboard
- Catalogue exported for Meta shopping and ads
Structured data makes the shop legible as a real Baghdad business rather than an anonymous domain. Share cards matter because a link pasted into WhatsApp — where a great deal of Iraqi commerce happens — arrives carrying the product, the price, and the shop.
Shipping and running
Push to GitHub
Or run the full deploy
PM2 supervises
NGINX and TLS
Content stays fresh
Redis runs in Docker with append-only persistence. Releasing is a non-event.
Handling the rush
Alwafi's reputation was built over thirty years offline, so traffic arrived in rushes rather than a curve — the hardest shape to plan for, because the peaks break you and the average tells you nothing.
The answer was not more servers. It was making sure the same question never had to be answered twice: Redis in front of the read paths, a warming script so the first customer of a surge does not pay for everyone else, static pages at the edge with on-demand revalidation, and rate limiting on writes.
Two hundred times faster — and the shape matters as much as the size. The site no longer slows down as it gets busier. A rush loading the same category page costs about what one shopper costs.
Outcome
Search visibility followed. With structured data, working hreflang, a sitemap that stays current and generated share cards, the store began ranking for terms it had never appeared for — reaching customers who were not already looking for it by name.
Speed was the mechanism. A store that answers in 3ms feels maintained, and a store that feels maintained is one people hand their money to. The performance work and the trust are one result measured two ways.
That trust is what justified the scope. Roles, affiliates, analytics, the dashboard — none of it is speculative. Each part exists because the shop outgrew doing it by hand.
The strongest outcome is the one that sounds like a loss: the shop no longer needs a developer to run its own website. Catalogue, content, both languages, and its own SEO are handled in-house. A platform that has stopped depending on the person who built it is a finished one.