Virgo Frontend Monthly

Issue 017

Sziasztok!

Reméljük alaposan rápihentetek a húsvétra :) Sok minden történt az elmúlt hónapban, úgyhogy nem is fecsérlem tovább a szót: dőljetek hátra (maximum scrolltávolságra), kezdünk!

Tamás

Két redesign is történt mostanában, ami felkeltette az érdeklődésemet. Az egyik a Smashing Magazine nyilvánosság előtt folyó újratervezése, és az ahhoz kapcsolódó demo site - elsőre eléggé hibaoldal feeling jött át, elég erősek az oldalakat lefedő, piros alapon fehér betűs panelek. Érdekes választás. A másik pedig kedvenc ES6 blogom, a 2ality témaválása - itt sikerült egy kicsit domainshark irányba elmennie a Doktor úrnak, dehát ő tudja. Legalább most már reszponzív.

Ha rajzból még rémlik valami a komplementer színekből, akkor a jó hír, hogy sokkal többre nem is lesz szükség a következő tutorialhoz, ahol egyetlen színből, némi matek segítségével komplett palettát lehet legyártani. Kreatív emberek persze messziről kerüljék, de nekünk, két biteseknek itt a Practical Color Theory for People Who Code.

Egy OS ablakozójának lenni elég hálátlan dolog - szerencsés esetben a userek észre sem veszik, hiszen ha minden rendben, akkor egyszerűen csak jól, kézreállóan működnek. Néha 1-2 eyecandy fícsört azért megeresztenek - ilyen pl. a macOS minimize effektje, vagy a Windows Aero címsor mögötti blur-özése, a Compizről már nem is beszélve - de mi mindenre képes a Windows 10 ablakozója a flat színek megjelenítésén kívül? Hát például ilyesmikre.

Kinek ne izzadna a tenyere, amikor meghallja, hogy a másnapi állásinterjún táblán kell kódolni a vezető fejlesztő előtt? Ha tutira akarsz menni, fusd át ezt a gyűjteményt jelentkezés előtt, hátha benne van életed következő állomása! Perverzeknek pedig íme egy demo videó a Google-nál történő interjúztatásról.

Az elmúlt hónapban ismét kaptunk új verziókat egy pár böngészőből; tovább tarol a CSS Grid, ezúttal az Operába került be, de készült hozzá egy jópofa tutorial is Grid Garden néven. Van egy érdekes új API támogatás is (ami annyira hot topic, hogy a caniuse szerint még verziókon keresztül nem fogja tudni, pedig de), a The Credential Management API. Ezzel az oprendszer jelszókezelőkét érhetjük el belépéshez - talán egy lépéssel közelebb kerültünk ezzel a megjegyezhetetlen, nem több site-on újrahasznált, teljesen random jelszavak használatához. A másik, szinte paródiába hajló feature várósdi a required és társai attribútumok támogatása volt Safariban. Nos, a több éves várakozásnak vége, a Form Validation végre megérkezett!

Pár évvel ezelőtti Atomic játékfeldolgozásomhoz még C64 emulátorról kellett grabbelni a zenét, azóta szerencsére már van Web Audio APInk a realtime SIDek generálásához. És ha API van, akkor tutorial is. És ha már zene, akkor talán itt az ideje feldobni a site-unkat egy kis metál logó captchával. Bár valószínűleg erről megoszlanak a vélemények. :)

Ezt már mind vágod?

Senior frontendeseket keres a Virgo Systems. Jelentkezz!

Ha unod a REST-et, itt egy kis frissítő, GitHub API elérése GraphQL-en keresztül. Git kommitok dekorálására pedig holnaptól mindenki gitmojikat fog használni, ugye?

PWA és AMP, a két új szupersztár, amit a Google hívott életre tavaly. Ahogy egy technológia kezd megérni, letisztulnak a tapasztalatok, és távolabbról tudjuk egy kicsit szemlélni a dolgokat. Egyre több a kritikus hang az AMP-al kapcsolatban, íme egy kis összeállítás ezekből. A PWA úgy tűnik nem ilyen megosztó - bár persze ez nem is egy from scratch valami, hanem csak egy szabványhalmaz és irányelvek összesítése. A PWA Stats egy newsfeed, erősen statisztika alapon - ha esetleg egy ügyfelet győzködni kellene :)

Vue, React, Angular, Aurelia... dolgozó méhként nem túl életszerű, hogy valaki minden friss hype-ra rá tudjon ugorni, és alaposan kiismerni. A Sitepoint cikke talán segít az alábbi összehasonlítással, hogy melyikkel kezdjük a sort.

A böngésző extensionök mintha újabb löketet kaptak volna egy pár hónappal ezelőtt - valahogy azt látom, hogy egyre több dolgot oldanak meg velük (pl. itt a PWA-tesztelésre használatos Lighthouse a Google-től). Talán köze van ennek ahhoz, hogy böngészőink egyre több mindent tudnak, ami eddig csak az asztali alkalmazások kiváltsága volt. Cross-browser extentsont írni pedig nem is olyan bonyolult, ha van hozzá egy jó tutorial.

