[{"data":1,"prerenderedAt":909},["ShallowReactive",2],{"blog-headless-product-configurator-b2b-hu":3},{"slug":4,"published":5,"minutes":6,"category":7,"tags":8,"keywords":13,"about":24,"sources":31,"cover":58,"og":59,"expertise":60,"locales":61,"lang":64,"title":65,"description":66,"coverAlt":67,"metaTitle":68,"takeaways":69,"faq":75,"toc":94,"blocks":131,"others":621},"headless-product-configurator-b2b","2026-10-02",12,"web",[9,10,11,12],"Product configurator","B2B e-commerce","Nuxt","Headless commerce",[14,15,16,17,18,19,20,21,22,23],"B2B product configurator","Produktkonfigurator","Produktkonfigurator TYPO3","B2B Konfigurator","headless product configurator","CPQ configure price quote","rule engine vs constraint solver","Nuxt Spryker Glue API","product configurator 100000 variants","accessible product configurator",[25,27,29],{"name":9,"url":26},"https:\u002F\u002Fen.wikipedia.org\u002Fwiki\u002FProduct_configurator",{"name":12,"url":28},"https:\u002F\u002Fen.wikipedia.org\u002Fwiki\u002FHeadless_commerce",{"name":11,"url":30},"https:\u002F\u002Fen.wikipedia.org\u002Fwiki\u002FNuxt",[32,34,37,40,43,46,49,52,55],{"title":33,"url":26},"Wikipedia: Knowledge-based configuration (product configurator)",{"title":35,"url":36},"Google OR-Tools: The CP-SAT solver","https:\u002F\u002Fdevelopers.google.com\u002Foptimization\u002Fcp\u002Fcp_solver",{"title":38,"url":39},"Spryker documentation: Glue API, Product Configuration feature integration","https:\u002F\u002Fdocs.spryker.com\u002Fdocs\u002Fscos\u002Fdev\u002Ffeature-integration-guides\u002F202108.0\u002Fglue-api\u002Fglue-api-product-configuration-feature-integration.html",{"title":41,"url":42},"OWASP: Input Validation Cheat Sheet","https:\u002F\u002Fcheatsheetseries.owasp.org\u002Fcheatsheets\u002FInput_Validation_Cheat_Sheet.html",{"title":44,"url":45},"web.dev: Virtualize large lists","https:\u002F\u002Fweb.dev\u002Farticles\u002Fvirtualize-long-lists-react-window",{"title":47,"url":48},"W3C: Understanding SC 3.3.1 Error Identification (WCAG 2.2)","https:\u002F\u002Fwww.w3.org\u002FWAI\u002FWCAG22\u002FUnderstanding\u002Ferror-identification.html",{"title":50,"url":51},"W3C: Understanding SC 4.1.3 Status Messages (WCAG 2.2)","https:\u002F\u002Fwww.w3.org\u002FWAI\u002FWCAG22\u002FUnderstanding\u002Fstatus-messages.html",{"title":53,"url":54},"W3C: Understanding SC 2.5.8 Target Size (Minimum) (WCAG 2.2)","https:\u002F\u002Fwww.w3.org\u002FWAI\u002FWCAG22\u002FUnderstanding\u002Ftarget-size-minimum.html",{"title":56,"url":57},"W3C WAI-ARIA Authoring Practices: Combobox pattern","https:\u002F\u002Fwww.w3.org\u002FWAI\u002FARIA\u002Fapg\u002Fpatterns\u002Fcombobox\u002F","\u002Fimages\u002Fblog\u002Fheadless-product-configurator-b2b\u002Fcover.webp","\u002Fimages\u002Fblog\u002Fheadless-product-configurator-b2b\u002Fog.jpg","b2b-ecommerce-developer",[62,63,64],"en","de","hu","Headless B2B termékkonfigurátor: szabályok, árazás és Nuxt egy commerce API-n","Így építs headless B2B termékkonfigurátort: szabálymotor vagy solver, hol éljenek a szabályok, szerveroldali árazás, Nuxt commerce API-n, TYPO3, 100 ezer+ variáns.","Ábra: egy Nuxt front end egy konfigurációs szolgáltatással beszél, amely a PIM-ből a szabályokat, az ERP-ből az árakat olvassa, és validált konfigurációt ad át a commerce API-nak.","Headless B2B termékkonfigurátor útmutató · Balázs Csorba",[70,71,72,73,74],"A konfigurátort kezeld kis szolgáltatásként három feladattal (mi megengedett, mennyibe kerül, mi kell a webshopnak az eladáshoz), ne beépített szabályokkal teli front end widgetként.","Kezdj deklaratív szabálymotorral; constraint solverhez akkor nyúlj, ha a szabályok annyira összefüggnek, hogy az érvényes kombinációkat nem tudod felsorolni vagy az ütközést nem tudod megmagyarázni.","A szabályok oda tartoznak, ahol a termékadatot karbantartják (általában a PIM), az árak oda, ahol felelnek értük (általában az ERP); a webshop csak validált eredményt kap.","A böngésző mutathat előnézetet, de a szervernek a kosárba tételkor és az ajánlatkor újra validálnia és árazni kell, mert a kliensoldali validáció triviálisan kikerülhető.","100 000+ variánsnál soha nem küldöd ki a variánslistát: a szervertől kéred a következő érvényes opciókat, és ezt a párbeszédet billentyűzettel és képernyőolvasóval is használhatóvá teszed.",[76,79,82,85,88,91],{"q":77,"a":78},"Mi az a B2B termékkonfigurátor?","A B2B termékkonfigurátor végigvezeti a vásárlót egy konfigurálható termék opcióinak érvényes kombinációján, például méreteken, anyagokon és tűréseken, megmutatja az árat és a szállítási időt, és az eredményt átadja a kosárnak vagy az ajánlatnak. A fogyasztói konfigurátorokhoz képest a szabályok szigorúbbak, a katalógus nagyobb, az ár pedig gyakran szerződéses feltételektől függ.",{"q":80,"a":81},"Szabálymotor vagy constraint solver egy termékkonfigurátorhoz?","Kezdj deklaratív szabálymotorral: könnyű elmagyarázni, tesztelni, és a termékmenedzserek is karbantarthatják. Válts constraint solverre, ha a szabályok annyira összefüggnek, hogy az érvényes kombinációk nem sorolhatók fel vagy nem rendezhetők kézzel, vagy ha meg kell magyaráznod, miért lehetetlen egy választás, és meg akarod találni a legközelebbi érvényes alternatívát.",{"q":83,"a":84},"Hol éljenek a konfigurátor szabályai: PIM, ERP vagy webshop?","A szabályokat tartsd az őket indokló termékadat mellett, ez általában a PIM, az árakat pedig ott, ahol felelnek értük, általában az ERP-ben. A webshop validált konfigurációt fogyasszon, ne ő birtokolja a szabályokat, különben a szabályok duplán élnek a shopban és az ERP-ben, és szétcsúsznak.",{"q":86,"a":87},"Hogyan építs Produktkonfigurator-t TYPO3-mal?","A TYPO3 birtokolja a tartalmat, a landing oldalakat és a navigációt, a konfigurátort pedig headless appként vagy egy külön konfigurációs szolgáltatással beszélő pluginként illeszd be. A TYPO3 csak kontextust ad át, például nyelvet, vevőcsoportot és termékazonosítót; a szabályok, az árak és a validáció a CMS-en kívül maradnak.",{"q":89,"a":90},"Hogyan kezelj 100 000+ variánst egy konfigurátorban?","Soha ne tölts be és ne rendelj meg minden variánst. Modellezd a terméket attribútumokként és szabályokként, a szerver csak az aktuális választásra még érvényes opciókat adja vissza, a kereshető attribútumokat indexeld keresőmotorban, gyorsítótárazd az opciólekérdezéseket, és virtualizálj minden hosszú listát, amit meg kell jeleníteni.",{"q":92,"a":93},"Hogyan tegyél hozzáférhetővé egy konfigurátort?","Használj natív űrlapelemeket vagy jól tesztelt ARIA mintákat, az ár- és validációs változásokat állapotüzenetként jelentsd be a fókusz mozgatása nélkül, a hibákat szövegben írd le a mező mellett, és tartsd a célpontokat legalább 24 x 24 CSS pixelesre. A teljes folyamatot billentyűzettel és képernyőolvasóval is teszteld, ne csak automatikus ellenőrzővel.",[95,98,101,104,107,110,113,116,119,122,125,128],{"id":96,"title":97},"what-it-does","Mit kell valójában tudnia egy B2B konfigurátornak",{"id":99,"title":100},"rule-engine-or-solver","Szabálymotor vagy constraint solver",{"id":102,"title":103},"where-rules-live","Hol élnek a szabályok: PIM, ERP vagy webshop",{"id":105,"title":106},"pricing","Árazási logika kiszivárogtatás nélkül",{"id":108,"title":109},"nuxt-front-end","A Nuxt front end egy commerce API-n",{"id":111,"title":112},"typo3-cms","Integráció TYPO3-mal vagy más CMS-sel",{"id":114,"title":115},"performance","Teljesítmény 100 000+ variánssal",{"id":117,"title":118},"validation-quotes","Szerveroldali validáció, mentés és ajánlatok",{"id":120,"title":121},"accessibility","A hozzáférhetőség konfigurátor-követelmény",{"id":123,"title":124},"checklist","Éles indulás előtti ellenőrzőlista",{"id":126,"title":127},"outlook","Mi következik ebből",{"id":129,"title":130},"sources","Források",[132,136,150,153,172,179,180,188,203,206,272,275,276,283,286,295,298,321,322,329,332,351,354,355,362,384,402,403,410,413,414,420,456,457,464,471,493,500,501,504,546,549,550,553,572,575,576,579,591,592],{"type":133,"content":134},"paragraph",[135],"A termékkonfigurátor front end problémának látszik, amíg meg nem érkezik az első valódi katalógus. Akkor kiderül, hogy adatprobléma (honnan jönnek a szabályok?), árazási probléma (ki mondhatja meg, mennyibe kerül?) és bizalmi probléma (el tudja-e adni a shop pontosan azt, amit a vevő konfigurált?). B2B-ben, ahol egy rossz kombináció rossz alkatrészt jelent egy gépben, az utolsó a legfontosabb.",{"type":133,"content":137},[138,139,143,144,149],"Így építenék 2026-ban ",{"tag":140,"children":141},"strong",[142],"B2B termékkonfigurátort"," (egy „CPQ-lite\"-ot: konfigurálás, árazás, ajánlat a teljes CPQ-csomag nélkül) headless módon. Alapja egy több mint 100 000 precíziós gépgyártási cikkhez épített, vezetett konfigurátor automatikus árazással, Nuxt.js-sel a Spryker Glue API-n (lásd ",{"tag":145,"to":146,"children":147},"link","\u002Freferences",[148],"a Meusburger referenciát","). A cikk az architektúránál és a mérlegeléseknél marad, és a projektet ennél részletesebben nem írja le.",{"type":151,"level":152,"id":96,"text":97},"heading",2,{"type":133,"content":154},[155,156,159,160,163,164,167,168,171],"A felületet levéve a konfigurátor négy dolgot csinál. ",{"tag":140,"children":157},[158],"Korlátozza"," a választásokat, hogy csak érvényes kombinációk legyenek elérhetők. ",{"tag":140,"children":161},[162],"Levezet"," értékeket, amelyeket a vevőnek nem kell begépelnie (cikkszám, tömeg, szállítási idő). ",{"tag":140,"children":165},[166],"Árazza"," az eredményt, gyakran sávos vagy szerződéses árakkal. És ",{"tag":140,"children":169},[170],"átad"," egy konfigurációt, amelyet a vállalat többi része használni tud: kosártételt, ajánlatot, rajzkérést.",{"type":133,"content":173},[174,175,178],"A visszatérő hiba, hogy mind a négyet a front endbe teszik, mert ott készül a demó. Az eredmény: böngésző nélkül tesztelhetetlen szabályok, árak, amelyeket a kliens lát és ami még rosszabb, befolyásol, és egy shop, amelynek el kell hinnie bármit, ami megérkezik. Én a rendszert vékony felületre és egy ",{"tag":140,"children":176},[177],"konfigurációs szolgáltatásra"," bontanám, amely az első három feladatot birtokolja, a negyediket pedig a commerce platformra hagynám.",{"type":151,"level":152,"id":99,"text":100},{"type":133,"content":181},[182,183,187],"Történetileg a konfigurátorok produkciós szabályokkal indultak; a később megjelent modellalapú, constraint-alapú megközelítések szétválasztják a termékismeretet a megoldási stratégiától, így az egyik változása nem töri el a másikat, ahogy a ",{"tag":184,"href":26,"children":185},"a",[186],"Wikipedia tudásalapú konfigurálásról szóló cikke"," leírja. A gyakorlati tanulság: bármelyik technikát választod, a szabályok legyenek adatok, ne kódutak.",{"type":133,"content":189},[190,191,194,195,198,199,202],"Egy ",{"tag":140,"children":192},[193],"deklaratív szabálymotor"," olyan feltételeket értékel ki az aktuális választáson, mint „ha az anyag X, az Y feletti átmérők nem engedélyezettek\". Könnyen elmagyarázható a termékmenedzsereknek, jól unit tesztelhető (választás be, megengedett opciók ki) és gyors. Egy ",{"tag":140,"children":196},[197],"constraint solver",", például az ",{"tag":184,"href":36,"children":200},[201],"OR-Tools CP-SAT",", a terméket változókként és kényszerekként kezeli, és érvényes kiosztásokat keres; egész számokon dolgozik, ezért a tizedes méreteket skálázni kell. Akkor jeleskedik, ha a kényszerek úgy hatnak egymásra, hogy kézzel nem rendezheted őket, és ha a „mi a legközelebbi érvényes konfiguráció?\" kérdésre kell válaszolnod.",{"type":133,"content":204},[205],"Az alapértelmezésem a szabálymotor, olyan formátumú szabályokkal, amelyeket később egy solver is fel tudna dolgozni. A legtöbb katalóguscikk valójában termékcsalád néhány tucat egymásra ható paraméterrel, és egy szabály magyarázhatósága („ez az opció a 42. szabály miatt tiltott\") többet ér a supportnak, mint a solver általánossága. Az alábbi táblázat a döntési segédletem.",{"type":207,"head":208,"rows":217},"table",[209,211,213,215],[210],"Helyzet",[212],"Választás",[214],"Miért",[216],"Mire figyelj",[218,229,240,250,261],[219,221,225,227],[220],"Termékcsaládok paramétertartományokkal és néhány tucat függőséggel",[222],{"tag":140,"children":223},[224],"Szabálymotor",[226],"Átlátható, tesztelhető, a termékmenedzsment karbantarthatja",[228],"Szabálysorrend és átfedő szabályok; legyenek deklaratívak és unit tesztelve",[230,232,236,238],[231],"Sok egymásra ható opció, nincs egyértelmű kiértékelési sorrend",[233],{"tag":140,"children":234},[235],"Constraint solver",[237],"Kézzel írt sorrend nélkül talál érvényes kiosztásokat és ütközéseket",[239],"Egész számos modellezés, válaszidő, a hibák elmagyarázása a felhasználóknak",[241,243,246,248],[242],"Válaszolni kell: „semmi sem érvényes, mi a legközelebbi?\"",[244],{"tag":140,"children":245},[235],[247],"Kényszereket lazíthat és alternatívákat kereshet",[249],"Világos célfüggvény kell arra, mit jelent a „legközelebbi\"",[251,253,257,259],[252],"Többnyire fix variánsok, a választás egy szűrő",[254],{"tag":140,"children":255},[256],"Fazettás keresés, motor nélkül",[258],"A variánsok már léteznek cikkekként; szűrd és rendezd őket",[260],"Ne építs konfigurátort ott, ahol egy keresőoldal elég",[262,264,268,270],[263],"A szabályok nem fejlesztőké, akik hetente módosítják őket",[265],{"tag":140,"children":266},[267],"Szabálymotor szerkesztővel",[269],"Szabályok adatként, verziózással és review-val",[271],"Governance: ki publikálhat szabályt, és hogyan tesztelik",{"type":133,"content":273},[274],"Építés előtt ellenőrizd, kell-e egyáltalán konfigurátor. Ha a variánsok eladható cikkekként léteznek, egy jó, szűrhető katalógus olcsóbb és robusztusabb. A konfigurátor ott éri meg, ahol a kombinációs tér túl nagy a felsoroláshoz, vagy az értékeket levezetik, nem választják.",{"type":151,"level":152,"id":102,"text":103},{"type":133,"content":277},[278,279,282],"A második évben a karbantartási költséget nem a motor dönti el, hanem az, hogy ",{"tag":140,"children":280},[281],"ki birtokolja a tudás egyes fajtáit",". Az ökölszabályom: a szabályok az őket indokló termékadat mellett élnek (jellemzően a PIM-ben), az árak ott, ahol felelnek értük (jellemzően az ERP-ben, a shop gyorsítótárazza), a shop pedig soha nem birtokol konfigurációs logikát. Övé a kosár, a pénztár és az ügyfélkapcsolat.",{"type":133,"content":284},[285],"Az alábbi architektúra egy konfigurációs szolgáltatást tesz a Nuxt front end és a commerce API közé. A szolgáltatás attribútumokat és szabályokat olvas a PIM-ből, árakat és elérhetőséget az ERP-ből, és opciókat, levezetett értékeket, árat és validációs eredményt ad vissza. A commerce API csak olyan konfigurációt kap, amelyet ez a szolgáltatás validált.",{"type":287,"attrs":288,"inner":292,"caption":293},"diagram",{"viewBox":289,"role":290,"aria-labelledby":291},"0 0 720 350","img","d1-cfg-t d1-cfg-d","\u003Ctitle id=\"d1-cfg-t\">Headless konfigurátor: ki kivel beszél\u003C\u002Ftitle>\u003Cdesc id=\"d1-cfg-d\">Egy Nuxt front end elküldi az aktuális választást egy konfigurációs szolgáltatásnak, amely a szabályokat a PIM-ből, az árakat az ERP-ből olvassa. A szolgáltatás érvényes opciókat, árat és levezetett értékeket ad vissza. A validált konfiguráció a commerce API-hoz kerül kosárhoz és ajánlathoz. A CMS tartalmat ad a front endnek.\u003C\u002Fdesc>\u003Ctext x=\"20\" y=\"28\" class=\"d-title\">Headless konfigurátor: ki kivel beszél\u003C\u002Ftext>\u003Ctext x=\"700\" y=\"28\" text-anchor=\"end\" class=\"d-label\">Architektúra vázlat\u003C\u002Ftext>\u003Crect x=\"20\" y=\"70\" width=\"160\" height=\"76\" rx=\"10\" class=\"d-sky\" \u002F>\u003Ctext x=\"100\" y=\"104\" text-anchor=\"middle\" class=\"d-text\">Nuxt front end\u003C\u002Ftext>\u003Ctext x=\"100\" y=\"125\" text-anchor=\"middle\" class=\"d-small\">lépések, előnézet\u003C\u002Ftext>\u003Cpath d=\"M180 108 H277\" class=\"d-line\" \u002F>\u003Cpath d=\"M285 108 l-9 -5 v10 z\" class=\"d-head\" \u002F>\u003Crect x=\"285\" y=\"70\" width=\"160\" height=\"76\" rx=\"10\" class=\"d-accent\" \u002F>\u003Ctext x=\"365\" y=\"104\" text-anchor=\"middle\" class=\"d-text\">Konfig szolgáltatás\u003C\u002Ftext>\u003Ctext x=\"365\" y=\"125\" text-anchor=\"middle\" class=\"d-small\">szabály, ár, ellenőrzés\u003C\u002Ftext>\u003Cpath d=\"M445 108 H532\" class=\"d-line\" \u002F>\u003Cpath d=\"M540 108 l-9 -5 v10 z\" class=\"d-head\" \u002F>\u003Crect x=\"540\" y=\"70\" width=\"160\" height=\"76\" rx=\"10\" class=\"d-box\" \u002F>\u003Ctext x=\"620\" y=\"104\" text-anchor=\"middle\" class=\"d-text\">Commerce API\u003C\u002Ftext>\u003Ctext x=\"620\" y=\"125\" text-anchor=\"middle\" class=\"d-small\">kosár, ajánlat\u003C\u002Ftext>\u003Cpath d=\"M300 200 V152\" class=\"d-line\" \u002F>\u003Cpath d=\"M300 146 l-5 9 h10 z\" class=\"d-head\" \u002F>\u003Cpath d=\"M435 200 V152\" class=\"d-line\" \u002F>\u003Cpath d=\"M435 146 l-5 9 h10 z\" class=\"d-head\" \u002F>\u003Crect x=\"240\" y=\"200\" width=\"120\" height=\"56\" rx=\"10\" class=\"d-mint\" \u002F>\u003Ctext x=\"300\" y=\"224\" text-anchor=\"middle\" class=\"d-text\">PIM\u003C\u002Ftext>\u003Ctext x=\"300\" y=\"245\" text-anchor=\"middle\" class=\"d-small\">attribútum, szabály\u003C\u002Ftext>\u003Crect x=\"375\" y=\"200\" width=\"120\" height=\"56\" rx=\"10\" class=\"d-mint\" \u002F>\u003Ctext x=\"435\" y=\"224\" text-anchor=\"middle\" class=\"d-text\">ERP\u003C\u002Ftext>\u003Ctext x=\"435\" y=\"245\" text-anchor=\"middle\" class=\"d-small\">ár, készlet\u003C\u002Ftext>\u003Cpath d=\"M100 200 V152\" class=\"d-line\" \u002F>\u003Cpath d=\"M100 146 l-5 9 h10 z\" class=\"d-head\" \u002F>\u003Crect x=\"20\" y=\"200\" width=\"160\" height=\"56\" rx=\"10\" class=\"d-gold\" \u002F>\u003Ctext x=\"100\" y=\"224\" text-anchor=\"middle\" class=\"d-text\">CMS\u003C\u002Ftext>\u003Ctext x=\"100\" y=\"245\" text-anchor=\"middle\" class=\"d-small\">tartalom, kontextus\u003C\u002Ftext>\u003Crect x=\"20\" y=\"290\" width=\"680\" height=\"40\" rx=\"10\" class=\"d-box d-dash\" \u002F>\u003Ctext x=\"360\" y=\"315\" text-anchor=\"middle\" class=\"d-small\">A szerver kosárba tételkor és ajánlatkor újra ellenőriz. A böngésző csak előnézet.\u003C\u002Ftext>",[294],"A konfigurációs szolgáltatás az egyetlen hely, amely a szabályokat, az árakat és a validációt összeköti. A böngésző előnézetet mutat; a commerce API csak validált konfigurációt kap.",{"type":133,"content":296},[297],"Ebből a szétválasztásból három következmény adódik.",{"type":299,"ordered":300,"items":301},"list",false,[302,307,312],[303,306],{"tag":140,"children":304},[305],"Egy forrás tényenként."," Ha egy szabály a PIM-ben és még egyszer a shopban is él, az egyik negyedéven belül hibás lesz. A szabályokat a PIM-ből publikáld a szolgáltatásba (például verziózott artefaktként), ne vidd fel újra.",[308,311],{"tag":140,"children":309},[310],"A szolgáltatás állapotmentes egy választás fölött."," Minden hívás a teljes választást és a kontextust (vevő, árlista, nyelv) hordozza. Ettől gyorsítótárazható, tesztelhető és vízszintesen skálázható.",[313,316,317,320],{"tag":140,"children":314},[315],"A shop eredményt lát, nem folyamatot."," A Spryker például dokumentál egy Product Configuration featuret Glue API modulokkal, amelyek konfigurációs adatot visznek a kosártételeken (",{"tag":184,"href":39,"children":318},[319],"Spryker dokumentáció","). Bármelyik platformot használod, nézd meg, hogyan tárol egy konfigurációt a kosártételen és tudja-e árazni, mielőtt saját formátumot tervezel.",{"type":151,"level":152,"id":105,"text":106},{"type":133,"content":323},[324,325,328],"A B2B árak ritkán egyetlen szám. Alapárat, opciópótlékokat, mennyiségi sávokat, vevőspecifikus megállapodásokat és olykor megmunkálási vagy beállítási költséget kombinálnak. Én az ",{"tag":140,"children":326},[327],"árszámítást a szerveren, a konfigurációs szolgáltatásban"," tartanám, a választás, a mennyiség és a vevői kontextus tiszta függvényeként, amely az ERP-t vagy az ERP által karbantartott árlistát hívja.",{"type":133,"content":330},[331],"A front end ezután egy, a szerver által visszaadott árat mutat, és annak is jelöli. Ha a vevő mennyiséget változtat, kérdezz újra. A végső árat soha ne a böngészőnek küldött számokból számold; ezek a számok megjelenítési, nem rendelési bemenetek.",{"type":333,"variant":334,"title":335,"body":336},"callout","tip","Tedd reprodukálhatóvá az árat",[337],[338,339,342,343,346,347,350],"Minden mentett konfigurációval és ajánlattal együtt tárold a ",{"tag":140,"children":340},[341],"szabályrendszer verzióját",", az ",{"tag":140,"children":344},[345],"árlista verzióját"," és az árfüggvény ",{"tag":140,"children":348},[349],"bemeneteit",". Amikor egy vevő három héttel később vitatja az ajánlatot, újra ki kell tudnod számolni, vagy legalább meg kell tudnod magyarázni, mely szabályok és árak vonatkoztak rá. Enélkül az „automatikus árazás\" supportprobléma lesz.",{"type":133,"content":352},[353],"Két gyakorlati pont. Először: döntsd el korán, hogy a konfigurátor kötelező vagy tájékoztató árat mutat; ha egyes tételekhez kézi ajánlat kell (különleges tűrések, nagy mennyiségek), ezt explicit kimenetként modellezd („ajánlatkérés\"), ne hiányzó árként. Másodszor: a kerekítést, a pénznemet és az adószabályokat egy helyen tartsd, különben a konfigurátor, a kosár és a számla fillérekkel eltér, és napokig keresed az okot.",{"type":151,"level":152,"id":108,"text":109},{"type":133,"content":356},[357,358,361],"A front enden a konfigurátort ",{"tag":140,"children":359},[360],"a szerver fölötti vezetett párbeszédként"," építeném, nem olyan kliensoldali állapotgépként, amely ismeri a szabályokat. Minden lépés elküldi az aktuális választást a konfigurációs szolgáltatásnak, és kirajzolja a visszajövő opciókat, a tiltott opciók pedig indokot hordoznak. A Nuxt jól illik, mert a szerver route-ok (Nitro) backend-for-frontendként működhetnek: a böngésző a saját végpontjaiddal beszél, amelyek viszont olyan hitelesítő adatokkal hívják a konfigurációs szolgáltatást és a commerce API-t, amelyek soha nem jutnak a klienshez.",{"type":299,"ordered":300,"items":363},[364,369,374,379],[365,368],{"tag":140,"children":366},[367],"A választás az URL-ben."," Kódold a választást a query stringben, hogy a konfiguráció megosztható, könyvjelzőzhető és visszaállítható legyen. A tesztelést is megkönnyíti: egy URL egy tesztesetet jelent.",[370,373],{"tag":140,"children":371},[372],"Szerver által vezérelt lépések."," A szerver adja a következő lépést, az érvényes opciókat és a tiltottak indokait. Egy paraméter hozzáadása adatváltozás, nem release.",[375,378],{"tag":140,"children":376},[377],"Optimista előnézet, mérvadó eredmény."," Mutass azonnal olcsó helyi visszajelzést, de a szerver válaszát tekintsd igazságnak, és egyeztess.",[380,383],{"tag":140,"children":381},[382],"Átadás a commerce API-n át."," A végén a BFF-et hívod, amely még egyszer validál, majd a platform API-n (Sprykernél a Glue API) át kosárba vagy ajánlatba írja a konfigurációt.",{"type":133,"content":385},[386,387,391,392,396,397,401],"Ha MI asszisztenst is szeretnél, amely segít a vevőknek leírni, mire van szükségük („egy lemez szerszámhoz, edzett, 300 mm\"), hagyd, hogy választást javasoljon, és futtasd át ugyanazon a szolgáltatáson. A modell javasol, a szabályok döntenek. Az ügynökoldalhoz lásd az ",{"tag":145,"to":388,"children":389},"\u002Fblog\u002Fagentic-commerce-protocols-ucp-acp-guide",[390],"agentic commerce protokollokat",", a folyamat böngészőügynököknek való kitételéhez a ",{"tag":145,"to":393,"children":394},"\u002Fblog\u002Fwebmcp-agent-ready-website-guide",[395],"WebMCP-t",". Ha asszisztenst szállítasz, értékeld úgy, mint bármely más termékfunkciót, például az ",{"tag":145,"to":398,"children":399},"\u002Fblog\u002Fllm-evals-for-product-features",[400],"LLM eval-ok termékfunkciókhoz"," cikk szerint.",{"type":151,"level":152,"id":111,"text":112},{"type":133,"content":404},[405,406,409],"A „Produktkonfigurator TYPO3\" keresések általában olyan cégektől jönnek, amelyek a marketingoldalt már TYPO3-mal üzemeltetik, és a konfigurátort is abba szeretnék. A tiszta minta a munkamegosztás: ",{"tag":140,"children":407},[408],"a CMS birtokolja a tartalmat, a navigációt, a landing oldalakat és a SEO-t; a konfigurátor birtokolja a konfigurációt."," A TYPO3 rendereli az oldalt és beágyazza a konfigurátort, vagy beágyazott Nuxt appként, vagy olyan extension pluginként, amely ugyanazt a konfigurációs szolgáltatást hívja.",{"type":133,"content":411},[412],"A TYPO3-nak csak kontextust kell átadnia: nyelvet, vevőcsoportot, termékcsalád-azonosítót. Szabályokat vagy árakat ne tartson. Amint egy szabály egy tartalomelemben vagy egy TypoScript feltételben él, a termékmenedzserek nem tudják tesztelni, a fejlesztők pedig nem találják meg. Ez bármely más CMS-re és a beágyazás kontra teljesen headless front end választására is igaz: minél többet birtokol az oldalból a konfigurátor, annál egységesebb az élmény, de annál inkább lemondasz a CMS előnézeti munkafolyamatról, amelyet a szerkesztőid szeretnek.",{"type":151,"level":152,"id":114,"text":115},{"type":133,"content":415},[416,417],"A 100 000+ cikkes katalógus megváltoztatja, hogyan gondolkodsz a teljesítményről, mert nincs kirajzolandó lista. Az elv egyszerű: ",{"tag":140,"children":418},[419],"soha ne küldd ki a variánslistát a böngészőnek; kérdezd meg a szervert, mi érvényes legközelebb.",{"type":299,"ordered":300,"items":421},[422,427,432,437,442,451],[423,426],{"tag":140,"children":424},[425],"A terméket modellezd, ne a variánsokat."," Az attribútumok és a szabályok írják le a teret; a variánsok csak szükség esetén jönnek létre (cikkszám, ár).",[428,431],{"tag":140,"children":429},[430],"Indexelj a lekérdezéshez."," A kereshető attribútumok keresőmotorba kerülnek, így a „mely opciók maradtak?\" indexlekérdezés, nem táblaolvasás.",[433,436],{"tag":140,"children":434},[435],"Gyorsítótárazz választás szerint."," Ugyanarra a választásra és kontextusra az opciólekérdezések azonosak; gyorsítótárazd őket az edge-en vagy a szolgáltatásban, és a cache kulcsa tartalmazza a szabályrendszer és az árlista verzióját.",[438,441],{"tag":140,"children":439},[440],"Tartsd kicsin a payloadot."," Csak a következő lépést add vissza, ne a teljes fát, és tömörítsd.",[443,446,447,450],{"tag":140,"children":444},[445],"Virtualizáld, ami hosszú."," Ha egy lépéshez valóban hosszú lista kell (például több száz átmérő), csak a látható ablakot rajzold ki: a ",{"tag":184,"href":45,"children":448},[449],"virtualizálás"," újrahasznosítja a nézetből kikerülő DOM csomópontokat, így a kirajzolt elemek száma az ablakot követi, nem az adatot.",[452,455],{"tag":140,"children":453},[454],"Mérd az egész párbeszédet."," A mutató a „kattintástól a frissített, érvényes opciókig\" idő, p95, az ERP-s árlekérdezéssel együtt. Költségvetezd, és valós választásokkal teszteld.",{"type":151,"level":152,"id":117,"text":118},{"type":133,"content":458},[459,460,463],"Amit a böngésző érvényesít, azt a szervernek újra érvényesítenie kell. Az ",{"tag":184,"href":42,"children":461},[462],"OWASP Input Validation Cheat Sheet"," egyértelműen kimondja, hogy a bemenet validációját a szerveroldalon kell megvalósítani, mert a kliensoldali validáció könnyen kikerülhető, és az allow-listet részesíti előnyben: pontosan meg kell határozni, mi megengedett. Egy konfigurátornál ez azt jelenti, hogy a szerver csak olyan választást fogad el, amely az aktuális szabályrendszer szerint érvényes, a levezetett értékeket és az árat pedig újraszámolja ahelyett, hogy a kapottaknak hinne.",{"type":133,"content":465},[466,467,470],"A konfigurációt kezeld ",{"tag":140,"children":468},[469],"megváltoztathatatlan, verziózott dokumentumként",". Egy kompakt forma jól működik:",{"type":299,"ordered":300,"items":472},[473,478,483,488],[474,477],{"tag":140,"children":475},[476],"Azonosság:"," konfigurációs azonosító, termékcsalád, létrehozó vevő és időbélyeg.",[479,482],{"tag":140,"children":480},[481],"Választás:"," a kiválasztott paraméterértékek, semmi levezetett.",[484,487],{"tag":140,"children":485},[486],"Verziók:"," a létrehozáskor használt szabályrendszer- és árlista-verzió.",[489,492],{"tag":140,"children":490},[491],"Eredmény:"," levezetett értékek, árbontás, valamint a cikkszám vagy egy „kézi ellenőrzés szükséges\" jelző.",{"type":133,"content":494},[495,496,499],"A mentés ezután ennek a dokumentumnak a megírása; az ",{"tag":140,"children":497},[498],"ajánlatadás"," a befagyasztása érvényességi idővel és az ajánlathoz kötve. Ha egy ajánlatot elfogadnak, rendelés előtt validáld újra az aktuális szabályokkal: ha közben változott egy szabály, a vevő hamarabb tudja meg, mint a gyártás. Hogy a dokumentumot a konfigurációs szolgáltatásban vagy a commerce platformon tartod, másodlagos ahhoz képest, hogy teljes és újrajátszható legyen.",{"type":151,"level":152,"id":120,"text":121},{"type":133,"content":502},[503],"A konfigurátor sűrű, dinamikus űrlap, és a hozzáférhetőség általában itt törik el. A gyakorlati ok egyszerű: az a vevő, aki nem tudja kezelni a konfigurátorodat, nem tud rendelni. Ezeket az ellenőrzéseket alkalmazom, a WCAG 2.2-höz rendelve:",{"type":299,"ordered":300,"items":505},[506,515,524,532,541],[507,510,511,514],{"tag":140,"children":508},[509],"Szövegben mondd meg, mi a hiba."," A ",{"tag":184,"href":48,"children":512},[513],"3.3.1 sikerkritérium"," megköveteli, hogy a beviteli hibát azonosítsák és szövegben leírják. „Ez az átmérő edzett acéllal nem elérhető\" többet ér, mint egy piros keret.",[516,519,520,523],{"tag":140,"children":517},[518],"Jelentsd be a változásokat a fókusz elvétele nélkül."," Amikor az ár vagy az opciólista frissül, a ",{"tag":184,"href":51,"children":521},[522],"4.1.3 Állapotüzenetek"," azt várja, hogy a változás programozottan megállapítható legyen, például role=\"status\" a frissítésekhez és role=\"alert\" a hibákhoz, hogy a képernyőolvasók a fókusz mozgatása nélkül bemondják.",[525,510,528,531],{"tag":140,"children":526},[527],"Elég nagy célpontok.",{"tag":184,"href":54,"children":529},[530],"2.5.8"," a mutatós célpontokra 24 x 24 CSS pixel minimumot ír elő, kivételekkel; a színminták és a kis léptetők azok a helyek, ahol a konfigurátorok elbuknak.",[533,536,537,540],{"tag":140,"children":534},[535],"Használj bevált mintákat."," Részesítsd előnyben a natív rádiógombokat, select és szám mezőket; ahol kereshető opciólista kell, kövesd az ",{"tag":184,"href":57,"children":538},[539],"ARIA combobox mintát"," a billentyűzetkezelésével együtt.",[542,545],{"tag":140,"children":543},[544],"A tiltott opciókhoz indok kell."," Egy pusztán elszürkített opció a képernyőolvasót használónak zsákutca; add meg az okot szövegben.",{"type":133,"content":547},[548],"Az automatikus ellenőrzők ennek csak egy részét találják meg. Mielőtt késznek nevezed, játszd végig a teljes folyamatot billentyűzettel és legalább egy képernyőolvasóval.",{"type":151,"level":152,"id":123,"text":124},{"type":133,"content":551},[552],"Mielőtt egy konfigurátor élesedik, ezek mindegyikére igent szeretnék:",{"type":299,"ordered":554,"items":555},true,[556,558,560,562,564,566,568,570],[557],"Minden szabály adat, felelőssel, verzióval és unit teszttel.",[559],"A szabályok egy forrásból jönnek (általában a PIM-ből), és egy szabályrendszer publikálása felülvizsgált lépés.",[561],"Az árakat a szerver számolja verziózott árlistából; a böngésző soha nem dönt árról.",[563],"A kosárba tétel és az ajánlat újra validál és újra árazik; a meghamisított kérést elutasítják.",[565],"Minden mentett konfiguráció rögzíti a szabályrendszer-verziót, az árlista-verziót és a bemeneteket, és újraszámolható.",[567],"Az automatikusan nem árazható esetek explicit „ajánlatkéréssel\" végződnek, nem hibával.",[569],"A „kattintástól az érvényes opciókig\" idő 95. percentilisét valós választásokon mérik.",[571],"A teljes folyamat működik billentyűzettel és képernyőolvasóval, a hibákat és az állapotváltozásokat szövegben jelentik be.",{"type":133,"content":573},[574],"Ha először csak három dolgot tudsz megtenni, az elsőt, a harmadikat és a negyediket válaszd.",{"type":151,"level":152,"id":126,"text":127},{"type":133,"content":577},[578],"A visszatérő téma a szétválasztás. Szabályok adatként, egy helyen birtokolva; az árak annál a rendszernél, amely felel értük; vékony front end, amely kérdez, nem tud; commerce platform, amely validált eredményt kap. Ettől lesz a konfigurátor elég stabil a bővítéshez, akár új termékcsalád, ajánlati munkafolyamat vagy egy ráépülő asszisztens a következő lépés.",{"type":133,"content":580},[581,582,585,586,590],"A Nuxt.js-sel a Spryker Glue API-n épített vezetett konfigurátor ",{"tag":145,"to":146,"children":583},[584],"a referenciáim"," között szerepel. Ha te is tervezel egyet, és át akarod beszélni a szabálymotor vagy solver döntést, illetve a PIM és az ERP közötti felosztást, a ",{"tag":145,"to":587,"children":588},"\u002Fexpertise\u002Fb2b-ecommerce-developer",[589],"B2B e-commerce fejlesztő oldalamon"," megtalálod a részleteket.",{"type":151,"level":152,"id":129,"text":130},{"type":299,"ordered":554,"items":593},[594,597,600,603,606,609,612,615,618],[595],{"tag":184,"href":26,"children":596},[33],[598],{"tag":184,"href":36,"children":599},[35],[601],{"tag":184,"href":39,"children":602},[38],[604],{"tag":184,"href":42,"children":605},[41],[607],{"tag":184,"href":45,"children":608},[44],[610],{"tag":184,"href":48,"children":611},[47],[613],{"tag":184,"href":51,"children":614},[50],[616],{"tag":184,"href":54,"children":617},[53],[619],{"tag":184,"href":57,"children":620},[56],[622,707,774,862],{"slug":623,"published":5,"minutes":624,"category":7,"tags":625,"keywords":629,"about":640,"sources":649,"cover":701,"og":702,"expertise":60,"locales":703,"lang":64,"title":704,"description":705,"coverAlt":706},"european-accessibility-act-b2b-shop",13,[626,627,628,10],"European Accessibility Act","BFSG","WCAG 2.2",[630,631,632,633,634,635,636,637,638,639],"European Accessibility Act B2B shop","BFSG B2B Onlineshop","Barrierefreiheit Onlineshop","Spryker barrierefrei","barrierefrei Webshop","BaFG Österreich Webshop","EN 301 549 WCAG 2.2","BFSG Kleinstunternehmen Ausnahme","Pimcore TYPO3 Barrierefreiheit","EAA e-commerce checklist",[641,643,646],{"name":626,"url":642},"https:\u002F\u002Fen.wikipedia.org\u002Fwiki\u002FEuropean_Accessibility_Act",{"name":644,"url":645},"Web Content Accessibility Guidelines","https:\u002F\u002Fen.wikipedia.org\u002Fwiki\u002FWeb_Content_Accessibility_Guidelines",{"name":647,"url":648},"E-commerce","https:\u002F\u002Fen.wikipedia.org\u002Fwiki\u002FE-commerce",[650,653,656,659,662,665,668,671,674,677,680,683,686,689,692,695,698],{"title":651,"url":652},"BFSG section 1: purpose and scope (gesetze-im-internet.de)","https:\u002F\u002Fwww.gesetze-im-internet.de\u002Fbfsg\u002F__1.html",{"title":654,"url":655},"BFSG section 2: definitions, consumer, microenterprise, e-commerce services","https:\u002F\u002Fwww.gesetze-im-internet.de\u002Fbfsg\u002F__2.html",{"title":657,"url":658},"BFSG section 3: accessibility and the microenterprise exemption","https:\u002F\u002Fwww.gesetze-im-internet.de\u002Fbfsg\u002F__3.html",{"title":660,"url":661},"BFSG section 14: duties of the service provider","https:\u002F\u002Fwww.gesetze-im-internet.de\u002Fbfsg\u002F__14.html",{"title":663,"url":664},"BFSG section 32: rights of consumers and associations in the administrative procedure","https:\u002F\u002Fwww.gesetze-im-internet.de\u002Fbfsg\u002F__32.html",{"title":666,"url":667},"BFSG section 37: fines","https:\u002F\u002Fwww.gesetze-im-internet.de\u002Fbfsg\u002F__37.html",{"title":669,"url":670},"BFSG section 38: transitional provisions","https:\u002F\u002Fwww.gesetze-im-internet.de\u002Fbfsg\u002F__38.html",{"title":672,"url":673},"Bundesfachstelle Barrierefreiheit: FAQ on the BFSG (B2B, microenterprises, EN 301 549)","https:\u002F\u002Fwww.bundesfachstelle-barrierefreiheit.de\u002FDE\u002FFachwissen\u002FProdukte-und-Dienstleistungen\u002FBarrierefreiheitsstaerkungsgesetz\u002FFAQ\u002Ffaq_node.html",{"title":675,"url":676},"AccessibleEU: The European accessibility standard EN 301 549 has been updated (7 September 2026)","https:\u002F\u002Faccessible-eu-centre.ec.europa.eu\u002Fcontent-corner\u002Fnews\u002Feuropean-accessibility-standard-en-301-549-has-been-updated-2026-09-07_en",{"title":678,"url":679},"W3C: Web Content Accessibility Guidelines (WCAG) 2.2","https:\u002F\u002Fwww.w3.org\u002FTR\u002FWCAG22\u002F",{"title":681,"url":682},"Deque: Automated testing identifies 57 percent of digital accessibility issues","https:\u002F\u002Fwww.deque.com\u002Fblog\u002Fautomated-testing-study-identifies-57-percent-of-digital-accessibility-issues\u002F",{"title":684,"url":685},"sitebrunch: What is the market surveillance authority for accessibility (MLBF)?","https:\u002F\u002Fwww.sitebrunch.com\u002Fnews\u002Fmlbf-marktueberwachungsstelle-barrierefreiheit",{"title":687,"url":688},"Marcus Herrmann: June 2026, how the MLBF intends to check","https:\u002F\u002Fmarcus-herrmann.com\u002Fblog\u002Fmlbf-verraet-wie-sie-pruefen-will",{"title":690,"url":691},"axes4: BFSG in practice, what has happened since the deadline (2026)","https:\u002F\u002Fwww.axes4.com\u002Fde\u002Fblog\u002Fpost\u002F2026\u002Fbfsg-in-der-praxis-was-sich-seit-dem-stichtag-getan-hat",{"title":693,"url":694},"ODC Legal: BFSG for websites, what companies must check in 2026","https:\u002F\u002Fwww.odclegal.de\u002Fblog\u002Fbfsg-website-pflicht",{"title":696,"url":697},"WKO: Information on the Austrian Barrierefreiheitsgesetz","https:\u002F\u002Fwww.wko.at\u002Fce-kennzeichnung-normen\u002Finformationen-zum-barrierefreiheitsgesetz",{"title":699,"url":700},"Web Crossing: One year of the Barrierefreiheitsgesetz, where online shops must improve","https:\u002F\u002Fwww.web-crossing.com\u002Fnews\u002Fdetail\u002Fein-jahr-barrierefreiheitsgesetz-wo-onlineshops-und-websites-jetzt-nachbessern-muessen\u002F","\u002Fimages\u002Fblog\u002Feuropean-accessibility-act-b2b-shop\u002Fcover.webp","\u002Fimages\u002Fblog\u002Feuropean-accessibility-act-b2b-shop\u002Fog.jpg",[62,63,64],"European Accessibility Act B2B webshopoknál: mit kell javítaniuk a Spryker, Pimcore és TYPO3 csapatoknak","Vonatkozik az European Accessibility Act a B2B webshopokra? BFSG és BaFG hatálya, mikrovállalkozási mentesség, 2026-os végrehajtás, WCAG 2.2 és javítási terv.","Ábra: egy B2B webshop elágazik a BFSG és BaFG fogyasztói hatályának kérdésére, a WCAG 2.2 AA megfelelésre, az akadálymentességi nyilatkozatra és a piacfelügyeletre.",{"slug":708,"published":5,"minutes":6,"category":7,"tags":709,"keywords":714,"about":725,"sources":734,"cover":768,"og":769,"expertise":60,"locales":770,"lang":64,"title":771,"description":772,"coverAlt":773},"pimcore-erp-delta-sync",[710,711,712,713],"Pimcore","SAP integration","PIM ERP sync","Symfony Messenger",[715,716,717,718,719,720,721,722,723,724],"Pimcore ERP delta sync","Pimcore developer","Pimcore SAP integration","PIM ERP Schnittstelle","Pimcore SAP Schnittstelle","PIM ERP sync best practices","Pimcore Symfony Messenger","delta sync vs full sync","idempotent import Pimcore","Pimcore Infor integration",[726,728,731],{"name":710,"url":727},"https:\u002F\u002Fen.wikipedia.org\u002Fwiki\u002FPimcore",{"name":729,"url":730},"SAP ERP","https:\u002F\u002Fen.wikipedia.org\u002Fwiki\u002FSAP_ERP",{"name":732,"url":733},"Product information management","https:\u002F\u002Fen.wikipedia.org\u002Fwiki\u002FProduct_information_management",[735,738,741,744,747,750,753,756,759,762,765],{"title":736,"url":737},"Pimcore docs: Symfony Messenger","https:\u002F\u002Fdocs.pimcore.com\u002Fplatform\u002FGetting_Started\u002FInstallation\u002FAdvanced_Installation_Topics\u002FSymfony_Messenger\u002F",{"title":739,"url":740},"Pimcore docs: Platform Versions","https:\u002F\u002Fdocs.pimcore.com\u002Fplatform\u002FPimcore_Platform\u002FPlatform_Versions\u002F",{"title":742,"url":743},"Pimcore docs: Pimcore Editions","https:\u002F\u002Fdocs.pimcore.com\u002Fplatform\u002FPimcore_Platform\u002FPimcore_Editions\u002F",{"title":745,"url":746},"Pimcore docs: Data Importer","https:\u002F\u002Fdocs.pimcore.com\u002Fplatform\u002FData_Importer\u002F",{"title":748,"url":749},"Pimcore on GitHub: Release 2026.3.0","https:\u002F\u002Fgithub.com\u002Fpimcore\u002Fpimcore\u002Freleases\u002Ftag\u002Fv2026.3.0",{"title":751,"url":752},"Symfony docs: Messenger, Sync & Queued Message Handling","https:\u002F\u002Fsymfony.com\u002Fdoc\u002Fcurrent\u002Fmessenger.html",{"title":754,"url":755},"SAP Library: Change Pointer (Master Data Distribution)","https:\u002F\u002Fhelp.sap.com\u002Fdoc\u002Fsaphelp_nw73ehp1\u002F7.31.19\u002Fen-us\u002F4a\u002Fbb1e253536478be10000000a421937\u002Fcontent.htm?no_cache=true",{"title":757,"url":758},"SAP Library: Change Pointer (IDoc Interface\u002FALE)","https:\u002F\u002Fhelp.sap.com\u002Fdoc\u002Fsaphelp_em700_ehp01\u002F7.0.1\u002Fen-US\u002F12\u002F83e03c19758e71e10000000a114084\u002Fcontent.htm?no_cache=true",{"title":760,"url":761},"Infor docs: Infor ION and M3 BODs","https:\u002F\u002Fdocs.infor.com\u002Fm3cs\u002F10.2.3\u002Fen-us\u002Fm3csbom\u002Ffabsog\u002Fgoi1495809108914.html",{"title":763,"url":764},"Infor Developer Portal: Integration with ION","https:\u002F\u002Fdeveloper.infor.com\u002Ftutorials\u002Fintegration-with-ion",{"title":766,"url":767},"Debezium: open source distributed platform for change data capture","https:\u002F\u002Fdebezium.io\u002F","\u002Fimages\u002Fblog\u002Fpimcore-erp-delta-sync\u002Fcover.webp","\u002Fimages\u002Fblog\u002Fpimcore-erp-delta-sync\u002Fog.jpg",[62,63,64],"Pimcore ERP delta szinkron: termékadatok SAP vagy Infor, PIM és webshop között","Termékadatok szinkronja SAP vagy Infor, Pimcore és webshop között: delta és full sync, változásdetektálás, idempotens importok, Messenger, tulajdonlás, replay.","Ábra: a termékadatok egy SAP vagy Infor ERP-ből delta kinyerésen és üzenetsoron át a Pimcore-ba folynak, ahol minőségi kapuk futnak, majd tovább a webshopba.",{"slug":775,"published":5,"minutes":624,"category":7,"tags":776,"keywords":779,"about":790,"sources":797,"cover":855,"og":856,"expertise":857,"locales":858,"lang":64,"title":859,"description":860,"coverAlt":861},"nuxt-core-web-vitals-performance",[777,11,778,647],"Core Web Vitals","Performance",[780,781,782,783,784,785,786,787,788,789],"Core Web Vitals Nuxt","Nuxt performance optimization","improve LCP Nuxt","INP Nuxt hydration","fix CLS Vue","Nuxt lazy hydration","Nuxt Image LCP","Nuxt Scripts third-party scripts","Nuxt prerender vs SSR vs ISR","Core Web Vitals e-commerce",[791,793,794],{"name":777,"url":792},"https:\u002F\u002Fen.wikipedia.org\u002Fwiki\u002FCore_Web_Vitals",{"name":11,"url":30},{"name":795,"url":796},"Vue.js","https:\u002F\u002Fen.wikipedia.org\u002Fwiki\u002FVue.js",[798,801,804,807,810,813,816,819,822,825,828,831,834,837,840,843,846,849,852],{"title":799,"url":800},"web.dev: Web Vitals","https:\u002F\u002Fweb.dev\u002Farticles\u002Fvitals",{"title":802,"url":803},"web.dev: Largest Contentful Paint (LCP)","https:\u002F\u002Fweb.dev\u002Farticles\u002Flcp",{"title":805,"url":806},"web.dev: Optimize Largest Contentful Paint","https:\u002F\u002Fweb.dev\u002Farticles\u002Foptimize-lcp",{"title":808,"url":809},"web.dev: Interaction to Next Paint (INP)","https:\u002F\u002Fweb.dev\u002Farticles\u002Finp",{"title":811,"url":812},"web.dev: Optimize Cumulative Layout Shift","https:\u002F\u002Fweb.dev\u002Farticles\u002Foptimize-cls",{"title":814,"url":815},"web.dev: Optimize long tasks","https:\u002F\u002Fweb.dev\u002Farticles\u002Foptimize-long-tasks",{"title":817,"url":818},"Chrome for Developers: Chrome UX Report (CrUX)","https:\u002F\u002Fdeveloper.chrome.com\u002Fdocs\u002Fcrux",{"title":820,"url":821},"Chrome for Developers: CrUX methodology","https:\u002F\u002Fdeveloper.chrome.com\u002Fdocs\u002Fcrux\u002Fmethodology",{"title":823,"url":824},"GitHub: GoogleChrome\u002Fweb-vitals","https:\u002F\u002Fgithub.com\u002FGoogleChrome\u002Fweb-vitals",{"title":826,"url":827},"Nuxt docs: Rendering modes","https:\u002F\u002Fnuxt.com\u002Fdocs\u002F4.x\u002Fguide\u002Fconcepts\u002Frendering",{"title":829,"url":830},"Nuxt docs: Components (Lazy prefix, delayed hydration, client components)","https:\u002F\u002Fnuxt.com\u002Fdocs\u002F4.x\u002Fguide\u002Fdirectory-structure\u002Fapp\u002Fcomponents",{"title":832,"url":833},"Nuxt docs: Experimental features (lazyHydration, payloadExtraction)","https:\u002F\u002Fnuxt.com\u002Fdocs\u002F4.x\u002Fguide\u002Fgoing-further\u002Fexperimental-features",{"title":835,"url":836},"Nuxt docs: Data fetching (pick, transform, lazy)","https:\u002F\u002Fnuxt.com\u002Fdocs\u002F4.x\u002Fgetting-started\u002Fdata-fetching",{"title":838,"url":839},"Nuxt blog: Nuxt 4.5","https:\u002F\u002Fnuxt.com\u002Fblog\u002Fv4-5",{"title":841,"url":842},"GitHub: Nuxt releases","https:\u002F\u002Fgithub.com\u002Fnuxt\u002Fnuxt\u002Freleases",{"title":844,"url":845},"Nuxt Image: NuxtImg","https:\u002F\u002Fimage.nuxt.com\u002Fusage\u002Fnuxt-img",{"title":847,"url":848},"Nuxt Fonts module","https:\u002F\u002Fnuxt.com\u002Fmodules\u002Ffonts",{"title":850,"url":851},"Nuxt Scripts: Getting started","https:\u002F\u002Fscripts.nuxt.com\u002Fdocs\u002Fgetting-started",{"title":853,"url":854},"Nuxt Scripts: Script triggers","https:\u002F\u002Fscripts.nuxt.com\u002Fdocs\u002Fguides\u002Fscript-triggers","\u002Fimages\u002Fblog\u002Fnuxt-core-web-vitals-performance\u002Fcover.webp","\u002Fimages\u002Fblog\u002Fnuxt-core-web-vitals-performance\u002Fog.jpg","vue-nuxt-developer",[62,63,64],"Core Web Vitals Nuxt oldalakhoz és webshopokhoz: LCP, INP és CLS javítása","Így javítsd az LCP-t, az INP-t és a CLS-t Nuxt 4 oldalakon és webshopokban: képek, hydration, fontok, külső szkriptek, prerender vs. SSR vs. ISR, mérés valódi felhasználókkal.","Diagram: egy Nuxt oldalbetöltés a szerver HTML-jétől a hero képen, a hydration-ön és az interakción át, az LCP, INP és CLS küszöbértékeivel a szakaszokon.",{"slug":863,"published":864,"minutes":865,"category":7,"tags":866,"keywords":872,"about":881,"sources":890,"cover":903,"og":904,"expertise":857,"locales":905,"lang":64,"title":906,"description":907,"coverAlt":908},"home-assistant-ev-charging-energy-manager","2026-09-29",9,[867,868,869,870,871],"Home Assistant","EPEX Spot","Energy prices","Tesla","Energy management",[873,874,875,876,877,878,879,880],"EPEX Austria prices","spot tariff Austria EV charging","Home Assistant EV charging","cheapest hours charging","day-ahead price Austria","negative electricity prices Austria","Tesla charging spot prices","load management 3 phase",[882,885,887],{"name":883,"url":884},"EPEX SPOT","https:\u002F\u002Fen.wikipedia.org\u002Fwiki\u002FEPEX_SPOT",{"name":867,"url":886},"https:\u002F\u002Fen.wikipedia.org\u002Fwiki\u002FHome_Assistant",{"name":888,"url":889},"Load management","https:\u002F\u002Fen.wikipedia.org\u002Fwiki\u002FLoad_management",[891,894,897,900],{"title":892,"url":893},"aWATTar Austria: market data API","https:\u002F\u002Fwww.awattar.at\u002Fservices\u002Fapi",{"title":895,"url":896},"EPEX SPOT: market results","https:\u002F\u002Fwww.epexspot.com\u002Fen\u002Fmarket-results",{"title":898,"url":899},"Home Assistant developer docs: apps","https:\u002F\u002Fdevelopers.home-assistant.io\u002Fdocs\u002Fapps\u002F",{"title":901,"url":902},"Home Assistant: Tesla Fleet integration","https:\u002F\u002Fwww.home-assistant.io\u002Fintegrations\u002Ftesla_fleet\u002F","\u002Fimages\u002Fblog\u002Fhome-assistant-ev-charging-energy-manager\u002Fcover.webp","\u002Fimages\u002Fblog\u002Fhome-assistant-ev-charging-energy-manager\u002Fog.jpg",[62,63,64],"Töltés EPEX ausztriai árakon: mennyit spórol a Home Assistant appom","Egy év órás EPEX ár Ausztriára, újrajátszva egy Teslára és egy bojlerre: a legolcsóbb órákban 6,5 ct\u002FkWh a töltés 18,9 helyett, évi közel 590 €, a 20 A-es biztosíték kiégetése nélkül.","Borítókép: három oszlop hasonlítja össze a 18,9, 13,1 és 6,5 ct\u002FkWh-t 18:00-kori, éjszakai és legolcsóbb órás töltésnél.",1791009036556]