Building Pickles Retro Gaming – A Laravel E-Commerce Platform from Scratch

Posted on: by Stephen Ainsworth

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.

Categories: Case Studies

About the Author

stephen ainsworth

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.

Follow Stephen on Socials

Share on Socials

Leave a Reply

Your email address will not be published. Required fields are marked *

*
*