E-shop na Next.js.
Od výberu po zásielku.

Nestačí ukázať produkt.
Treba dokončiť nákup.

Pri tomto e-shope som potreboval spojiť výber produktov a balení s košíkom, platbou, fakturáciou a odoslaním zásielky. Zákazník má prejsť nákupom na jednom webe; prevádzka potrebuje vedieť, čo sa s objednávkou stalo.

Zvolil som vlastnú aplikáciu v Next.js, aby som mohol prispôsobovať nákupné rozhranie aj nadväzujúce kroky v jednom riešení. Nie je to univerzálny argument proti WooCommerce. Pre bežný katalóg so štandardným procesom môže byť hotová platforma rozumnejšia a lacnejšia na údržbu.

Moja práca

Predajné rozhranie, objednávková logika, administrácia a integrácie

Typ realizácie

Vlastný Next.js e-shop, nie WooCommerce obchod

Jedna objednávka.
Viac nadväzujúcich krokov.

Nákup som navrhol ako cestu od katalógu k spracovateľnej objednávke. Dôležité je odlíšiť vytvorenie objednávky od potvrdenia, že je skutočne zaplatená.

Pri platbe kartou sa aplikácia nespolieha iba na návrat zákazníka z platobného rozhrania. Server spracúva podpísané udalosti zo Stripe a prepája ich s objednávkou. Stav platby držím oddelene od stavu vybavenia, pretože prijatá platba ešte neznamená odoslaný tovar.

Packeta je napojená na vytvorenie zásielky; pri dobierke sa prenáša aj suma na vybratie. PDF faktúry vytvára aplikácia cez React PDF. Tieto kroky nie sú zárukou bezchybnosti externých služieb: prevádzka musí vedieť skontrolovať a riešiť aj zlyhané spracovanie.

Za nákupným tlačidlom
je práca prevádzky.

Pripravil som vlastný prehľad objednávok a ich detail. Správca v ňom pracuje so stavom objednávky a platby, položkami a údajmi potrebnými na vybavenie. Súčasťou riešenia je opakovanie vybraných krokov, napríklad vytvorenia zásielky alebo odoslania potvrdenia.

Objednávky a ich väzby ukladám v PostgreSQL cez Prisma. E-maily zabezpečuje Brevo. Administráciu tu neukazujem: pre vysvetlenie riešenia nie je potrebné zverejňovať zákaznícke údaje ani interné obrazovky.

Predaj a články.
Nie jedna databáza na všetko.

Transakčné dáta patria do databázy, produktový a článkový obsah má vlastnú vrstvu. V aktuálnej implementácii sa katalóg aj blog načítavajú z lokálnych Markdown súborov a vykresľujú sa v Next.js.

Podstatný stack tejto realizácie je Next.js a React pre web aj aplikačné rozhranie, Prisma s PostgreSQL pre objednávky, Stripe pre platby, Packeta pre dopravu, React PDF pre faktúry a Brevo pre e-maily. Technológie uvádzam podľa ich úlohy, nie podľa počtu knižníc.

Vlastná cesta nákupom.
Aj vlastná zodpovednosť.

Výsledkom je e-shop s vlastným nákupným tokom a administráciou, ktorý prepája objednávky s platbou, fakturáciou a dopravou. Táto štúdia ukazuje realizované funkcie. Nepripisujem im nemeraný nárast predaja ani úsporu času.

Vývoj na mieru dáva voľnosť, ale znamená aj údržbu závislostí, testovanie pokladne, dohľad nad integráciami a zálohovanie databázy. Zmena platobnej alebo dopravnej služby nie je iba preklik v nastaveniach. Aj lokálny obsah vyžaduje iný spôsob úprav než bežná redakcia vo WordPresse.

Podobné zadania riešim v rámci vývoja v Reacte a Next.js. Ak pre váš obchod stačí štandardné riešenie, pozrite si aj tvorbu WooCommerce e-shopu. Výber platformy má vychádzať z nákupného procesu a možností údržby, nie z tejto jednej referencie.