Firebase پر کسٹم ای کامرس (Custom E-commerce on Firebase)

میں نے بالکل شروع سے ایک کسٹم ای کامرس سائٹ بنائی۔ میں نے پہلے سے موجود پلیٹ فارمز کا استعمال نہیں کیا۔ میں نے Firebase Realtime Database اور Netlify کا استعمال کیا۔

اس کا مقصد ایک POS ٹرمینل ری سیلر کی خدمت کرنا تھا۔ انہیں ایک کیٹلاگ، قیمتوں کے مختلف ورژن (pricing variants)، اور ایک ایڈمن پینل کی ضرورت تھی۔ سیلز ٹیم کو براہ راست سائٹ سے آرڈر دینے کی ضرورت تھی۔

یہاں بتایا گیا ہے کہ میں نے اسے کیسے بنایا اور میں نے کیا اسباق سیکھے۔

ٹیکنالوجی اسٹیک (The Stack)

• Vanilla HTML, CSS، اور JS۔ • ڈیٹا کے لیے Firebase Realtime Database۔ • فائلوں کے لیے Firebase Storage۔ • ہوسٹنگ اور فنکشنز کے لیے Netlify۔

اہم فیصلے (Key Decisions)

1. ڈیٹا بیس کی علیحدگی (Database Separation)

میں نے ای کامرس ڈیٹا بیس کو اندرونی مینجمنٹ ڈیٹا بیس سے الگ رکھا۔ یہ تجارتی ڈیٹا کو تنخواہوں یا بجٹ جیسے حساس ایڈمن ڈیٹا کے ساتھ ملنے سے روکتا ہے۔

2. عالمی قیمتوں کا آرکائیو (Global Pricing Archive)

ہر پروڈکٹ کے اندر قیمتوں کے پلان رکھنے کے بجائے، میں نے ایک عالمی ٹیرف فولڈر (global tariffs folder) بنایا۔ پروڈکٹس میں صرف آئی ڈیز (IDs) کا ایک ایرے (array) ہوتا ہے۔ اس سے ڈیٹا کے دوہراؤ (duplication) سے بچا جا سکتا ہے۔ اگر کوئی پلان تبدیل ہوتا ہے، تو میں اسے صرف ایک بار اپ ڈیٹ کرتا ہوں۔

3. ایٹامک آرڈرز (Atomic Orders)

جب ایک ہی وقت میں کئی لوگ آرڈر دیتے ہیں، تو آپ کو race conditions کا سامنا کرنا پڑتا ہے۔ اگر دو لوگ ایک ہی آرڈر نمبر پڑھ لیں، تو ایک آرڈر غائب ہو سکتا ہے۔ میں نے ہر آرڈر کو ایک منفرد اور ترتیب وار نمبر ملنے کو یقینی بنانے کے لیے Firebase runTransaction() کا استعمال کیا۔

4. محفوظ ایڈمن رسائی (Secure Admin Access)

میں نے سورس کوڈ میں پاس ورڈز محفوظ نہیں کیے۔ میں نے Web Crypto API کے ذریعے PBKDF2 کا استعمال کیا۔ یہ brute-force حملوں کو بہت مشکل بنا دیتا ہے۔ کوڈ میں صرف ایک salt اور ایک hash ہوتا ہے۔

سیکھے گئے اسباق (Lessons Learned)

• Falsy values کا خیال رکھیں۔ JavaScript میں، 0 ایک falsy ویلیو ہے۔ اگر کسی پروڈکٹ کی قیمت 0 ہے، تو "price || null" جیسا سادہ چیک قیمت کو حذف کر دے گا۔ زیرو کو شامل کرنے کے لیے ہمیشہ "price != null" استعمال کریں۔

• HTTP ہیڈرز میں CSP کنفیگر کریں۔ Content Security Policy کے لیے میٹا ٹیگز سب ڈومینز کے لیے wildcards کو سپورٹ نہیں کرتے۔ Firebase ڈائنامک سب ڈومینز استعمال کرتا ہے۔ میں نے اسے کام کرنے کے قابل بنانے کے لیے CSP کو netlify.toml میں منتقل کر دیا۔

• حقیقی تحفظ کے لیے Security Rules کا استعمال کریں۔ کبھی بھی اپنے UI میں بٹن چھپانے پر بھروسہ نہ کریں۔ ڈیٹا کو کون پڑھ اور لکھ سکتا ہے، اس پر پابندی لگانے کے لیے Firebase rules کا استعمال کریں۔

کسٹم سلوشنز بنانے کے لیے احتیاط سے معماری کے انتخاب (architectural choices) کی ضرورت ہوتی ہے۔ ٹرانزیکشن ہینڈلنگ اور ہیڈر کنفیگریشن جیسی چھوٹی تفصیلات پروڈکشن میں بڑی ناکامیوں کو روکتی ہیں۔

Source: https://dev.to/androve2k/custom-e-commerce-on-firebase-catalog-atomic-orders-and-admin-panel-42ec