Audio Design Desk

Użyte narzędzia i technologie

• WordPress (Headless CMS): Wykorzystany do zaawansowanej administracji treścią przy jednoczesnym całkowitym pominięciu tradycyjnego renderowania frontendu.
• PHP 8 & RESTful API: Zaprojektowano niestandardowe protokoły routingu w celu dostarczania ustrukturyzowanych danych bezpośrednio do mobilnych interfejsów klienckich.
• Baza danych MySQL: Zoptymalizowane zapytania do natychmiastowego indeksowania i pobierania dużych wolumenów ofert marek oraz ruchu użytkowników.
• React: Odpowiedzialny za dynamiczną, opartą na komponentach architekturę aplikacji frontendowej, zapewniającą płynne wrażenia użytkownika.
• Algolia: Zintegrowana w celu zapewnienia błyskawicznego, tolerancyjnego na literówki wyszukiwania, pozwalającego użytkownikom znaleźć konkretne oferty w milisekundy.
• jQuery: Używane do precyzyjnych operacji na dziedziczonym kodzie DOM oraz obsługi specyficznych integracji skryptów zewnętrznych.
• Vercel: Odpowiadał za bezproblemowe wdrożenie frontendu, wykorzystując buforowanie krawędziowe (edge caching) oraz funkcje serverless dla maksymalnej wydajności.
• Cloudflare: Zapewnił solidne zarządzanie DNS, globalną sieć CDN oraz ścisłą ochronę za pomocą zapory sieciowej aplikacji (WAF).

Proces inżynieryjny

Opis projektu i wyzwanie

„The Add App” działa jako kompleksowy cyfrowy katalog firm, zaprojektowany w celu pomagania konsumentom w natychmiastowym odkrywaniu lokalnych ofert, rabatów i akcji promocyjnych dużych marek oraz sprzedawców detalicznych. Aby wesprzeć ten dynamiczny ekosystem, platforma wymagała wysoce skalowalnej architektury klasy enterprise. Zespół administracyjny potrzebował znajomego i intuicyjnego interfejsu tradycyjnego backendu WordPress, aby łatwo zarządzać szybko zmieniającymi się treściami cyfrowymi i partnerstwami z markami. Jednak standardowe renderowanie motywów WordPress było zbyt ciężkie i restrykcyjne, by obsłużyć wysokowydajną, natywną aplikację mobilną. Głównym wyzwaniem inżynieryjnym było całkowite odcięcie warstwy prezentacji frontendowej od backendowej bazy danych, zapewniając błyskawiczne dostarczanie danych bez poświęcania możliwości zarządzania treścią przez klienta.

Wdrożenie backendu i strategia API

Naszym głównym zadaniem było zaprojektowanie i zbudowanie fundamentalnej warstwy danych oraz infrastruktury serwerowej od zera. Zamiast polegać na gotowych, przeładowanych ścieżkach REST, usunęliśmy konwencjonalny ekosystem frontendowy WordPressa, aby drastycznie zmniejszyć obciążenie procesora serwera. Skonfigurowaliśmy platformę do pracy wyłącznie jako Headless CMS (Content Management System), tworząc w pełni odseparowaną architekturę.

Zmapowaliśmy złożone relacyjne struktury danych dostosowane do katalogu biznesowego—tworząc niestandardowe typy wpisów (custom post types) dla sprzedawców, hierarchiczne taksonomie dla kategorii ofert oraz specjalne pola metadanych dla promocji ograniczonych czasowo. Stamtąd stworzyliśmy czyste, bezpieczne i silnie typowane niestandardowe endpointy API. To celowe podejście zagwarantowało, że programiści aplikacji frontendowej mogli odpytywać dokładnie te pakiety danych JSON, których potrzebowali—w milisekundy—omijając nadmiarowy kod typowo powiązany ze starymi monolitycznymi systemami zarządzania treścią.

Ostateczny rezultat i wpływ na system

Wynikiem końcowym jest wysoce zoptymalizowany, bezgłowy (headless) silnik backendowy, który bezproblemowo łączy tworzenie treścią z dystrybucją aplikacji mobilnej. Zespoły ds. marketingu i treści mogą sprawnie zarządzać tysiącami codziennych promocji marek za pomocą przyjaznego dla użytkownika panelu WordPress. Jednocześnie odseparowana aplikacja frontendowa konsumuje te ustrukturyzowane dane za pośrednictwem niestandardowej infrastruktury API. Ten nowoczesny framework gwarantuje natychmiastowe ładowanie stron, tworzy bezproblemowe wrażenia użytkownika dla klientów polujących na okazje i zapewnia bezpieczne skalowanie całej platformy wraz ze wzrostem liczby użytkowników.