Next.js + Shopify
Swapitt.com.au
How I took a collectibles retailer from one online sale a fortnight to over 3x revenue by rebuilding their entire digital operation. Custom headless Shopify storefront, admin portal, HR system, and multi-store tools.
- Client
- Swapitt
- Type
- Headless eCommerce Platform
- Timeline
- 2025–Present
- Stack
- Next.js 14, TypeScript, Firebase, Shopify APIs, Tailwind CSS
- Live site
- swapitt.com.au

The Client
Swapitt is a growing Australian collectibles retailer that sells trading cards, sealed products, graded slabs, and sports memorabilia. They carry everything from Pokémon and One Piece to NBA, NRL, WWE, and UFC, across product types like sealed booster boxes, elite trainer boxes, individual singles, and PSA/CGC/BGS graded slabs. They started with a single physical store in Taren Point, Sydney, and have since expanded to six locations across the city, with more on the way.
When Swapitt first approached me, their online store was a basic Shopify template. It was doing about one online sale every two weeks. Competitors like Cherry and EB Games had much better digital experiences, and Swapitt’s Shopify setup was holding them back. Every new feature required a paid plugin, and those plugins rarely did what the business needed. There were no slabs or singles listed online, no admin tools, no analytics, and no way to manage operations outside of Shopify’s basic dashboard.


My Role
I was originally brought on as a freelancer to rebuild the website. That engagement turned into a full-time role where I now run Swapitt’s entire digital operation. I design and build everything: the storefront, the admin portal, product photography, marketing, and the day-to-day product listings. I work directly with store managers, employees, accountants, and the business owner to figure out what’s not working and build something better.
None of this was built to a spec document. Every feature came out of a real conversation about a real problem, and I iterated on each one until it worked for the people using it.
The Architecture Decision
The first big decision was whether to ditch Shopify entirely or build on top of it. All of Swapitt’s physical stores relied on Shopify POS for payments, inventory, and order management. Ripping that out would have meant retraining every employee at every location on a new system, with no guarantee it would be better for in-store operations.
So I kept Shopify as the backend. Its payment processing, order management, and POS infrastructure are solid, and the staff already knew how to use it. I built a completely custom Next.js frontend that talks to Shopify through its APIs. This gave the business full creative and functional control over the online experience without touching anything in-store. I also eliminated all the paid Shopify plugins and replaced them with custom-built features in the admin portal, using Firebase alongside Shopify’s Storefront and Admin APIs.
The Custom Storefront
The storefront was designed from scratch around how collectibles buyers shop. Collectors come in looking for specific cards by grading, sport, set, and rarity. The site needed to make that discovery easy, show real-time stock across all stores, support features like “Make an Offer” on high-value items, and work well on mobile where most of the traffic comes from.
Homepage
The homepage needed to immediately communicate what Swapitt is about. The hero section highlights the latest promotions and featured products, with clear calls to action. Below that, category tiles let customers jump straight into Pokémon, NBA, One Piece, or whatever they’re after.

Category Browsing
Collectors care about their categories. Instead of a generic dropdown menu, I built a visual category page with large tiles for each product line: TCG, NBA, Soccer, Baseball, One Piece, Combat Sports, Australian Sports, and more. Each tile takes customers into a filtered product view with stock levels, pricing, and availability across all locations.

Product Catalogue and Filtering
The product catalogue has custom filtering by price range, category, brand, and keyword search. Stock indicators show how many items are left (“Only 2 left”, “Only 1 left”), which matters a lot for limited-run collectibles. Everything syncs with Shopify’s inventory across all physical locations, so what customers see online is always accurate.

Product Details and Offers
Each product page shows high-resolution imagery, grading details, real-time stock across all stores, and multiple purchasing options. Customers can choose delivery or in-store pickup at a specific location. For higher-value items like graded slabs, there’s a “Make an Offer” button that lets buyers negotiate directly. The old Shopify template couldn’t do any of this. Afterpay and Zip are also integrated for larger purchases.

Bringing Slabs and Singles Online
Before the rebuild, Swapitt had no slabs or singles listed online at all. The old Shopify setup only let you add one product at a time, and each card needed manual entry of the name, grading company, grade, category, barcode, and images. It took about 10 minutes per card. For a store sitting on hundreds of graded slabs worth hundreds of thousands of dollars, that just wasn’t going to work.
I built a dedicated Slabs and Singles section with its own browsing experience, search, category filtering, sort options, and availability toggles. But the storefront was only half the problem. The real breakthrough was the bulk upload engine I built into the admin portal.

The Bulk Upload Engine
Staff scan cards using a high-res scanner, up to nine slabs at a time, then drag and drop the images into the admin portal. The system automatically pairs front and back images, reads the card name from the slab label, figures out the category, and fills in every Shopify product field. The only thing staff need to enter manually is the price, because that depends on their knowledge of the current market.
What used to take 10 minutes per card now takes seconds. A batch of 100+ slabs can be scanned, processed, and listed in under 20 minutes. This one feature opened up an entire product category for online sales and has been one of the biggest revenue drivers for the business.
- High-res scanner integration with automatic front/back image pairing
- Auto-detection of card name, grading company, grade, and category
- Drag-and-drop interface built for non-technical store staff
- 30x improvement in listing speed
The Admin Portal
This is where the project goes well beyond a typical website rebuild. The admin portal I built runs the business. Inventory, sales analytics, purchasing, HR, finance, customer management, multi-store administration. All of it lives in one system, and all of it was built for employees who have zero technical background. These are people who don’t really use computers outside of work, but they need to interact with this platform every day.
To give you a sense of scope, here’s what the admin sidebar looks like: Dashboard, Sales Analytics, Orders, Offers, Reserved Orders, Sell to Us, Want List, Stock, Consignment, CardLadder Sync, Purchase Log, Stock Take, Supplier Orders, Store Credit, Receipts, Invoices, Store Reports, Customers, Product Catalog, Timesheets, Employees, Dealers, Dealer Catalog, Admin Users, Contracts, Careers, and Locations. Every one of those sections exists because someone in the business needed it.
Stock and Inventory Management
The stock management system gives full visibility across all products, locations, and categories. Managers can see total inventory value, slab count and value, singles count and value, and drill into individual products with their status, price, barcode, tags, collection, location, and vendor. Bulk operations, price checking tools, and advanced search make it possible for a small team to manage thousands of products.

