🛒 Mini E-Commerce Web Application
A modern, responsive mini e-commerce platform built as part of a real-world internship / portfolio project. This project demonstrates frontend + state management + checkout flow, similar to applications used by startups and freelance clients.
🔗 Live Website: https://personal-portfolio-psi-three-52.vercel.app/
📦 GitHub Repository:https://github.com/FelixDevX/PersonalPortfolio
📌 Project Overview
This project simulates a real online shopping experience with:
Product browsing
Shopping cart functionality
Checkout simulation
Clean UI/UX
It is designed to showcase full-stack thinking, even with a frontend-focused architecture.
✨ Features 🛍️ Product Management
Product listing page with responsive grid
Search and category filtering
Product detail page
🛒 Shopping Cart
Add / remove products
Quantity increase & decrease
Dynamic price updates
Cart persistence using browser storage
💳 Checkout Simulation
Checkout form with validation
Order summary
Simulated payment success
Order confirmation screen
🔐 Optional (Future Enhancements)
User login & registration
Order history
Admin dashboard for product management
🛠️ Tech Stack Frontend
React.js (Vite)
TypeScript
Tailwind CSS
shadcn/ui
State Management
React Context API
APIs / Data
FakeStoreAPI / DummyJSON (mock product data)
Deployment
Lovable Platform (Vercel-ready)
📂 Project Structure src/ ├── components/ # Reusable UI components ├── pages/ # Home, Product, Cart, Checkout ├── context/ # Cart & Auth state ├── services/ # API calls ├── hooks/ # Custom hooks ├── styles/ # Global styles └── main.tsx
🚀 Running the Project Locally Prerequisites
Node.js (v18+ recommended)
npm
Steps
git clone <YOUR_GIT_URL>
cd <YOUR_PROJECT_NAME>
npm install
npm run dev
The app will be available at: