Dripp. — Full Stack E-commerce (Pakistan)

Stack: React + Tailwind (frontend) | Node/Express (backend) | MySQL via XAMPP | JWT auth | Nodemailer | JazzCash/EasyPaisa/Stripe

1. Database (XAMPP)

1. Start Apache + MySQL in XAMPP Control Panel.
2. Open phpMyAdmin → Import → select backend/database.sql (creates dripp_db + tables + sample categories).
3. To make a user an admin: UPDATE users SET role='admin' WHERE email='youremail@example.com'; (register normally first, verify email, then run this).

2. Backend

cd backend
npm install
cp .env.example .env   # fill in DB password (XAMPP default is blank), JWT_SECRET, SMTP email, payment keys
npm run dev

Runs on http://localhost:5000

Email setup: use a Gmail App Password (Google Account → Security → App Passwords) for SMTP_USER/SMTP_PASS — required for register/verify/forgot-password/order emails to work.

Payment gateways: JazzCash & EasyPaisa require merchant sandbox credentials from their developer portals (apply as a business). Stripe needs a secret key for card payments. Leave blank to test with "Cash on Delivery" only.

3. Frontend

cd frontend
npm install
npm run dev

Runs on http://localhost:3000 (Vite proxies /api and /uploads to backend:5000)

Features included

• Register/Login with email verification required before login
• Forgot/Reset password via emailed token link
• Product catalog, search, product detail
• Cart, Checkout with live geolocation map (Leaflet + OpenStreetMap, draggable pin)
• Payment options: Card, EasyPaisa, JazzCash, COD
• Order placed → email sent to admin with full order details + confirmation email to customer
• Order History & Track Order (status timeline)
• Admin Panel: add/edit/delete products (name, price, description, image — anything), view all orders, change order status, Print All Orders (opens print-ready sheet)

Notes / Next steps for production

• Payment gateway code (JazzCash/EasyPaisa) generates the required signed request; you still need real merchant credentials and to complete their redirect/callback flow per their docs.
• Add HTTPS + rate limiting + input validation hardening before going live.