Store conversion
Navigation, search, the mobile bar and profile screens were rebuilt around product sales. The menu turned out to be database-driven, so old records were hidden and a guard was added in code as well.
E-commerce
Campmatik
A camping-gear store converted from an events platform: database-driven navigation, one shared product card and a legal layer rewritten for physical goods. 56k lines of code, 47 tables.
Technical profile
What it is built with
| Stack | React 18 + TypeScript, Vite, Tailwind CSS, Framer Motion |
|---|---|
| Backend | PostgreSQL with edge functions and row-level security |
| Codebase | ~56,000 lines · 329 files |
| Interface | 141 components · 35 pages · database-driven navigation |
| Database | 47 tables · 72 versioned migrations |
| Server functions | 17 (payments, email, image resizing, automated blog) |
| Payments | 3-D Secure cards, instalments, campaign and coupon engine |
| Media | Object storage with separate desktop/mobile crops for category banners |
| Legal | Distance selling and 14-day withdrawal flows rewritten for physical goods |
What makes it different
Not a standard website
- Converted from an events platform into a store. Ticket, attendee and event logic was removed and replaced with variant products, basket and shipping — migrating a working system instead of rewriting from zero.
- Navigation comes from the database, not the code. The top menu, mobile bar and category structure are edited from the admin panel; the code only holds a fallback list.
- One product card in three places. Homepage shelves, category rows and the product grid share a component, so add-to-basket and favourites behave identically everywhere.
- Category banners are shot in two crops. Desktop portrait and mobile landscape are produced separately — a single image left the subject outside the frame in one of them.
- Legal texts follow goods regulation. Distance selling, returns and the withdrawal right were rewritten for physical products, and travel-agency badges were removed.
- Structured data declares a store. Search engines receive an online-store schema rather than a generic organisation.
What we did
The solution in five parts
Homepage store experience
Category tiles, deals, new arrivals and featured categories as horizontal shelves with banners, closing with a trust strip: secure payment, shipping, returns and genuine products.
One product card
A shared card with a price-brand-name hierarchy, used identically by the homepage shelves, category rows and the product grid. Add-to-basket and favourite behaviour is handled in one place.
Image infrastructure
Category banners are produced in separate desktop and mobile crops, served from object storage and overridable from the admin panel.
Legal and corporate layer
Privacy, terms, returns and distance selling texts were rewritten for physical-goods commerce including the 14-day withdrawal right; company title, address and contact details are fed from a single source.
Components
What was built
- Variant-level product management and per-variant stock
- 3-D Secure card payments and an order state machine
- Campaign, coupon and basket-threshold rules
- Courier dispatch and status notifications
- Structured data as an online store rather than a generic organisation
- Site settings, navigation and theme managed from the admin panel
- Image resizing and modern-format conversion pipeline
- A layering system that fixed mobile bar and modal conflicts
Other projects
Take a look at these
Want a similar system?
Most of the problems we solved on Campmatik repeat across sectors. Tell us about yours and we will scope it together.