Case study - Rewolucja Patyny: od WooCommerce do Headless eCommerce w Medusa.js

Istniejąca konfiguracja WooCommerce nie pozwalała na aktualizacje poprzez zmiany w starym kodzie. Wszelkie niezbędne modyfikacje lub ulepszenia wymagały wielu przeróbek, co sprawiało, że platforma stawała się coraz bardziej uciążliwa w utrzymaniu.

Z czasem, gdy stosowano tymczasowe rozwiązania i łatki, by zaradzić bieżącym problemom, platforma zgromadziła znaczną ilość długu technologicznego. Stary kod bez dokumentacji skutecznie blokował dalszy rozwój.

Długi czas ładowania strony był poważnym problemem, wpływającym nie tylko na główną stronę, ale także na panel admina i sprzedawcy. Takie opóźnienia powodowały frustrację użytkowników.

WooCommerce nie zostało zbudowane, aby obsługiwać dużą liczbę produktów. Patyna z ponad 30 tysiącami produktów i rosnącą bazą sprzedawców, miała trudności z zapewnieniem wydajności i umożliwienia dalszego skalowania.

Z istotną ilością organicznego ruchu, kluczowe było zapewnienie, że migracja nie wpłynie negatywnie na pozycje platformy w wynikach wyszukiwania. Wymagało to starannego planowania i realizacji, aby zachować wartość SEO.

Jednym z najbardziej złożonych zadań była migracja ponad 30,000 produktów i 2,000 sprzedawców z WooCommerce do Medusa. To nie tylko przenoszenie danych; chodziło o zapewnienie integralności danych, spójności i dokładności w nowym systemie.

Podstawowe funkcjonalności większości platform eCommerce nie wystarczyłyby na unikalne wymagania Patyny. Indywidualne funkcjonalności, takie jak kompleksowy system raportowania, były niezbędne dla administratorów.

Poprzednia konfiguracja WooCommerce miała poważne problemy z wydajnością, wpływając zarówno na doświadczenia użytkowników, jak i efektywność paneli administracyjnych i sprzedawców. Rozwiązanie tych wąskich gardeł wydajnościowych było kluczowe, aby zapewnić płynne operacje i pozytywne doświadczenia użytkowników.

Przy szybko rozwijającej się bazie produktów i liście sprzedawców jednym z głównych wyzwań było zapewnienie, że nowa platforma może obsłużyć ten wzrost bez kompromisów w zakresie wydajności.

Zarządzanie ponad 2,000 sprzedawcami to nie lada wyczyn. Platforma wymagała systemu, który mógłby obsługiwać złożoności tak ogromnej bazy dostawców, od wprowadzania do listowania produktów i zarządzania zamówieniami.

Tradycyjne platformy eCommerce mają frontend (to, co widzi użytkownik) ściśle powiązany z backendem (gdzie przechowywane i zarządzane są dane). Ta sztywna struktura może ograniczać elastyczność. Headless eCommerce rozdziela te dwa komponenty, umożliwiając większą możliwość dostosowania.

Medusa.js i Next.js są na czele rewolucji headless. Medusa.js oferuje elastyczną strukturę backendową eCommerce, zapewniając proste dostosowanie platformy do modelu biznesowego. Z drugiej strony, Next.js dostarcza solidne ramy dla frontendu, zapewniając responsywny i przyjazny dla użytkownika interfejs.

Przed zgłębieniem technicznych aspektów przeprowadzono kompleksową ocenę, aby zrozumieć specyficzne potrzeby Patyny. Obejmowało to zrozumienie istniejącej konfiguracji WooCommerce, identyfikację punktów problematycznych i opracowanie planu migracji.

Przeniesienie ponad 30,000 produktów i szczegółów dotyczących ponad 2,000 dostawców to spore wyzwanie. Napisaliśmy dedykowany skrypt, aby zapewnić płynne przejście z WooCommerce do Medusa.js, gwarantując integralność danych i ich spójność.

Interfejs użytkownika jest pierwszym punktem interakcji na każdej platformie online. Używając Next.js, stworzyliśmy świeży, intuicyjny i responsywny design.

Medusa.js została dostosowana do modelu biznesowego marketplace Patyny. Od zarządzania obszernymi listami produktów po obsługę skomplikowanych szczegółów dotyczących dostawców, Medusa.js zapewniła solidne i skalowalne rozwiązanie.

Strapi zostało wybrane jako headless system zarządzania treścią (CMS), oferując elastyczność w zarządzaniu treściami i bezproblemową integrację z platformą.

Aby zagwarantować optymalną wydajność i skalowalność, platforma została wdrożona na sprawdzonych infrastrukturach chmurowych: Vercel i DigitalOcean.

Aby ulepszyć doświadczenia zakupowe, opracowaliśmy integrację z dostawcą płatności PayU. To rozwiązanie zapewniło płynny i bezpieczny proces płatności.

Rozumiejąc unikalne wyzwania i wymagania Patyny, dodaliśmy kilka niestandardowych funkcjonalności:

• Zaawansowane filtrowanie: Z ogromną bazą produktów, pomoc użytkownikom w znajdowaniu tego, czego potrzebują, była kluczowa. Wprowadziliśmy zaawansowane opcje filtrowania, pozwalające użytkownikom zawężać wybór na podstawie różnych kryteriów.

• System raportowania: Aby pomóc adminowi zrozumieć sprzedaż, wprowadzono niestandardowy system generowanie raportów z sprzedaży.

• Jedno zamówienie, wiele sprzedawców: Opracowaliśmy unikalny system podziału zamówień. Oznacza to, że gdy klient zamawia produkty od wielu sprzedawców, zamówienie jest dzielone, zapewniając, że każdy sprzedawca zarządza tylko swoją częścią zamówienia.

• Ulepszenia panelu sprzedawcy: Zbudowaliśmy intuicyjny panel sprzedawcy, umożliwiając sprzedawcom łatwe dodawanie produktów, zarządzanie informacjami o sklepie i efektywne obsługiwanie zamówień.

Migracja skróciła czas wprowadzania nowych funkcji na rynek o 30%, co pozwala na szybsze dostosowywanie się do wymagań klientów oraz trendów rynkowych.

Po przejściu na platformę headless, czas poświęcony na konserwację i debugowanie zmniejszył się o 50%. Dzięki temu zespół Patyny może teraz poświęcić więcej czasu na rozwój i ulepszanie platformy, zamiast skupiać się na rozwiązywaniu problemów technicznych.

Co więcej, odnotowano również 34% wzrost ruchu już po 2 miesiącach od migracji. Udało się osiągnąć ten wynik dzięki optymalizacji SEO w Next.js.

Przeglądanie ogromnego katalogu z ponad 30,000 produktów może być przytłaczające. Jednak odnowiona platforma zapewniła użytkownikom mechanizm wyszukiwania w połączeniu z intuicyjnymi filtrami, upraszczając odkrywanie produktów.

Podróż użytkownika, od wyboru produktu po finalny zakup, stała się bardziej intuicyjna. Integracja bramki płatniczej PayU zapewniła, że transakcje były płynne i bezpieczne, co zwiększyło zaufanie użytkowników.

Opinie po migracji były świadectwem sukcesu projektu. Komentarze typu "Dodam znacznie więcej produktów na nową platformę, bo teraz to przyjemność" oraz "Po długim czasie nie używania waszej platformy zacznę z niej korzystać ponownie" podkreśliły efekt migracji.