KICKVAULT is a modern e-commerce web application dedicated to buying, exploring, and discovering authentic sneakers and rare grails. Built with React 19, TypeScript, Tailwind CSS, and Motion, it delivers a seamless sneakerhead shopping experience.
- 🏷️ Dynamic Landing Page: Limited drops showcase, live countdowns, brand spotlights, and curated grail carousels.
- 🔍 Advanced Catalog & Filters: Real-time search, multi-brand filtering (Nike, Jordan, Adidas, New Balance, Asics, Salomon), price sliders, and sorting presets.
- 👟 Interactive Product Details:
- Multi-angle high-resolution gallery & thumbnail viewer
- Live colorway switcher
- Universal sizing selector (US Men, US Women, EU, UK)
- Technical specs (upper materials, cushioning technology, outsoles)
- Verified buyer review submission system
- 🛒 Smart Shopping Cart:
- Live subtotal, tax, and shipping calculation
- Free shipping progress bar tracker
- Promo code discounts engine (
VAULT20,KICKS10,FREESHIP)
- 💳 Secure Multi-Step Checkout:
- Comprehensive customer contact & shipping address validation
- Multiple payment methods: Credit/Debit Card (with auto brand detection), Apple/Google Pay, and 4x interest-free installments
- Order success receipt with unique order numbers, tracking codes, and printable invoices
- 📏 Sneaker Size Calculator: Interactive international size guide and millimeter measurement converter.
- 🤍 Grails Wishlist: Slide-over quick drawer for saving favorite silhouettes.
- Frontend: React 19, TypeScript
- Styling: Tailwind CSS v4
- Animations: Motion (
motion/react) - Icons: Lucide React
- Bundler & Dev Server: Vite
- Node.js (v18 or newer recommended)
- npm, yarn, or pnpm
-
Clone the repository:
git clone https://github.com/YOUR_GITHUB_USERNAME/kickvault-sneakers.git cd kickvault-sneakers -
Install dependencies:
npm install
-
Start development server:
npm run dev
-
Build for production:
npm run build
This project is open-source and available under the MIT License.