(05)Case studySpice brand storefront

Drylicious

An online store for Drylicious, a Pakistani spice brand. I built the shop customers order from and the private portal the owner runs it from.

My role
Full-stack developer
Built with
Next.js, Node.js, PostgreSQL
The Drylicious storefront: From farm to flavour
The Drylicious admin portal: today's orders, sales and what to pack
A Drylicious product page on a phone
(01)In short

01

What the client wanted

A store that feels as premium as the spices, works for home cooks and wholesale buyers, and lets people order the way they already do: on WhatsApp.

02

What I built

The whole thing: the storefront, a checkout, one-tap WhatsApp ordering, a wholesale page, and a private admin portal led by a super admin.

03

The result

A live store with 24 products in 4 collections, run day to day by the owner and their team, with no developer needed.

products on the shelf
24products on the shelf
collections
4collections
ways to order: checkout or WhatsApp
2ways to order: checkout or WhatsApp
wholesale tiers, up to 100kg
3wholesale tiers, up to 100kg

Counted on the live store, October 2026

(02)What I built4 highlights

Made for kitchens, and for business.

Each highlight says what it does for the people buying, and how it works underneath.

01

Every spice, beautifully shelved.

24 spices across four collections: whole spices, pure spices, best sellers, and pickles and sauces. Every product has its own page with a photo, pouch size, price and a quantity picker.

For shoppers

Find the spice, see the price, add it in one tap.

Under the hood

Next.js App Router pages, prerendered so they load fast and show up well in search.

The Whole Spices collection
The Long (Cloves) product page on a phone

02

Order on WhatsApp, already written.

Many customers in Pakistan would rather order on WhatsApp than fill in a form. One tap on "WhatsApp buy" opens a chat with the whole order typed out: every item, its size, the quantity, delivery and the grand total.

For shoppers

No forms. Press send and the order is in.

Under the hood

The basket is turned into a formatted message and opened with a wa.me link, so it works on any phone.

The basket with two spices, the order summary and both ways to pay
The WhatsApp chat with the order already written out

03

A checkout in three steps.

For people who prefer the website, Direct Checkout takes them through details, shipping and confirmation. The basket also shows how far they are from free delivery.

For shoppers

Clear steps, and you can track the order after.

Under the hood

Totals, delivery fee and the free-delivery target are worked out live as the basket changes.

Step one of the Direct Checkout

04

Wholesale, by the kilo.

Shops and restaurants get their own page: three volume tiers from 1kg trial packs to 100kg+ shipments, and a short form that asks for the business and the weight they need.

For shoppers

Bulk buyers ask for rates in under a minute.

Under the hood

A separate page and form, so wholesale buyers never get lost in the retail shop.

Wholesale volume tiers and the enquiry form
(03)Behind the counterAdmin portal

The owner runs it all, from one portal.

Behind its own login, the admin portal is where the store is run: products and prices, orders from the website and WhatsApp, wholesale enquiries and offers. The super admin decides who can do what.

Super admin

The owner

  • Everything in the store: products, prices, collections, offers and settings
  • Invites or removes admins
  • Decides what each admin can change

Admin

The team

  • Packs and tracks orders
  • Updates products, stock and prices
  • Answers wholesale enquiries
  • Can't change the team or the store settings
Admin dashboard
Today at a glance. New orders, sales this month, what's left to pack and what's running low.
Team and access, for the super admin only
Team & access. Only the super admin sees this: who's on the team, and exactly what each admin can change.
Products and prices
Products & prices. Change a price, mark a spice out of stock or put it on sale, and the store updates.
An order with its tracking steps
Every order, tracked. From placed to delivered, with where each order came in: the website or WhatsApp.

The real portal is private, so these screens are recreated with sample orders and team members. The products, photos and prices are the store's own.

(04)How it works

One store, two ways in.

Shoppers come in through the storefront; the owner and team come in through the admin portal. Both talk to the same backend, so a price changed in the portal is the price on the shelf.

That backend is my Node and Express API with a PostgreSQL database, managed through Prisma. The storefront is built with Next.js and prerendered, so pages open fast even on a slow connection.

  1. Step 1

    A shopper picks their spices

    Next.js storefront, prerendered pages

  2. Step 2

    The basket adds it all up

    Subtotal, delivery and free-delivery target, live

  3. Step 3

    They order how they like

    3-step checkout, or a pre-written WhatsApp message

  4. Step 4

    The team takes it from there

    Admin portal on Node + Express, Prisma, PostgreSQL

Built withNext.jsReactNode.jsExpressPrismaPostgreSQLWhatsApp ordering
(05)The result

A premium store the owner runs on their own.

Drylicious is live with 24 products in four collections. Customers order on the website or on WhatsApp, wholesale buyers have their own page, and the owner and team keep it all up to date from the admin portal.

Open to work

Have a project like this in mind?

I build complete web and mobile apps, for full-time roles or freelance work, remote in any time zone. A quick call is the fastest way to start.

I reply within a day, usually less.