Το UniMarket είναι ένα marketplace πολλών πωλητών για το Μπανγκλαντές, σε bangla και αγγλικά. Φτιάξαμε το κατάστημα, το Seller Center, τον πίνακα διαχείρισης και την εγκαταστάσιμη εφαρμογή ως ένα έργο TypeScript και το τρέχουμε στον δικό μας διακομιστή. Αυτή είναι μια ξενάγηση στις αποφάσεις που μέτρησαν περισσότερο και στο γιατί τις πήραμε.
Η στοίβα και το γιατί
| Επίπεδο | Επιλογή | Γιατί |
|---|---|---|
| Εφαρμογή | Next.js 16, React 19 και TypeScript | Οι σελίδες που αποδίδονται στον διακομιστή κρατούν μικρή τη JavaScript του browser και μία γλώσσα καλύπτει το κατάστημα, το Seller Center, τη διαχείριση και το API. |
| Στυλ | Tailwind CSS 4 με design tokens | Μικρό CSS και φωτεινό και σκούρο θέμα από τα ίδια tokens. |
| Δεδομένα | MongoDB σε δική της εγκατάσταση | Τα ευέλικτα έγγραφα ταιριάζουν σε προϊόντα με διαφορετικές επιλογές και μια ξεχωριστή εγκατάσταση αφήνει ανέγγιχτες τις άλλες υπηρεσίες του διακομιστή. |
| Σύνδεση | Κωδικοί μίας χρήσης, Google και Apple, Firebase Auth για κωδικούς τηλεφώνου | Οι αγοραστές στο Μπανγκλαντές συνδέονται με αριθμό τηλεφώνου και ένας κωδικός δεν έχει κωδικό πρόσβασης να ξεχάσετε. |
| Hosting | Δικό μας VPS, nginx, Cloudflare και Let’s Encrypt | Προβλέψιμο κόστος και πλήρης έλεγχος σε αντίγραφα ασφαλείας, mail και όρια. |
Γρήγορες σελίδες, και στα bangla
Οι περισσότερες σελίδες που βλέπει ένας επισκέπτης είναι δημόσιες, οπότε φτιάχνονται για να μπαίνουν σε cache. Ό,τι είναι προσωπικό, όπως ο αριθμός του καλαθιού ή το όνομα του συνδεδεμένου χρήστη, συμπληρώνεται χωριστά και δεν καθυστερεί τη σελίδα. Οι εικόνες μετατρέπονται σε σύγχρονες μορφές με σταθερά μεγέθη κατά το ανέβασμα.
Οι γραμματοσειρές ήταν η έκπληξη. Μια γραμματοσειρά web για bangla είναι μεγάλη: αυτή που δοκιμάσαμε ήταν περίπου 200 KB. Στη δοκιμή μας κόστισε πάνω από δέκα βαθμούς στο mobile Lighthouse performance. Έτσι το κείμενο bangla χρησιμοποιεί τη γραμματοσειρά που υπάρχει ήδη στο κινητό ή τον υπολογιστή και μια μικρή δική μας γραμματοσειρά καλύπτει μόνο λατινικούς χαρακτήρες και αριθμούς. Οι αναγνώστες βλέπουν τη γραμματοσειρά που διαβάζουν κάθε μέρα και τίποτα επιπλέον δεν κατεβαίνει.
Στο τοπικό production build μας, τα Accessibility, Best Practices και SEO βαθμολογήθηκαν με 100 σε κάθε σελίδα που δοκιμάσαμε και το mobile Performance ήταν μεταξύ 93 και 98. Είναι δικές μας μετρήσεις σε τοπικό build και η προσθήκη scripts τρίτων αργότερα θα τις χαμηλώσει.
Δύο γλώσσες που είναι πραγματικά δύο γλώσσες
Τα bangla και τα αγγλικά έχουν η καθεμία τη δική της διεύθυνση, με συνδέσμους hreflang μεταξύ τους ώστε οι μηχανές αναζήτησης να δείχνουν τη σωστή. Κάθε κείμενο της διεπαφής ζει σε ένα τυποποιημένο λεξικό και το build αποτυγχάνει αν λείπει κάποιο κείμενο στα bangla, οπότε μια μισομεταφρασμένη σελίδα δεν μπορεί να βγει. Οι τιμές χρησιμοποιούν ψηφία bangla στα bangla και λατινικά ψηφία στα αγγλικά.
Ένα checkout, πολλοί πωλητές
Ένα καλάθι μπορεί να έχει προϊόντα από πολλά καταστήματα. Όταν ο αγοραστής υποβάλει την παραγγελία, το checkout ξαναυπολογίζει κάθε τιμή από τη βάση αντί να εμπιστεύεται τον browser, δεσμεύει το απόθεμα σε ένα ατομικό βήμα, σπάει την παραγγελία σε μία αποστολή ανά κατάστημα και χρεώνει ένα τέλος παράδοσης ανά κατάστημα. Η διπλή υποβολή δεν δημιουργεί δύο παραγγελίες και η ακύρωση επιστρέφει το απόθεμα.
Τα χρήματα αποθηκεύονται σε ακέραια poisha, όπου μία taka είναι 100 poisha, ώστε κανένα άθροισμα να μη στρογγυλοποιείται λόγω δεκαδικών.
Ασφαλές από προεπιλογή
- Οι πωλητές μπορούν να διαβάζουν μόνο τις δικές τους παραγγελίες και προϊόντα και το προσωπικό παίρνει μόνο τα δικαιώματα του ρόλου του. Το προσωπικό συνδέεται με κωδικό και κωδικό authenticator και οι αλλαγές του καταγράφονται σε audit log.
- Ο web server περιορίζει τα αιτήματα σύνδεσης και API και η εφαρμογή προσθέτει δικά της όρια ανά χρήστη.
- Τα ανεβάσματα κωδικοποιούνται ξανά, κάτι που αφαιρεί κρυφά δεδομένα τοποθεσίας από τις φωτογραφίες, και τα έγγραφα ταυτότητας αποθηκεύονται εκτός του δημόσιου φακέλου.
- Μετά από έλεγχο ασφαλείας διορθώσαμε πρώτα τα δύο ευρήματα εκμετάλλευσης λογαριασμών και έπειτα τα μέτρια.
Email που φτάνει
Το UniMarket στέλνει email σε κάθε βήμα της παραγγελίας, οπότε η παράδοση των email είναι μέρος του προϊόντος. Το mail φεύγει από τον δικό μας mail server με υπογραφή DKIM και το domain δημοσιεύει εγγραφές SPF και DMARC. Στις δοκιμές μας τα email παραγγελιών πέρασαν και τους τρεις ελέγχους και έφτασαν στα εισερχόμενα, όχι στα ανεπιθύμητα.
Deploy χωρίς να σπάνε οι ανοιχτές καρτέλες
Ένα deploy χτίζει στον διακομιστή, αλλάζει στη νέα έκδοση και ελέγχει ότι είναι υγιής. Μια δεύτερη εντολή επιστρέφει στην προηγούμενη έκδοση. Κάθε έκδοση έχει δικό της deployment id, οπότε όταν ένας αγοραστής αφήσει μια καρτέλα ανοιχτή πέρα από ένα deploy, η σελίδα καταλαβαίνει ότι τα κουμπιά της ανήκουν σε παλιά έκδοση και ξαναφορτώνει μόνη της αντί να δείξει σφάλμα.
Η βάση δεδομένων αντιγράφεται κάθε νύχτα και κρατιούνται τα τελευταία 14 αντίγραφα.
Το UniMarket βρίσκεται σε πρώιμη πρόσβαση με δοκιμαστικό κατάλογο. Το marketplace λειτουργεί και σχεδιάζεται το domain unimarket.bd.
Τα στοιχεία ελέγχθηκαν από την ομάδα της 22Softwares με τη ζωντανή εφαρμογή UniMarket και τον οδηγό του Seller Center.