Project Overview
A modern, full-stack e-commerce platform built with Next.js and Supabase, tailored specifically for the Egyptian market. The platform delivers a fast, responsive, and user-friendly shopping experience for customers — with Arabic UI and prices in Egyptian Pounds (EGP) — while providing store owners with a secure admin dashboard to manage products, categories, and orders.
Problem & Solution
Problem:
Most e-commerce platforms in Egypt are either poorly localized, not mobile-first, expensive for the business owner, poorly designed, or lack modern features like fast product filtering and smooth checkout.
Solution:
Build a fully responsive, Arabic-first platform with:
- Customer storefront optimized for mobile and desktop
- Admin dashboard with secure role-based access control
- Efficient product/category management
Key Features
Storefront
Homepage
Featured products ("hot deals") & promotional banners
Product Listings
Browse all products with advanced filtering
Search & Filters
Fuzzy search by product name/description with multiple filter options
Shopping Cart
Add, remove, update quantities with guest cart persistence
Checkout Flow
Smooth transition from cart to checkout
Responsive Design
Optimized for mobile, tablet, and desktop
Admin Dashboard
Secure Authentication
Role-based access with Supabase Auth
Product Management
CRUD products, upload images, set flags (is_hot, is_new)
Category Management
Create/update/delete categories
Centralized Admin Panel
Sidebar navigation for products, categories, orders
Tech Stack
Architecture Highlights
- Server Components: Fast initial load & SEO (e.g., homepage fetching "hot deals")
- Client Components: Dynamic pages (products, cart) with real-time UI updates
- State Management: Server-side data fetching combined with client-side React hooks and localStorage for cart persistence
- Role-Based Access Control (RBAC): Admin layout verifies role metadata before rendering, redirecting unauthorized users
Challenges & Solutions
- Rich filtering without slow queries → Fetch products once client-side, then filter/search in-memory
- Guest cart persistence → Store cart in localStorage, sync on login/checkout
- Securing admin routes → Middleware-like admin layout checks Supabase Auth roles
Screenshots
Future Improvements
- Integrate full payment gateway
- Add customer accounts (order history, saved addresses)
- Implement server-side pagination for large datasets
- Add internationalization (multi-language, multi-currency)