Tech Stack

| Layer | Technologies | |-------|--------------| | Frontend | Next.js 16 (App Router), React 19, TypeScript, Tailwind CSS 4 | | Backend | Next.js API routes, Prisma 7, PostgreSQL | | Database | Vercel Postgres / Prisma Accelerate (serverless-friendly) | | Auth | NextAuth.js v5 (credentials, session, role-based) | | Payments | Stripe (checkout, webhooks) | | Deployment | Vercel (serverless, env-based config) | | Other | PWA (installable), Resend (optional order emails), DVLA/VDG vehicle APIs |

About this project

Features

Shop (customer)

Browse categories and 240+ sample products (GSF-style category tree)
Find by vehicle: enter registration (DVLA/VDG lookup) or choose make/model/year
Product pages, cart, Stripe Checkout, order confirmation
Responsive layout and mobile navigation
Installable PWA (Sparex branding, favicon, manifest)

Admin (protected)

Dashboard with products, categories, and orders CRUD
Responsive admin UI with mobile menu
Role-based access (admin-only routes via middleware)

Auth

Sign in / Register (credentials)
Session handling and redirects
Seeded admin user for demo

Data & ops

Prisma migrations and shared seed (categories, products, vehicles, admin)
Seed runnable locally or via secure API on Vercel
Product images use app logo (/spareparts.png); seed updates placeholders to logo
Env support for DATABASE_URL, POSTGRES_URL, STORAGE_PRISMA_DATABASE_URL (Vercel/Accelerate)

Highlights

Full e-commerce flow: categories → products → vehicle fit → cart → Stripe checkout → orders
Vehicle integration: number-plate lookup (DVLA/VDG) and make/model/year filters with product compatibility
Production-ready deploy: Vercel, serverless DB (Accelerate/direct Postgres), lazy Prisma client for build, env-based seed
Maintainable structure: shared seed module (CLI + API), typed API routes, clear app/dashboard/auth layout

Sparex- Car / Vehicle Spare Parts online store

Screenshots & Gallery

Video

Tech Stack

About this project

Features

Highlights

Technologies Used