Firebase ನಲ್ಲಿ ಕಸ್ಟಮ್ ಇ-ಕಾಮರ್ಸ್ (Custom E-commerce on Firebase)

ನಾನು ಮೊದಲಿನಿಂದಲೇ (from scratch) ಒಂದು ಕಸ್ಟಮ್ ಇ-ಕಾಮರ್ಸ್ ಸೈಟ್ ಅನ್ನು ನಿರ್ಮಿಸಿದ್ದೇನೆ. ನಾನು ಸಿದ್ಧವಾಗಿರುವ (off-the-shelf) ಪ್ಲಾಟ್‌ಫಾರ್ಮ್‌ಗಳನ್ನು ಬಳಸಲಿಲ್ಲ. ನಾನು Firebase Realtime Database ಮತ್ತು Netlify ಅನ್ನು ಬಳಸಿದೆ.

ಇದರ ಗುರಿ ಒಂದು POS ಟರ್ಮಿನಲ್ ಮರುಮಾರಿಗೆ (reseller) ಸೇವೆ ನೀಡುವುದಾಗಿತ್ತು. ಅವರಿಗೆ ಒಂದು ಕ್ಯಾಟಲಾಗ್, ಬೆಲೆಗಳ ವೈವಿಧ್ಯತೆಗಳು (pricing variants) ಮತ್ತು ಅಡ್ಮಿನ್ ಪ್ಯಾನಲ್ ಅಗತ್ಯವಿತ್ತು. ಸೇಲ್ಸ್ ತಂಡವು ನೇರವಾಗಿ ಸೈಟ್‌ನಿಂದಲೇ ಆರ್ಡರ್‌ಗಳನ್ನು ಮಾಡುವ ಅಗತ್ಯವಿತ್ತು.

ನಾನು ಇದನ್ನು ಹೇಗೆ ನಿರ್ಮಿಸಿದೆ ಮತ್ತು ನಾನು ಕಲಿತ ಪಾಠಗಳು ಇಲ್ಲಿವೆ.

The Stack

• Vanilla HTML, CSS, ಮತ್ತು JS. • ಡೇಟಾಕ್ಕಾಗಿ Firebase Realtime Database. • ಫೈಲ್‌ಗಳಿಗಾಗಿ Firebase Storage. • ಹೋಸ್ಟಿಂಗ್ ಮತ್ತು ಫಂಕ್ಷನ್‌ಗಳಿಗಾಗಿ Netlify.

Key Decisions

1. Database Separation

ನಾನು ಇ-ಕಾಮರ್ಸ್ ಡೇಟಾಬೇಸ್ ಅನ್ನು ಆಂತರಿಕ ನಿರ್ವಹಣಾ (internal management) ಡೇಟಾಬೇಸ್‌ನಿಂದ ಪ್ರತ್ಯೇಕವಾಗಿಟ್ಟೆ. ಇದು ವಾಣಿಜ್ಯ ಡೇಟಾವು ಸಂಬಳ ಅಥವಾ ಬಜೆಟ್‌ನಂತಹ ಸೂಕ್ಷ್ಮ ಅಡ್ಮಿನ್ ಡೇಟಾದೊಂದಿಗೆ ಬೆರೆಯದಂತೆ ತಡೆಯುತ್ತದೆ.

2. Global Pricing Archive

ಪ್ರತಿ ಉತ್ಪನ್ನದ ಒಳಗೆ ಬೆಲೆ ಯೋಜನೆಗಳನ್ನು (pricing plans) ಹಾಕುವ ಬದಲು, ನಾನು ಒಂದು ಗ್ಲೋಬಲ್ ಟ್ಯಾರಿಫ್ ಫೋಲ್ಡರ್ ಅನ್ನು ರಚಿಸಿದೆ. ಉತ್ಪನ್ನಗಳು ಕೇವಲ ID ಗಳ ಅರೇ (array) ಅನ್ನು ಮಾತ್ರ ಹೊಂದಿರುತ್ತವೆ. ಇದು ಡೇಟಾ ಡೂಪ್ಲಿಕೇಶನ್ ಅನ್ನು ತಪ್ಪಿಸುತ್ತದೆ. ಒಂದು ಯೋಜನೆಯು ಬದಲಾದರೆ, ನಾನು ಅದನ್ನು ಒಮ್ಮೆ ಅಪ್‌ಡೇಟ್ ಮಾಡಿದರೆ ಸಾಕು.

3. Atomic Orders

