Al Farooq Communications
A production-grade, fully serverless boutique platform — powering both the customer storefront and internal management dashboard for Srinagar's flagship mobile boutique, established 2010.
11
Storefront Pages
12
Admin Pages
8
Firestore Collections
<1s
Page Load (cached)
01 // Project Overview
Al Farooq Communications is a flagship mobile boutique on Main Road, Nowhatta, Srinagar — operating since 2010 and specialising in flagship smartphones, certified open-box luxury devices, bespoke screen and motherboard repair services, and a curated premium accessories range.
The platform was built to digitalise the boutique experience — bringing the in-store luxury feel to a browser and giving the owner a real-time management dashboard under a single, unified codebase.
Problem Statement
Traditional boutique stores in J&K operate entirely on manual inventory tracking, paper-based billing, and offline word-of-mouth marketing — with no digital presence to capture the growing mobile-first customer base. Maintaining separate codebases for a storefront and a management tool is expensive and error-prone.
The Solution
A single, serverless React + TypeScript SPA with two distinct surfaces sharing all infrastructure — a luxury dark-gold storefront for customers and a protected admin dashboard for the owner. Real-time Firestore sync means an admin product update appears on the live storefront within milliseconds, with zero server maintenance.
02 // Two Applications, One Codebase
Surface A
Public Storefront
/Homepage
Hero, featured arrivals, stats bar, testimonials
/productsProducts
Full filterable & searchable catalogue
/open-boxOpen-Box Lounge
Certified pre-owned with 50-point badge
/repairsRepairs
Master repair service catalogue
/galleryGallery
Admin-managed boutique photo gallery
/contactContact
Embedded map, WhatsApp, inquiry form
Surface B
Admin Dashboard
/adminDashboard
Real-time KPIs: inventory, sales, arrivals
/admin/inventoryInventory
CRUD products with Cloudinary image upload
/admin/salesSales Tracker
Record and view historical sales data
/admin/galleryGallery Manager
Upload, reorder and delete boutique photos
/admin/settingsLive Settings
Name, phone, email — propagates instantly
/admin/customersCustomers
Customer contact and inquiry management
Real-Time Data Flow
Admin saves a product
Firestore updated
onSnapshot fires
All browsers update live
03 // Security Architecture
Firestore Server Rules
All collection access controlled at the server level — independent of any client code. Admin credentials verified via JWT Custom Claims.
Two-Factor Auth Guard
Every /admin/* route validates (1) active Firebase session AND (2) admin: true custom claim. Either failing redirects silently.
HTTP Security Headers
HSTS, X-Frame-Options DENY, CSP allowlist, and Permissions-Policy shipped via Vercel on every production request.
04 // Performance Engineering
Built fast by design. Not by accident.
Route-Based Code Splitting
~80% smaller bundle
Firestore onSnapshot
Zero-polling real-time
Debounced Search
400ms debounce
Cloudinary CDN
Global image delivery
Immutable Asset Cache
1-year cache TTL
Memoized Filtering
useMemo on every filter
Engineered With
05 // Real World Impact
Zero Servers. Infinite Scale.
Up next — AI-Powered Medicinal Plant Identification