TechVault — Electronics Store
6-page consumer electronics store with Shop, Product Detail, Cart, About, Contact. localStorage cart, filters.
Overview
A modern electronics store template with product cards, a functional shopping cart, and a responsive grid layout. Tech Vault demonstrates a sleek, Apple-inspired design aesthetic with hover effects on product cards, grid-based product listings, and a clean checkout experience.
Key Features
- Product Cards — Sleek product cards with image, name, price, and quick-add button with hover zoom effect.
- Shopping Cart — Functional cart with quantity adjustment, item removal, and total price calculation.
- Responsive Grid — Products displayed in a CSS Grid that adapts seamlessly from widescreen to mobile.
- Category Pages — Separate pages for different product categories with consistent layout.
Tech Stack
Built with HTML, CSS, and JavaScript. Product data structured as JSON. Cart functionality uses vanilla JS with DOM manipulation. CSS Grid with auto-fit for responsive product layout.
Problem it solves
This template demonstrates a modern tech store layout with product cards, shopping cart, and category navigation — a foundation for e-commerce builds.
How it was built
Built with HTML, CSS, and JavaScript. JSON product data, vanilla JS cart, CSS Grid auto-fit for responsive product display.