ಏಕಕಾಲದಲ್ಲಿ ಅನೇಕ ಜನರು ಆರ್ಡರ್ ಮಾಡಿದಾಗ, ನೀವು 'race conditions' ಎದುರಿಸಬಹುದು. ಇಬ್ಬರು ವ್ಯಕ್ತಿಗಳು ಒಂದೇ ಆರ್ಡರ್ ಸಂಖ್ಯೆಯನ್ನು ಓದಿದರೆ, ಒಂದು ಆರ್ಡರ್ ಕಣ್ಮರೆಯಾಗಬಹುದು. ಪ್ರತಿಯೊಂದು ಆರ್ಡರ್ ವಿಶಿಷ್ಟವಾದ ಮತ್ತು ಕ್ರಮಾನುಗತವಾದ ಸಂಖ್ಯೆಯನ್ನು ಪಡೆಯುವುದನ್ನು ಖಚಿತಪಡಿಸಿಕೊಳ್ಳಲು ನಾನು Firebase runTransaction() ಅನ್ನು ಬಳಸಿದೆ.

4. Secure Admin Access

ನಾನು ಸೋರ್ಸ್ ಕೋಡ್‌ನಲ್ಲಿ ಪಾಸ್‌ವರ್ಡ್‌ಗಳನ್ನು ಸಂಗ್ರಹಿಸಲಿಲ್ಲ. ನಾನು Web Crypto API ಮೂಲಕ PBKDF2 ಅನ್ನು ಬಳಸಿದೆ. ಇದು ಬ್ರೂಟ್-ಫೋರ್ಸ್ (brute-force) ದಾಳಿಗಳನ್ನು ಅತ್ಯಂತ ಕಷ್ಟಕರವಾಗಿಸುತ್ತದೆ. ಕೋಡ್‌ನಲ್ಲಿ ಕೇವಲ ಸಾಲ್ಟ್ (salt) ಮತ್ತು ಹ್ಯಾಶ್ (hash) ಮಾತ್ರ ಇರುತ್ತದೆ.

Lessons Learned

• ಫಾಲ್ಸಿ (falsy) ಮೌಲ್ಯಗಳ ಬಗ್ಗೆ ಎಚ್ಚರವಿರಲಿ. JavaScript ನಲ್ಲಿ, 0 ಎಂಬುದು falsy. ಒಂದು ಉತ್ಪನ್ನದ ಬೆಲೆ 0 ಆಗಿದ್ದರೆ, price || null ನಂತಹ ಸರಳ ಪರಿಶೀಲನೆಯು ಬೆಲೆಯನ್ನು ಅಳಿಸಿಹಾಕುತ್ತದೆ. ಸೊನ್ನೆಯನ್ನು ಒಳಗೊಳ್ಳಲು ಯಾವಾಗಲೂ price != null ಬಳಸಿ.

• HTTP ಹೆಡರ್‌ಗಳಲ್ಲಿ CSP ಅನ್ನು ಕಾನ್ಫಿಗರ್ ಮಾಡಿ. Content Security Policy ಗಾಗಿ ಬಳಸುವ ಮೆಟಾ ಟ್ಯಾಗ್‌ಗಳು ಸಬ್‌ಡೊಮೇನ್‌ಗಳಿಗೆ ವೈಲ್ಡ್‌ಕಾರ್ಡ್‌ಗಳನ್ನು (wildcards) ಬೆಂಬಲಿಸುವುದಿಲ್ಲ. Firebase ಡೈನಾಮಿಕ್ ಸಬ್‌ಡೊಮೇನ್‌ಗಳನ್ನು ಬಳಸುತ್ತದೆ. ಇದನ್ನು ಕೆಲಸ ಮಾಡುವಂತೆ ಮಾಡಲು ನಾನು CSP ಅನ್ನು netlify.toml ಗೆ ವರ್ಗಾಯಿಸಿದೆ.

• ನೈಜ ರಕ್ಷಣೆಗಾಗಿ Security Rules ಬಳಸಿ. ನಿಮ್ಮ UI ನಲ್ಲಿ ಬಟನ್‌ಗಳನ್ನು ಅಡಗಿಸಿಡುವುದರ ಮೇಲೆ ಎಂದಿಗೂ ಅವಲಂಬಿತರಾಗಬೇಡಿ. ಯಾರು ಡೇಟಾವನ್ನು ಓದಬಹುದು ಮತ್ತು ಬರೆಯಬಹುದು ಎಂಬುದನ್ನು ನಿರ್ಬಂಧಿಸಲು Firebase ನಿಯಮಗಳನ್ನು ಬಳಸಿ.

ಕಸ್ಟಮ್ ಪರಿಹಾರಗಳನ್ನು ನಿರ್ಮಿಸಲು ಎಚ್ಚರಿಕೆಯ ವಾಸ್ತುಶಿಲ್ಪದ (architectural) ಆಯ್ಕೆಗಳು ಅಗತ್ಯವಾಗಿವೆ. ಟ್ರಾನ್ಸಾಕ್ಷನ್ ನಿರ್ವಹಣೆ ಮತ್ತು ಹೆಡರ್ ಕಾನ್ಫಿಗರೇಶನ್‌ನಂತಹ ಸಣ್ಣ ವಿವರಗಳು ಪ್ರೊಡಕ್ಷನ್‌ನಲ್ಲಿ ದೊಡ್ಡ ವೈಫಲ್ಯಗಳನ್ನು ತಡೆಯುತ್ತವೆ.

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