Following on from the Pocket Rice marketing website, the next website I have been working on is for Matcha Byron Bay.

Matcha Byron Bay started as a stall at the Byron Bay Farmers Market in July 2022. The business is run by Japanese locals who source their matcha from Uji (near Kyoto), and these days they sell online Australia-wide and supply matcha and hojicha to cafes, retailers and other businesses.

This blog post gives an overview of the new website, some of the technology behind it (kept at a high level), the design choices we made, and where things are at with wholesale, SEO and sales so far.

The previous website was built on WordPress with WooCommerce. It did the job, but it had some issues that were costing the business:

The guiding principle for the rebuild was that the website is the means, not the end. It exists to sell products, generate wholesale enquiries, build trust in the brand and reduce the effort it takes for someone to buy. Every decision below was weighed against those outcomes.

The new website launched in July 2026. As part of that, we migrated the products, collections, customers, historical orders, articles and media across to Shopify, and mapped the legacy URLs over with redirects so that existing search traffic still landed somewhere sensible.

The new Matcha Byron Bay home page

Shopify is the commerce backbone. It owns the catalogue, pricing, checkout, customer accounts, orders, payments, subscriptions and (more recently) wholesale companies.

The storefront itself is headless. It is a TanStack Start React application that talks to Shopify through the Storefront API, using Shopify's new framework-agnostic Hydrogen developer preview (what I have been referring to as "Hydrogen 2.0").

This version of Hydrogen describes itself as a toolkit rather than a framework. The original Hydrogen was tied to Remix (and later React Router), whereas the new core is plain JavaScript with thin bindings on top. That gives you a typed Storefront API client, cart handlers that work before any client JavaScript has loaded, and consent-aware analytics, without being locked into a particular framework. TanStack Start is not one of the officially listed frameworks in the preview, but because the core is framework-agnostic, wiring it in was straightforward.

The storefront is server-rendered on Cloudflare Workers, so pages render close to the customer and static assets are served from Cloudflare's edge. Checkout is still Shopify's hosted checkout, so payments stay with Shopify.

The following is a simplified look at the architecture:

The Worker renders pages using data from the Storefront API, and Shopify's checkout takes over for payment. Paid orders and other events then flow back into our background jobs, which write to storage. How the code gets deployed is covered further down.

A few reasons for going headless over a Shopify theme:

The trade-off is that we own more. Things Shopify themes give you for free (like predictive search and account pages) needed to be built or handed off to Shopify-hosted pages.

Similar to Pocket Rice, I wanted the infrastructure to be reviewable and repeatable rather than clicked together in dashboards.

At a high level:

Feature branches each get their own disposable preview Worker with a stable URL. That makes it easy to share changes with the business before anything goes live, and previews are never indexed by search engines.

Anything that does not need to happen during a page request is pushed into the background. Form submissions and Shopify webhooks (for events like paid orders) are recorded and handed to Cloudflare Queues, where consumers handle things like enquiry emails, wholesale invoices and purchase attribution. For the work that really matters (like invoices), a scheduled job picks up anything that gets stuck, so a dropped message does not mean dropped work.

For observability, errors go to Sentry, each request emits a single structured "wide event" to Cloudflare's logs, and product analytics go through PostHog once a visitor has given consent.

On the code side, the server is written with Effect so that failures (Shopify being slow, a bad response, a missing permission) are typed and handled explicitly rather than silently turning into empty pages.

The design leans on the brand's colours (deep green, olive and cream), with photos from the market stall and the tea fields in Uji doing a lot of the storytelling.

One small trade-off worth calling out: some of the light yellow text on green does not meet colour contrast requirements, so the site will not score a perfect accessibility audit. We decided to keep the brand colours rather than water them down.

The home page puts proof up front. The hero carries a Google rating badge, and directly underneath it is a "Found at" strip with logos of the cafes and markets where you can find the matcha, followed by a carousel of real Google reviews.

Found at and loved by, right under the hero

From there, the focus is on helping someone pick the right tea quickly. We added a comparison between the three main teas, badges for what each one is best for, and size selection with add-to-cart directly on the card.

Product cards with sizes and subscriptions

The shop is broken up into collections such as ceremonial matcha, culinary matcha, hojicha, tea tools and ritual sets.

Collections page

The product pages went through a conversion review after launch. The goal was to answer four questions as quickly as possible: which tea suits me, what will it taste like, how much tea am I getting, and what will delivery cost? That led to things like an approximate number of servings and cost per serving next to the price, delivery information next to the add to cart button, and a subscription option at 10% off.

The Nami product page

Since launch we have also added moderated product reviews with verified-purchase badges, plus a free delivery tracker and a complementary add-on in the cart.

The flow for a retail customer looks roughly like this:

The market QR codes are worth a mention. The stalls are still a big part of how people find Matcha Byron Bay, so for physical placements like the stall we generate QR codes with campaign tags baked in. That way offline traffic can be attributed like any other campaign.

The owner, Ayumu, is Japanese, and the business began as a dream between Japanese friends living in Byron Bay. The brand story is very much about the connection between Uji and Byron Bay, and the about page tells that story directly, including the team's names in katakana.

From the mist of Uji to the rhythm of Byron Bay

The about page walks through the journey from that first market tent to where they are today.

Our journey of a thousand mornings

This had some practical implications for the build as well:

The Japanese version of the wholesale buyer guide

Commercially, the wholesale page is one of the most important pages on the site. Cafes, retailers and workplaces buy in much larger quantities than retail customers, so every new wholesale partner matters.

