Building Pickles Retro Gaming – A Laravel E-Commerce Platform from Scratch
Overview
Laravel 11 – Inertia.js – Vue 3 – Tailwind CSS – Stripe
Pickles Retro Gaming started as a personal project with a clear goal: build a proper e-commerce store from the ground up, get every decision right, and end up with something reusable for future client work. What came out the other side is a full-stack storefront with a real admin panel, advanced shipping and VAT rules, product variants, customer reviews, and a full checkout powered by Stripe.
Starting with the Database
Before writing a single component, every table and relationship was mapped out. Products, orders, categories, coupons, reviews, shipping methods, stock notifications – all designed up front. This might seem slow, but it meant that when development started in earnest, the application logic had a solid foundation to sit on rather than being retrofitted around an evolving schema.
The product variant system is a good example of why this matters. Each product can have multiple attributes – colour, size, region – and every combination of those attributes is its own purchasable entity with its own price, stock level, SKU, and images. That kind of data model only works cleanly if it is thought through before any code is written.
Building with Claude Sonnet in VS Code
Every feature was built using Claude Sonnet inside the VS Code Copilot chat panel. The workflow was simple but disciplined: describe the feature, review and test the output, then move on. Nothing moved forward until it worked correctly.
The real value was not just the code generation – it was the back-and-forth. Asking “what happens when a product has no variant selected but the user tries to add it to the cart?” forced the logic to be tightened before it became a live bug. Each iteration improved robustness rather than just adding surface area.
This made it practical to build systems in isolation – the coupon engine was complete and tested before the checkout form existed, the tax helper was wired up before any price was displayed, the variant matching logic was verified before the product page was styled.
The Design – Pixel Cat and All
The aesthetic was not planned. It evolved.
The first version was clean and minimal – functional but forgettable. Leaning into the retro gaming theme meant going darker: deep steel backgrounds, monospace type, neon accents in pink, cyan, and yellow. Custom Tailwind colours and utility classes gave every button and card a consistent neon-bordered feel.
The logo came from an unexpected place. Rather than commissioning anything, I took a pixel-art portrait of my own cat – Pickles – and used it as the brand mascot. It sits in the navigation bar rendered intentionally blocky, the way old-school pixel art should look.
It went through several rounds of tweaking – header layout, card borders, button shapes – before landing somewhere that felt right. The tension between the pixel art and the cyber-neon palette is what makes it memorable.
Shipping and VAT Done Properly
These are two areas where most solutions cut corners. Here they were built to be genuinely flexible.
Shipping supports multiple methods with flat-rate or weight-based pricing, and a free-shipping threshold per method. Weight-based methods use configurable rate bands so different weights attract different prices – all managed through the admin panel without touching code.
VAT is fully configurable: the rate, the label (VAT, GST, Sales Tax), whether prices are stored inclusive or exclusive of tax, and how prices are shown to customers – inclusive, exclusive, or as a full breakdown. A single composable handles all of this across every Vue component, so the logic lives in one place and every price on the site stays consistent.
The Commerce Features
Beyond the fundamentals, the platform covers everything a real store needs:
Coupons support percentage off, fixed amount, fixed per item, and free shipping – with expiry dates, usage limits, minimum cart values, and an auto-apply mode.
Reviews can be left by guests or registered customers, support photo uploads, and are automatically flagged as verified purchases when the reviewer’s email matches a completed order. All reviews go through admin moderation before appearing publicly.
Back-in-stock notifications let customers sign up for an email when a product or specific variant is restocked. When an admin updates stock levels, the notifications fire automatically.
SEO was treated as a first-class feature. Every product page generates structured data for Google’s rich results – including pricing, availability, and review ratings. Sitemaps are generated automatically and can be pinged to Google and Bing directly from the admin panel.
Why It Is Reusable
Everything specific to Pickles Retro Gaming – the name, the currency, the tax rate, the payment keys – lives in the settings panel, not in the code. Adapting this for a different client means changing configuration, not rewriting logic.
That was the point from the start. Build it once, build it properly, and the next project starts from a much stronger place.
About the Author
Stephen Ainsworth
Stephen is a web developer who has been building websites and applications for over a decade. He continues to build projects and solutions for clients and enjoys teaching others in his field.
