Ismét jelentkezünk havonta megjelenő frontend témájú hírlevelünkkel, kellemes húsvéti ünnepeket kívánunk minden kedves olvasónknak!

Kezdjük egy kis webpackkel. Az utóbbi időben sokat olvashattunk a bundler-ekről, ezek közül pedig egyre inkább kiemelkedni látszik a webpack. Biztos sokakban felmerül a kérdés, hogy szükségünk van-e egyáltalán rájuk? Sokáig megvoltunk nélkülük, bonyolult a konfigurálás, régen minden jobb volt. Valószínűleg aki már eldöntötte, hogy nem fog webpacket használni, nem fogja meggyőzni egy részletes válasz arra a kérdésre, hogy Miért is használnék webpacket?, sem az, hogy mennyi mindenre alkalmas ez az eszköz a bundling-en felül.

A fejlesztők hajlamosak megfeledkezni az ARIA feature-ök használatáról, amennyiben ez nem szerepel nem funkcionális követelményként az adott projekten. Nem elég persze, hogy használjuk őket, és igyekszünk hozzáférhető HTML-t biztosítani a felhasználóknak, az is fontos, hogy megfelelően használjuk ezeket az attribútumokat. A rossz használat a tesztelés nehézségéből is fakadhat, kis utánajárással azonban a weboldal elérhetősége sokféleképpen tesztelhető.

JavaScriptből állítani az elemek formázását elég fájdalmas tud lenni (nem a CSS-in-JS koncepcióra gondolva). A CSS Object Model azonban most megváltozni látszik, a Google Chrome 66-os verziójában implementálásra kerül a CSS Typed Object Model, a Houdini effort szerint. Emellett egyébként egy hasonló, részletes cikk jelent meg a szintén a 66-os verzióban érkező aszinkron vágólap kezelésről. Ami számomra kicsit ijesztő ezzel kapcsolatban, hogy a vágólapra való íráshoz a jelenlegi tervek szerint a weboldalaknak nem fog kelleni engedélyt kérni.

Engem személy szerint az egyetem óta érdekel a mesterséges intelligencia, és annak ellenére, hogy egyelőre csak hobbi projekteken alkalmaztam bármiféle neurális hálót, szeretek a témában olvasgatni. Minden érdeklődőnek tudom ajánlani a témában az itnext cikkét a Brain.js nevű library-ről. A cikk alapszinten jól bemutatja, hogy hogyan is működik egy neurális háló, és hogy mennyire egyszerű betanítani a Brain.js segítségével. Persze elérhetőek még hasonló library-k az interneten, és ezeket össze is hasonlították már nekünk.

A harmadik féltől származó JavaScript források soha nem számítottak biztonságosnak. Nagyon nagy kockázattal jár külső szolgáltatók által megírt scripteket alkalmazni az oldalon, és minden esetben alapos körültekintést igényel egy ilyen script injektálása az oldalunkra, a biztonsági kockázatok mellett pedig performancia szempontból is sokat számít, hogy minimális számú és megbízható külső dependenciával dolgozzunk, és azokat megfelelő módon használjuk.

Nem csak a scriptek, de a harmadik féltől származó CSS-ek is komoly gondot okozhatnak, ha nem megfelelő körültekintéssel választjuk ki a harmadik felet. Bár első ránézésre nem tűnik komoly biztonsági kockázatnak külső forrásból származó CSS-t használni, hiszen - gondolhatnánk - a legrosszabb, ami történhet, hogy az oldal megjelenése nem lesz teljesen design helyes. Pedig akár jelszavak is lophatóak CSS-en keresztül, és minden interakció monitorozható - mindez JavaScript használata nélkül, így érdemes odafigyelni a külső szolgáltatók CSS fájljainak tartalmára is. (Legjobb persze, ha ezeket teljes mértékben el is tudjuk kerülni).

Senior frontendeseket keres a Virgo Systems. Jelentkezz!

Mindamellett, hogy gyakran hallani kritikákat a CSS-ről azzal kapcsolatban, hogy egy nem webfejlesztéssel foglalkozó programozó számára mennyire nehéz megérteni azt, és nyilván mindenki szeme előtt ott van a Peter Griffines redőnyös GIF, ha az alapokkal tisztában vagyunk, elég könnyen tudunk fancy dolgokat építeni a segítségével. Az itt felsorolt 30 másodperces CSS példák nagy része egészen egyszerű és gyorsan megérthető (30 másodperc), vannak köztük kifejezetten szép dolgok, amik akár egy igazi projekten is használhatóak.

CSS naming convention-ökről már sokszor írtunk, de megint bekerült egy ezzel kapcsolatos cikk: A moduláris CSS-ről olvashattatok már korábban, ha esetleg bárkiben maradt volna kérdés ezzel kapcsolatban, az valószínűleg itt választ kaphat rájuk.

Nem tudom, másnak ismerős-e a RORO nevű JavaScript pattern, nekem ez a név önmagában semmit nem mondott. A mozaikszó jelentése Receive an Object, Return an Object, és nagyjából arról szól, hogy a sok paraméteres függvények helyett használjunk olyan függvényeket, amik csak egy Objectet kapnak paraméterként, és egy Objecttel térnek vissza. Az ES2015-ben érkezett Object Destructuring-gel ötvözve ez egy nagyon jó pattern lehet a modern JavaScript fejlesztésben.

Megjelent a Node.js 8.10.0 LTS verziója, és elég sok nagyobb változást hozott magával, ezekről itt olvashattok részletesebben.

Idén is lesz AmsterdamJS konferencia. A program olvasható a weboldalon, és már kaphatóak a jegyek is, az alap áruk 380 euró, 330, hogyha több, mint négyen mennétek.

Pár hónapja írtunk a gyakori JavaScript hibákról, és azok megelőzéséről. A hónapban 5 gyakran előforduló CSS hibát láthattok, amik biztos előfordultak már a legtöbb frontend fejlesztővel, amikor elkezdett CSS-t használni.

Egy ideje tényszerű már, hogy a flash alapú weboldalak napjai meg vannak számlálva. Ezt számokkal is alátámasztotta a Google, 4 év alatt a tizedére esett vissza azon Google Chrome felhasználók száma, akik legalább egy flasht használó oldalt megnyitottak naponta.

A JavaScript regex motorja sok mindenben különbözik a többi nyelvétől, vannak hiányzó funkciók, és vannak másképpen működők. Az ES2018 szabványban bevezetésre kerül a lookbehind assertion, így több stackoverflow-ról másolt Perl regex fog működni JavaScriptben, mint eddig.

Ezzel a végére értünk a márciusi számnak, szívesen fogadjuk a visszajelzéseiteket az oldal alján található komment szekcióban.

Kellemes húsvéti ünnepeket mindenkinek, találkozunk egy hónap múlva, sziasztok!