The wholesale page hero

The page went through a dedicated SEO and messaging review. The first version had a lovely brand story, but its main heading ("Bring beautiful matcha to your business") did not say what the page was actually for. The heading was changed to say exactly what the page is for, and the page was restructured to answer the questions a cafe owner actually has before they enquire.

Social proof comes first, with logos from the wholesale community.

Poured, stocked and shared by our wholesale community

The business started in Byron Bay, but it supplies cafes Australia-wide. Rather than create a thin landing page for every city (which tends to backfire), the page talks about where we supply in one place and answers the city-specific questions in the FAQ.

Australia-wide wholesale, with support for key cafe markets

One of the bigger decisions was to publish guide pricing. It is common for wholesale pages to hide pricing behind a form, but cafe owners want to compare cost per gram and cost per cup before talking to anyone. Publishing it builds trust, and it also gives search engines something concrete to rank for. The prices a buyer actually pays come from their own catalogue in Shopify.

Wholesale pricing, cost per gram and cost per cup

Further down, the page explains exactly how ordering works, from first enquiry to paid invoice.

How the wholesale portal works

The enquiry form asks for enough to qualify the lead (business type, location and what they are interested in). Submitting it emails the business our wholesale pricing and partnership PDF and notifies the team, so nobody is left waiting for a reply to find out the basics.

The wholesale enquiry form

Finally, the FAQ covers the long-tail questions cafe owners ask (and search for), such as whether we supply Sydney and Melbourne, which matcha suits lattes, and how many drinks you get out of 1kg.

Wholesale FAQs

The wholesale journey end-to-end looks like this:

The newest piece of the website is a wholesale portal where approved cafe and retail buyers can place orders themselves.

Without a portal, every wholesale order and invoice is a manual back-and-forth. That works with a handful of partners, but it does not scale.

Signing in to the wholesale portal

The split of responsibilities is intentional:

Each venue is a Shopify company location with its own pricing, delivery address and order history. Buyers can pay by card through Shopify's checkout, or choose bank transfer. For bank transfers, the portal shows Shopify's calculated delivery and GST for review, places an unpaid order and emails an invoice with the payment details. Staff mark it as paid in Shopify once the money arrives.

Placing a wholesale order (demo data)

Invoices are generated in the background from Shopify's order events. They are stored privately, versioned when an order changes, and only served after checking that the buyer still has access to that order.

Onboarding was treated as part of the feature rather than an afterthought. The support page works before you sign in and has the walkthrough video with chapters for each step, plus the printable buyer guides in English and Japanese.

Wholesale portal support with the bilingual walkthrough

The find us page lists every market the stall attends with the day, hours, location and a link to a map. It is also marked up with local business structured data for search engines.

Find Matcha Byron Bay at local markets

The blog holds the preparation guides, tea explainers and local guides. Like Pocket Rice, the posts now live as MDX in the repository rather than in a CMS.

Notes on matcha, preparation and everyday tea ritual

SEO for a small local business has been the hardest part of the project, and it is very much still in progress.

The first challenge was the migration itself. After launch, a number of old WordPress URLs were still indexed, and some of them led to pages that no longer existed. We audited the legacy URLs, added redirects for anything with value and made sure the sitemap only contains the pages we want indexed. Indexing is also locked to the production domain, so preview deployments never end up in search results.

Locally, things are in good shape. The Google Business Profile ranks first in the map pack for searches like "byron bay matcha". One lesson here: rank trackers can be misleading for local queries. Our tracker reported a big drop for "best matcha near me", but it turned out it was being served Sydney results rather than what someone in Byron Bay would see.

Backlinks are where it gets hard. Third-party tools show hundreds of referring domains for the site, which looks great until you look at them. Nearly all of them are automated spam and "checker" sites that started linking in May 2026 and carry no value. The genuine links are few and far between (and one of them is Pocket Rice, which I will admit is not exactly an independent vote).

What we really want are links from the cafes and businesses we supply, as well as the markets and local guides that already mention the brand. That is harder than it sounds:

So the approach is to make linking worthwhile and easy. We write content that features partners (such as where to find our hojicha at Old Maids in Brunswick Heads and the best matcha around Byron Bay and the Northern Rivers), give partners something they would want to share, and ask market organisers and local guides to turn existing mentions into links. A handful of real, local links would outweigh the entire spam profile.

The blog has been the weakest area so far. It gets plenty of impressions but very few clicks, and some of the older articles overlap and compete with each other. The plan is to consolidate those into fewer, stronger guides with named authors and proper updated dates.

It is still early, and the numbers are small enough that I want to be careful with them, but there are some encouraging signs.

At launch, Google's PageSpeed lab tests across 11 equivalent pages had the new site scoring 96 to 100 on mobile and 100 on desktop. For comparison, the old home page scored 83 on mobile.

From the September report (compared to August):

In September we started running Google Shopping campaigns for the ceremonial matcha and hojicha. Getting there took more work than expected: the Merchant Center feed and the website needed clear shipping, returns and business information before Google was happy to show the products.

The campaigns are delivering clicks, but it is too early to say whether they are worth it. Attribution is the hard part:

To close that gap, we built our own purchase attribution. With consent, the campaign tags from the landing page are carried through to the cart, and when Shopify tells us an order has been paid, a background job records the purchase against the original campaign. Until that data is reliable, we are holding off on increasing spend.

I may write a follow-up once we have a few more months of data, particularly on the wholesale side.