10. května ’23 | {𝐅}rontendisti

--- title: 10. května ’23 | {𝐅}rontendisti tags: frontendisti --- {%hackmd KXd2iUBpSjq7Ib2Z4h3LMg %} # {𝐅}rontendisti #### Praha, Na Věnečku 10. května ’23 příště: 14. června v [Oak’s Lab](https://www.oakslab.com/) note: - příště poslední sraz před prázdninami, Staromák, EN - možná bude letní grilovačka v srpnu (v jednání) - přihlaš svou přednášku [Call for papers AKA náležitosti na webu Frontendisti.cz](https://docs.google.com/forms/d/e/1FAIpQLSe4mba2CAA8eFSaCJtypDkAQzmVmuhSNAP7VwuOIqLj8xEySA/viewform) - v Brně nyní už půl hodiny poslední sraz u Superkoders, zdravíme, videa budou --- ## { 𝐅 } Letem swwwětem --- ## Ve wwwýhledu --- ### [Frontkon.cz](https://frontendisti.cz/konference) - čtvrtek 12. října, Brno - prvních 50 vstupenek za 790 Kč (později 1190 Kč) note: - lze se stát Podporovatelem, dostanete swag a veliké poděkování - pokud nechcete platit a přesto se zůčastnit: přihlaste přednášku do CFP --- ### [Next-Gen AI Solutions: Exploring LangChain, Web App Generation and AI Safety](https://www.meetup.com/pipedrive-talks-prague/events/293320752/) - úterý 16. května v 18.00, Pipedrive - Lukáš Havlíček (Pipedrive), Honza Sládek (Contember), Peter Hozák (aisafety.info) note: - kdo nestíhá, Peter vystoupí už dnes zde --- ## Dnes - **Lubomír Blažek** Vituum - šablonovací systémy ve Vite - **Peter Hozák** [AISafety.info](https://aisafety.info/) - How We Built a Dynamic Site with Google Docs and Coda.io note: - AGI = Artificial General Intelligence nikoli Adjusted Gross Income --- ### Webexpo - [Ondřej Žára: What´s up, Deno?](https://slideslive.cz/39000550) - [Dmitry Belyaev: You may not need CSS-in-JS](https://slideslive.com/39000535) - [Ivan Kutil: Intro into machine learning](https://slideslive.com/39000641) - [Pavel Šabatka: Server-Side: The newest website tracking concept](https://slideslive.com/39000648) - [Jan Tichý: You really wanna use Google Analytics 4! Here’s why.](https://slideslive.com/39000636) note: - Ondřej: strhující přednáška s osvěžujícím úvodem o názvech pozic v IT - Ivan: vhled do toho, jak se trénuje strojové učení - Dmitry: stylovat se dá i bez javascriptu - Pavel: nový způsob jak nakládat s měřicími kódy – vše nejprve k sobě na server a očištěná případně profiltrovaná data se pak posílají cílovým hráčům (Google, FB, Sklik). Sníží se počet požadavků, ubyde JS na stránce. Zřejmě budoucnost pro velké weby. - Honza: skvělý úvod do GA4, pokud to ještě někoho míjí, bude v obraze - a mnohé další, jsem k dispozici po přednáškách --- ## WWW minulém díle jste viděli - [Dawid Zbiński: Úvod do zpracování obrázků v JavaScriptu](https://youtu.be/w2MriiEdETo) - [Tomáš Litera: Dialog element - nevymýšlej znovu modal!](https://youtu.be/tTkZnVJzLgM) - [Petra Nulíčková: Když ptáčka lapají](https://youtu.be/KDhjQviA-qM) - [Podcast Vzhůru dolů s Petrou Nulíčkovou o HR, LinkedInu (a vývojářích)](https://www.vzhurudolu.cz/podcast/226-podcast-hr) note: - Dawid a Tomáš na srazu v Betsysu - Dawid o canvasu, kde pomocí JS vytvářel pozororuhodné efekty - Petra Nulíčková z konce listopadu, navazující podcast z letošního dubna --- ### Prohlížeče --- #### Microsoft Edge 113 _vydán 5. května 2023_ note: - Nic převratného. --- #### Firefox 113 _vydán 9. května 2023_ - matematické fce: `log()`, `pow()`, `sqrt()` aj. - zápisy pro barvy: `color()`, `lab()`, `lch()`, `oklab()`, `oklch()`, `color-mix()` - `:nth-child of <selector>` note: - dohání i predhani ostatní - ve 112 doplněny další matematické funkce (k užití v CSS funkci `calc()`) - K čemu? K tomu se dostaneme… - ve 113 barevné funkce a `nth-child` – představeno [v březnových novinkách](https://hackmd.io/@Kout/BJWtdVz0i) --- #### Chrome 113 _vydán 26. dubna 2023_ - `text-wrap: balance` ![](https://hackmd.io/_uploads/HypcKYHN2.png) note: - `text-wrap` by Kačka Voláková (React girls) zdravíme na Kanáry --- #### Chrome 113 - `image-set` - [WebGPU](https://developer.mozilla.org/en-US/docs/Web/API/WebGPU_API) note: - `image-set` výchoze, dosud s prefixem, ale ještě stále ne plná specifikace (nelze použít `calc()` v zápisu rozlišení) - WebGPU je nástupce WebGL; ostatní za flagem - výkonné vykreslování komplexní grafiky --- #### Safari 16.4 _vydáno 27. března 2023_ note: - kadence cca 1,5 měsíce, takže snad v příštích týdnech bude 16.5 - těšit se můžeme na nativní CSS nesting --- ## Zachyceno v síti --- [Color Formats in CSS](https://www.joshwcomeau.com/css/color-formats/) note: - přehled různých zápisů barev => nejen základní orientace, ale ukázky s interaktivními paletami, výhody a nevýhody různých zápisů, vč. nově nastupujícího `lch()` a `oklch()` - [140 pojmenovaných barev uspořádaných v kruhu](https://github.com/arantius/web-color-wheel) - TIL: `gray` je tmavší nežli `darkgrey` --- ### [Ana Tudor](https://www.youtube.com/@anatudor/videos) - [Termostat](https://codepen.io/thebabydino/pen/qByGqOm) - [Slide effect on scroll](https://codepen.io/thebabydino/pen/YzJPRvd) - [Hypnotická duhová spirála](https://codepen.io/thebabydino/pen/XWgRvMz) - [Obrázek na žaluziích](https://codepen.io/thebabydino/pen/MWPWXXw) - [CSS kostka](https://codepen.io/thebabydino/pen/VwByexV) - [Sourozenecká blbárna pomocí `:has()`](https://codepen.io/thebabydino/pen/LYBJxmr) - [Valící se tvary](https://codepen.io/thebabydino/pen/RwNzxN) - [Zkosená infografika](https://codepen.io/thebabydino/pen/gOdPzEK) - [Z`cos()`ené prvky](https://codepen.io/thebabydino/pen/ExePBZp) note: - minule Adam Argyle, tentokrát Ana Tudor - kouzlí v CSS za pomocí pokročilých vlastností a chytře aplikované matematiky - termostat: JS neslouzi designu - nejen kouzlí, ale nechá nahlédnout do své dílny a myšlenkových pochodů, spousty videí - ostřejší slovník odbourává akademičnost --- ## Rossum’s Universal Robots note: - v souvislosti s bouřlivým rozvojem AI jsem narazil na starší případ firmy - známější je pod zkratkou R.U.R. --- ## R.U.R. note: - pokud se kromě hraní si s AI také zamýšlíte nad dopady AI na společenost, některé související otázky řešil už před 100 lety Karel Čapek - přinejmenším prolog stojí za přečtení - existuje i komiks  --- Díky, prezentace za chvíli na [@frontendisti](https://twitter.com/frontendisti)