UniMarket

Како смо направили UniMarket: брза двојезична пијаца на једном серверу

Одлуке иза UniMarket-а, од бенгалских фонтова и архитектуре једног кода до поруџбина из више продавница, новца чуваног у целим пајшама, испоручивости имејлова и постављања једном командом.

UniMarket је пијаца са више продаваца за Бангладеш, на бенгалском и енглеском. Продавницу, Seller Center, администраторску таблу и апликацију која се може инсталирати направили смо као један TypeScript пројекат и покрећемо га на сопственом серверу. Ово је обилазак одлука које су најважније и разлога зашто смо их донели.

Страна категорије UniMarket-а у тамној теми са редом производа, сваки са ценом, ознаком попуста и дугметом Додај.
Страна категорије на рачунару.

Технологија и зашто

СлојИзборЗашто
АпликацијаNext.js 16, React 19 и TypeScriptСтранице рендеране на серверу држе JavaScript у прегледачу малим, а један језик покрива продавницу, Seller Center, администрацију и API.
СтиловиTailwind CSS 4 са дизајн токенимаМали CSS, а светла и тамна тема из истих токена.
ПодациMongoDB са сопственом инстанцомФлексибилни документи пристају производима са различитим опцијама, а посебна инстанца оставља остале услуге на серверу нетакнутим.
ПријаваЈеднократни кодови, Google и Apple, Firebase Auth за кодове на телефонуКупци у Бангладешу пријављују се бројем телефона, а код не тражи лозинку коју је могуће заборавити.
ХостингСопствени VPS, nginx, Cloudflare и Let’s EncryptПредвидива цена и потпуна контрола над резервним копијама, поштом и ограничењима.

Брзе странице, и на бенгалском

Већина страница које посетилац види је јавна, па су направљене да се кеширају. Све лично, као што је број у корпи или име пријављеног корисника, попуњава се засебно и не успорава страницу. Слике се при отпремању претварају у савремене формате у утврђеним величинама.

Фонтови су били изненађење. Бенгалски веб фонт је велик: онај који смо пробали имао је око 200 KB. У нашем тесту коштао је више од десет поена у мобилном Lighthouse резултату перформанси. Зато бенгалски текст користи фонт који већ постоји на телефону или рачунару, а мали фонт који хостујемо сами покрива само латинична слова и бројеве. Читаоци виде фонт који читају сваки дан и ништа додатно се не преузима.

У нашем локалном продукцијском билду, Приступачност, Најбоље праксе и SEO имали су 100 на свакој страници коју смо тестирали, а мобилне Перформансе између 93 и 98. То су наша сопствена мерења на локалном билду, а додавање скрипти трећих страна касније би их снизило.

Два језика који су заиста два језика

Бенгалски и енглески имају сваки своју адресу, са hreflang линковима међу њима да претраживачи прикажу прави. Сваки стринг интерфејса налази се у типизираном речнику, а билд пада ако бенгалски стринг недостаје, па се делимично преведена страница не може објавити. Цене користе бенгалске цифре на бенгалском, а латиничне цифре на енглеском.

Једна наплата, више продаваца

Корпа може садржати артикле из више продавница. Када купац пошаље поруџбину, наплата сваку цену поново израчунава из базе података уместо да верује прегледачу, резервише залиху у једном атомском кораку, дели поруџбину на по једну пошиљку по продавници и наплаћује једну накнаду за испоруку по продавници. Двоструко слање не прави две поруџбине, а отказивање враћа залиху.

Новац се чува као целе пајше, где је једна така 100 пајша, па се ниједан збир никад не заокружује децималом.

Безбедно по основи

  • Продавци могу читати само своје поруџбине и производе, а особље добија само дозволе своје улоге. Особље се пријављује лозинком и кодом апликације за аутентификацију, а њихове измене иду у дневник ревизије.
  • Веб сервер ограничава пријаве и API захтеве, а апликација додаје сопствена ограничења по кориснику.
  • Отпремања се поново кодирају, чиме се из фотографија уклањају скривени подаци о локацији, а лична документа се чувају изван јавне фасцикле.
  • Након безбедносног прегледа прво смо исправили два налаза о преузимању налога, а затим налазе средње тежине.

Имејл који стиже

UniMarket шаље имејл на сваком кораку поруџбине, па је испоручивост део производа. Пошта излази преко нашег сопственог поштанског сервера са DKIM потписом, а домен објављује SPF и DMARC записе. У нашим тестовима имејлови поруџбина прошли су све три провере и стигли у пријемно сандуче, а не у нежељену пошту.

Постављање без кварења отворених картица

Постављање гради на серверу, прелази на ново издање и проверава да је здраво. Друга команда враћа на претходно издање. Свако издање има свој ID постављања, па када купац остави картицу отворену преко постављања, страница примећује да њена дугмад припада старом издању и сама се поново учитава, уместо да прикаже грешку.

База података прави резервну копију сваке ноћи, а чува се последњих 14 копија.

UniMarket је у раном приступу са демонстрационим каталогом. Пијаца ради уживо, а домен unimarket.bd је у плану.

Чињенице је проверио тим 22Softwares у односу на живу апликацију UniMarket и њен водич за Seller Center.

Питања