Búcsúzóul pedig egy kis node olvasmány: debug sztorik a lövészárokból.

A nyúl legyen veletek!

Dávid

Továbbra is gőzerővel dolgozik a Facebook JavaScript frameworkjén, a React-en. A legújabb, említést érdemlő újdonság, a React Natív háza tájáról jött, a Create React Native App, amely megkönnyíti a keresztplatformos alkalmazások fejlesztését. Ez olyannyira segítség, hogy lényegében nincs szükség Android Studiora iOS app esetén Macre vagy Xcode-ra. És ha már itt járunk, elmondjuk azt is, hogy megjelent a React 15.0 is.

Todo listát minden rendes fejlesztő használ, vagy legalábbis megpróbált valamikor használni. Az biztos, hogy lassan Dunát lehet rekeszteni velük, és elég nehéz megtalálni azt, ami 100 százalékban kézre áll. A rendkívül kreatív nevü Todolist egy egészen újszerű megközelítést alkalmaz. Teljesen command line alapú, szóval abszolút devops/hacker barát szoftver. Támogatja a GTD workflowt, de természetesen nem kell ehhez ragaszkodni, úgy használja mindenki, ahogy kézre áll. A todolistát JSON formátumban tárolja, így könnyen hordozható.

A stackoverflow egykori alapítója kimerítő blogpostban ír a jelszó policykről, nem könnyű olvasmány, de érdemes kicsit elmerülni a témában, amihez találtunk egy kapcsolodó Microsoft-os anyagot is, még mélyebben, és alaposabban körüljárja ezt a fontos témát.

És ha már stackoverflow, akkor lehet böngészni az oldal szokásos éves felmérését, amit idén több mint 60 ezer fejlesztő töltött ki.

Jöjjön a heti Vue linkadag, mert nem maradhat el. IDE fronton jó hír, hogy immár a WebStorm és a Microsoft Visual Studio Code is támogatja a .vue fájlokat, jár a taps.

Ha van esetleg olyan fejlesztő ismerősünk, aki az elmúlt 10-15 évet mélyalvással töltötte, na neki jöhet jól a következő, kevesebb mint 10 perces bevezető a Modern JavaScript világába.

Megjelent az Angular 4.0, ami - ahogy általában - minden más framework új verziójánál szebb, gyorsabb és kisebb mint a korábbi. Fontos hír, hogy az Angular 4 visszamenőleg kompatibilis a 2.x.x -vel, így aki frissíteni szeretne, nem kell mindent újra írnia. És ha már térdig gázolunk a JS-ben, akkor muszáj megemlíteni az Ember.js új gyermekét, a Glimmer.js-t, ami megpróbál beszállni a kedvenc JS framework versenybe. Azt nem mondanám, hogy az Ember elkésett, hiszen ha valaki, akkor ő ott volt amikor ez egész JS fejlesztés új irányt vett, de a Glimmer-nek kőkemény dolga lesz, ha szíveket akar elrabolni a Vue-React-Angular szentháromságból.

Ami rövidebb, az nem biztos hogy jobb, és most még mindig a JavaScript a téma, senki ne piruljon. Arról van szó, hogy sokszor az ember rövidít, mert úgy gondolja, ha egyszerűbb talán gyorsabbb is. De nem mindig van így, sokszor a bővebb, emberi szem számára olvasható kód a gépnek is gyorsabban feldolgozható.

A Twittert egy ideje már böngészőból használom, pontosan nem tudnám megmondani miért. Talán így kevesebbet nyomkodom, legalábbis szeretném ezt gondolni. Így nagyon örültem amikor láttam, hogy folyamatosan reszelik, fejlesztik a mobil webes verziót. Olyannyira, hogy a mobil verzió inkább már egy Twitter Lite, egy komplett progresszív webapp, nem a desktop verzió leskálázott, egyszerűsített verziója. A készítéséhez a manapság népszerű összes frontend megoldás be lett vetve. Yarn, React, Redux, Babel, Webpack, és még sorolhatnánk. A fejlesztői blogon egy szép postban foglalják össze a Twitter Lite megszületését.

Most, hogy már lassan mindenki ismeri a Webpack-et érdemes felkavarni az elménket a Rolluppal, egy lehetséges alternatívával. Ha van 5 percünk, akkor itt egy rövid összefoglaló a két eszközről.

És a végére egy friss Internet Exploreres, akarom mondani Edge-es hír. A Microsoftnál láthatóan komolyan veszik az Edge fejlesztését, a legfrissebb, 15-ös verzióba rengeteg újdonság került bele, és már bátran lehet mondani, hogy bőven megállja a helyét a Chrome és a Firefox mellett. Nem mellesleg a Microsoftnál figyelnek arra is, hogy mit szeretnének a fejlesztők az Edge-ben látni, így például a Microsoft Edge UserVoice lista első 4 helyezetjéből egy már el is készült az Edge 15-ben (CSS Variables), a maradék háromból kettő pedig már fejlesztés alatt van.

Végszó

Találkozunk egy hónap múlva, sziasztok!