Employee Management and HR
Before I built this, employee management was handled through WhatsApp messages and text threads. Leave requests, timesheets, rosters, payroll. All informal, all scattered, all error-prone. I built a full HR system inside the admin portal where employees can log in, check in for shifts, track their hours, see their pay calculations and super, and submit leave requests.
Managers can approve or decline leave from a calendar view, manage rosters, and run payroll. Accountants have their own access level for payroll data and employee payment info. The system handles leave balance calculations and distinguishes between casual and permanent employees.

Store Credit Ledger
Customers regularly trade in collections worth thousands of dollars, and before this system existed, the business tracked those balances from memory and informal notes. I built a ledger that tracks every transaction, both incoming and outgoing, for every customer. It shows credit owed to customers, amounts owing from customers, and the net financial position at a glance.
Staff can pull up a customer’s full transaction history, add new transactions, generate invoices, and manage balances across locations. This system alone has saved the business real money by finally giving them visibility into where they stand financially with each customer.

Scaling to Six Stores
The platform was originally built for one store in Taren Point. As Swapitt expanded to Wollongong, Darlinghurst, Manly Vale, Hurstville, and Parramatta (with Barangaroo coming next), I re-architected the whole system so every store’s inventory could come online and each location’s team could manage their own stock, orders, and operations through the admin portal.
This was probably the biggest undertaking of the entire project. Adding a “location” dropdown was never going to cover it. I had to rework the admin portal at its foundation. Every section needed permission layers: owners see everything, managers see their store’s data, employees see only what’s relevant to their role. Stock levels had to be tracked per-location. Login sessions had to be scoped to the right store. And it all had to stay simple enough for staff with no technical experience.
- Role-based access: owners, managers, and employees each see different views
- Per-store inventory tracking with individual stock levels and pricing
- Multi-staff login with sessions scoped to each location
- Adding a new store takes configuration, not development
A Living Platform
I still work on Swapitt every day. The platform has been built up iteratively over the past year, with each feature coming out of a real need, tested with the people who use it, and refined until it works properly. New stores open, employees flag problems with their workflows, the business finds new opportunities, and I build solutions. Because I work inside the business full-time rather than off a brief, I understand the context behind every request, and that leads to better outcomes.
The Results
Measurable impact on online revenue and business operations.
- 230%+
- Online Revenue Growth
- 3x
- Online Customers
- 30x
- Listing Efficiency
- 6
- Stores Online
- $500K+
- Inventory Tracked
- 75%
- More Traffic
- Online revenue growth (230%+): From ~$130K to over $400K in annual online revenue after migrating to the custom platform
- Online customers (3x): Online customer base nearly tripled year-on-year with the new storefront experience
- Listing efficiency (30x): Bulk upload engine took product listing from 10 minutes per card to 100+ cards in 20 minutes
- Stores online (6): Platform scaled from a single-store system to multi-location operations with role-based access
- Inventory tracked ($500K+): Complete real-time visibility across all products, categories, and store locations
- More traffic (75%): Website sessions grew 75% year-on-year with the new storefront driving organic discovery
Before vs After
Old Shopify Store
- ~1 online sale per fortnight
- ~$130K annual online revenue
- No slabs or singles listed online
- 10 minutes to list a single product
- Single-store system, no admin tools
- Dependent on costly Shopify plugins
- No HR, no finance tools, no analytics
- Employee management via WhatsApp
Custom Headless Platform
- Hundreds of online orders per month
- Over $400K annual online revenue
- Full slab and singles catalogue with bulk upload
- 100+ products listed in 20 minutes
- Multi-store admin with role-based permissions
- Zero plugin dependencies, fully custom
- Full HR, finance, and analytics platform
- Store credit ledger and payroll built in
Technical Implementation
The technology powering the platform.
Next.js 14 + TypeScript
Server-rendered headless Shopify storefront with type-safe code, API routes for custom business logic, and optimised performance.
Firebase + Shopify API
Firestore for admin data, user sessions, and real-time operations. Shopify Storefront and Admin APIs for products, orders, and inventory.
Tailwind CSS + Headless UI
Utility-first responsive styling with accessible component patterns across both the storefront and admin portal.
Role-Based Admin Portal
Multi-tenant admin system with scoped permissions for owners, managers, employees, accountants, and dealers across all locations.
Sales Analytics
Custom analytics dashboard tracking revenue, orders, and performance across channels, locations, and time periods.
Netlify + CI/CD
Continuous deployment pipeline with automated builds, preview deploys, and production hosting on Netlify’s edge network.
Ready to start your project?
Tell us what you want to build and we’ll work out how to get there.
Get in touch