A Playwright segítségével futtathat egyetlen tesztet, egy tesztcsomagot vagy az összes tesztet. A tesztek futtathatók egy böngészőben vagy a –project kapcsolóval több böngészőben is. Telepítés A teszteléshez fel kell telepíteni a Playwright-ot: npm init playwright@latest Csak a csomag telepítése meglévő projekthez: npm install -D @playwright/test majd npx playwright install Az npx letölti a legfrissebb telepítőt, […]
Continue ReadingEbben a példában egy tokent fogunk menteni, beolvasni. Hozzunk létre egy Home, Oldal1, Oldal2 komponenst! Készítsünk navigációt, és egy beviteli mezőt a tokennek! Ha van token, a beviteli mező és gomb tünjön el, helyettük egy kilépés menüpont jelenjen meg! Megoldás A tokent a local storage-ban tároljuk el. Minden oldalon ellenőrizzük a token meglétét, de nincs […]
Continue ReadingAz akadálymentes weboldalak készítése nem csupán kedvesség, hanem alapvető szakmai követelmény, hogy a fogyatékkal élő felhasználók (például látássérültek, akik képernyőolvasót használnak) is teljes értékű élményt kapjanak. A WCAG (Web Content Accessibility Guidelines) a W3C által kiadott irányelvek gyűjteménye, amelyek célja, hogy a webes tartalmak mindenki számára hozzáférhetők legyenek, Az irányelvek négy alapelvre épülnek (POUR): Bővebben […]
Continue Reading
A React Router Outlet egy speciális komponens, ami helyőrzőként működik a szülő útvonalban, és oda rendereli a gyermek útvonalak tartalmát. Miért van rá szükség? Ha van egy layout (pl. fejléc, lábléc, main), és ezekben dinamikusan változó tartalom (pl. Home, About, Contact), akkor az Outlet jelzi, hová kerüljenek a gyerek route-ok, pl. a main-en belül. Hogyan […]
Continue Reading
NavLink A React Router-ben a Link és a NavLink ugyanarra szolgál: kliensoldali navigációra, azaz új oldal betöltése nélkül váltanak útvonalat. A lényegi különbség az, hogy a NavLink tud „aktív” állapotot kezelni (amikor az aktuális URL megfelel a link céljának), és ehhez stílust/klasszt ad automatikusan — menükhöz, navigációhoz ideális. Link tulajdonságai: NavLink tulajsdonságai: Link tulajdonságai + […]
Continue Reading
A RegExp (Regular Expression – reguláris kifejezés) egy mintaleíró nyelv, amellyel szövegekben kereshetünk, ellenőrizhetünk, cserélhetünk és feldarabolhatunk részleteket. /hu/i lesz a reguláris kifejezés, amit keresünk. Az informatikaora.hu a minta amiben keresünk. Az „i” jelzi, hogy nem különbözeti meg a kis és nagybetűket. Általános szintaxis: /pattern/modifier flags; A reguláris kifejezéseket gyakran a string metódusokkal együtt használjuk. […]
Continue Reading
A Fetch API egy modern, beépített JavaScript interfész, amelyet HTTP kérések küldésére és válaszok kezelésére használunk. Célja, hogy egyszerű, ígéreteken (Promise) alapuló megoldást nyújtson az adatok lekérésére és küldésére, a régi XMLHttpRequest helyett. Mire használjuk? alapvető szintaxis: Modernebb async/await szintaxis Példa: ingatlanok Hozz létre egy új mappát, majd nyisd meg a Visual Studio Code-ban! Legyen […]
Continue Reading
Set A JavaScript Set egy beépített adattípus, amely egyedi értékek tárolására szolgál. Nem engedi a duplikált elemeket. Az elemek sorrendje a hozzáadásuk sorrendjét követi (iterálható). Set létrehozása: const mySet = new Set([1, 2, 3]); add(value) Új elem hozzáadása a Set-hez mySet.add(4) delete(value) Elem törlése a Set-ből mySet.delete(2) has(value) Ellenőrzi, hogy az elem benne van-e mySet.has(3) […]
Continue Reading
A JavaScript dinamikusan típusos nyelv, ami azt jelenti, hogy a változó típusát nem kell előre deklarálni, és futás közben változhat. Változók típusai Egyszerű típusok Típus Leírás Példa String Szöveges adatok. let nev = „Béla”; Number Lehet egész, vagy lebegőpontos. Alapértelmezetten $64$-bites IEEE 754 lebegőpontos szám (Double). let eletkor = 70; let ar = 19.99; BigInt […]
Continue Reading
Mi az a JavaScript? Mire jó? Ha érdekel a webfejlesztés, a JavaScript az első lépés az interaktív weboldalak és alkalmazások világába! JavaScript I. 1 A JavaScript alapjai, kód beillesztése, futtatása konzolon A JavaScript alapjai, kód elhelyezési lehetőségek,változók, JS futtatása konzolon 2 Elemi és összetett adattípusok a JavaScriptben Értékadás, aritmetikai és logikai műveletek, kifejezések kiértékelése 3 […]
Continue Reading