Modern technológiák az e-kereskedelemben: a WooCommerce jövője

Modern technológiák az e-kereskedelemben: a WooCommerce jövője
A WordPress világraszóló jelentőségét mi sem adja vissza jobban, minthogy a globális piaci részesedése 2021-ben 40%-os, vagyis az interneten fellelhető összes weboldal 40%-a ezeken az alapokon fejlődött. Ami pedig még ennél is fontosabb, hogy az összes e-kereskedelmi rendszer (vagyis webáruház) 26%-a a WordPress hivatalos e-commerce rendszerét, a WooCommerce-t használja. Ez hatalmas szám, adódik a kérdés tehát, hogy merre tart a WordPress, merre tart a webshopipar?

Először 2018-ban, a belgrádi WCEU-n (a WordPress közösség hivatalos fejlesztői konferenciáján) hallottunk a Headless WordPress rendszerek létjogosultságáról, és már akkor is olyan izgalmas iránynak tűnt, ami egyszer majd “leválthatja” az egyre inkább monolitikus óriássá (és ezáltal egyre inkább rugalmatlanná) váló WordPress motort - írja a kosarertek.hu. A következő jelzésértékű dolog – amolyan jóslatszerűség – az volt, amikor a 2020-as WCEU-n (amit a kialakuló Covid-helyzet miatt immáron a digitális térben tartottak a napfényes Porto helyett), már maga Matt Mullenweg, a WordPress teljhatalmú alapítója említette a témát – ekkor kezdtünk mi is komolyabban foglalkozni a “fej nélküli” WordPressel, még cikket is írtunk róla, és Gatsby alapokon futó, villámgyors betöltési sebességű WP-mintaprojektet is fejlesztettünk rá anno.

Ebben a mai cikkben körüljárjuk, hogy mit takar a headless megközelítés, mi is az a Gatsby, és milyen előnyökkel jár a használata. Milyen modern szerver architektúrák segítségével lehetséges stabil és jól működő headless rendszereket kiépíteni? És ha már szerver, kicsit kitekintünk a legmodernebb, felhőben menedzselt, üzleti folyamatokat támogató e-commerce eszközökre is!

Mi az a Headless, és miért szeretjük a fejetlenséget?

A Headless CMS egy olyan tartalomkezelő rendszer, ami szétválasztott architektúrákat használ, annak érdekében, hogy külön kezelje a frontendet (amit a felhasználók látnak) a backendtől (vagyis esetünkben az admin rendszertől, ahol maga az e-commerce üzleti logika valósul meg és a tartalmakat szerkesztjük). Hagyományosan a CMS (Content Management System, vagyis tartalomkezelő rendszer) mindkét réteg működéséért felelős, míg a “fej nélküli” rendszereknél a CMS csak azért felel, amiben igazán jó (a tartalmak kezeléséért), a prezentációs réteget pedig jóval modernebb (és trendibb), felhasználói élményre optimalizált programnyelveken alapuló rendszerek (mint például a Gatsby) valósítják meg.

Mi a “tradicionális” és a headless WordPress közötti különbség?

Egy kicsit (tényleg kicsit) muszáj beleásnunk magunkat a technikai részletekbe. A legtöbb WordPress installáció témákat használ a tartalmak megjelenítésére a böngészőben. Ezek a téma-fájlok HTML kódok és PHP sabloncímkék egyvelegei, melyek szabályozzák egy adott oldal vagy oldaltípus elrendezését. Ennek az a hátránya, hogy a tartalom csak HTML-ben érhető el, meghatározva és limitálva az egyes sablonok dokumentum szerkezetét, illetve, mivel a WordPress magja PHP programnyelvet használ, ami szerver oldalon rendereli a tartalmakat, a weboldalak teljesítményének (gyorsaság és oldalbetöltés mindenek felett) is lényeges gátakat szab. Ezzel szemben a headless rendszerek a WordPress REST API-ján keresztül végzik a frontend oldali megjelenítést, JSON fájlok formájában, a HTML helyett. Ez egy lényegesen rugalmasabb fejlesztői megközelítés, ami villámgyors oldalbetöltődéseket eredményez, már-már natív mobil applikáció szintű felhasználói élménnyel felvértezve a weboldalakat, webáruházakat. Mindezt úgy, hogy a háttérben továbbra is a jól ismert és (marketing szempontból is) fantasztikus dolgokra képes WordPress/ WooCommerce páros teszi a dolgát.

Mi az a Gatsby, és mik az előnyei?

A Gatsby a modern web találmánya és alapvetően egyfajta statikus site-generátor. Ha az interneten böngészel és rátalálsz egy ősrégi, tisztán HTML alapú weboldalra, az is statikus. Na, de akkor mi ebben az innováció, kérdezhetnénk. Az, hogy a Gatsby képes dinamikus, adatbázis-vezérelt weboldalakat (mint például egy webshop) statikusan megjeleníteni, ehhez pedig 3 fő komponenst használ: React, Webpack és GraphQL. A React napjaink – joggal nevezhetjük így – legtrendibb programnyelve, a Facebook alapja, amit az FB fejlesztői közössége publikál, hasonlóan a GraphQL-hez, amit szintén a Facebook jegyez és ami a háttérből érkező adatok betöltéséért felel. Működési elvét tekintve hasonló a relációs típusú SQL adatbázisokhoz: lekérésekre adattal válaszol.

A Gatsby előnye a gyakorlatban tehát az elképesztő, néhány milliszekundumos oldalbetöltés és a hihetetlenül gördülékeny, maximálisan reszponzív felhasználói élmény. Olyan élményt nyújt a felhasználóknak, amire még 2021-ben (és ‘22-ben) is felkapja a fejét az egyszeri netező: #hátezkomoly.

Biztonság, biztonság és biztonság: ha a Gatsby szolgálja ki a WordPress frontendjét, nincsenek képben aktív webszerverek, nincs elérhető adatbázis, vagyis a támadási felület lényegesen kisebb, mint hagyományos esetben. Ez jelentősen csökkenti a DDoS támadások esetleges sikerességét, és kevesebb teret ad más, nyers erőt (brute force) alkalmazó támadási módszereknek is. Különösen fontos ez, kiindulva csak az idén történt legfontosabb hackertámadásokból (fejre állt az UNIX Autó, terheléses támadások sorozata állami fenntartású webhelyek ellen stb.). A teljes cikk itt folytatódik.

Kövesd az oldalunkat a Facebook-on és a Twitteren is!