https:\/\/developer.chrome.com\/blog\/new-in-chrome-91\/<\/a><\/p>\n\n\n<\/p>\n","protected":false},"excerpt":{"rendered":"
W tym tygodniu mamy dla Was WebContainers, czyli Node.js w przegl\u0105darce, nowy TypeScript 4.3, Angular DevTools i kolejn\u0105 aktualizacj\u0119 Chrome.<\/p>\n","protected":false},"author":12,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"footnotes":""},"categories":[273],"tags":[],"class_list":["post-10132","post","type-post","status-publish","format-standard","hentry","category-frontend-pl"],"acf":{"weekly_summary":true,"estimated_reading_time":"6"},"yoast_head":"\n
Frontend Thursday vol. 39 - Vived<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/vived.io\/pl\/frontend-thursday-vol-39\/\" \/>\n<meta property=\"og:locale\" content=\"pl_PL\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Frontend Thursday vol. 39 - Vived\" \/>\n<meta property=\"og:description\" content=\"W tym tygodniu mamy dla Was WebContainers, czyli Node.js w przegl\u0105darce, nowy TypeScript 4.3, Angular DevTools i kolejn\u0105 aktualizacj\u0119 Chrome.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/vived.io\/pl\/frontend-thursday-vol-39\/\" \/>\n<meta property=\"og:site_name\" content=\"Vived\" \/>\n<meta property=\"article:published_time\" content=\"2021-05-27T15:00:00+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2022-09-19T11:16:42+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/vived.io\/wp-content\/uploads\/2021\/08\/img_610d099675cd4.gif\" \/>\n<meta name=\"author\" content=\"Tomasz Borowicz\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/vived.io\/pl\/frontend-thursday-vol-39\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/vived.io\/pl\/frontend-thursday-vol-39\/\"},\"author\":{\"name\":\"Tomasz Borowicz\",\"@id\":\"https:\/\/vived.io\/pl\/#\/schema\/person\/9d2a72fe7d0dfbb4092675afbab742bb\"},\"headline\":\"Frontend Thursday vol. 39\",\"datePublished\":\"2021-05-27T15:00:00+00:00\",\"dateModified\":\"2022-09-19T11:16:42+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/vived.io\/pl\/frontend-thursday-vol-39\/\"},\"wordCount\":1229,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\/\/vived.io\/pl\/#organization\"},\"image\":{\"@id\":\"https:\/\/vived.io\/pl\/frontend-thursday-vol-39\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/vived.io\/wp-content\/uploads\/2021\/08\/img_610d099675cd4.gif\",\"articleSection\":[\"Frontend\"],\"inLanguage\":\"pl-PL\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/vived.io\/pl\/frontend-thursday-vol-39\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/vived.io\/pl\/frontend-thursday-vol-39\/\",\"url\":\"https:\/\/vived.io\/pl\/frontend-thursday-vol-39\/\",\"name\":\"Frontend Thursday vol. 39 - Vived\",\"isPartOf\":{\"@id\":\"https:\/\/vived.io\/pl\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/vived.io\/pl\/frontend-thursday-vol-39\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/vived.io\/pl\/frontend-thursday-vol-39\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/vived.io\/wp-content\/uploads\/2021\/08\/img_610d099675cd4.gif\",\"datePublished\":\"2021-05-27T15:00:00+00:00\",\"dateModified\":\"2022-09-19T11:16:42+00:00\",\"breadcrumb\":{\"@id\":\"https:\/\/vived.io\/pl\/frontend-thursday-vol-39\/#breadcrumb\"},\"inLanguage\":\"pl-PL\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/vived.io\/pl\/frontend-thursday-vol-39\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"pl-PL\",\"@id\":\"https:\/\/vived.io\/pl\/frontend-thursday-vol-39\/#primaryimage\",\"url\":\"https:\/\/vived.io\/wp-content\/uploads\/2021\/08\/img_610d099675cd4.gif\",\"contentUrl\":\"https:\/\/vived.io\/wp-content\/uploads\/2021\/08\/img_610d099675cd4.gif\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/vived.io\/pl\/frontend-thursday-vol-39\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Strona g\u0142\u00f3wna\",\"item\":\"https:\/\/vived.io\/pl\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Frontend Thursday vol. 39\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/vived.io\/pl\/#website\",\"url\":\"https:\/\/vived.io\/pl\/\",\"name\":\"Vived\",\"description\":\"platform empowering IT people and technology companies to synergic growth\",\"publisher\":{\"@id\":\"https:\/\/vived.io\/pl\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/vived.io\/pl\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"pl-PL\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/vived.io\/pl\/#organization\",\"name\":\"Vived\",\"url\":\"https:\/\/vived.io\/pl\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"pl-PL\",\"@id\":\"https:\/\/vived.io\/pl\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/vived.io\/wp-content\/uploads\/2020\/03\/logo_vived_color.png\",\"contentUrl\":\"https:\/\/vived.io\/wp-content\/uploads\/2020\/03\/logo_vived_color.png\",\"width\":136,\"height\":45,\"caption\":\"Vived\"},\"image\":{\"@id\":\"https:\/\/vived.io\/pl\/#\/schema\/logo\/image\/\"}},{\"@type\":\"Person\",\"@id\":\"https:\/\/vived.io\/pl\/#\/schema\/person\/9d2a72fe7d0dfbb4092675afbab742bb\",\"name\":\"Tomasz Borowicz\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"pl-PL\",\"@id\":\"https:\/\/vived.io\/pl\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/804536d2672538508d43f60ad2108e5aaea76c192653eaf95d4c3934b7d1dbb6?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/804536d2672538508d43f60ad2108e5aaea76c192653eaf95d4c3934b7d1dbb6?s=96&d=mm&r=g\",\"caption\":\"Tomasz Borowicz\"}}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Frontend Thursday vol. 39 - Vived","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/vived.io\/pl\/frontend-thursday-vol-39\/","og_locale":"pl_PL","og_type":"article","og_title":"Frontend Thursday vol. 39 - Vived","og_description":"W tym tygodniu mamy dla Was WebContainers, czyli Node.js w przegl\u0105darce, nowy TypeScript 4.3, Angular DevTools i kolejn\u0105 aktualizacj\u0119 Chrome.","og_url":"https:\/\/vived.io\/pl\/frontend-thursday-vol-39\/","og_site_name":"Vived","article_published_time":"2021-05-27T15:00:00+00:00","article_modified_time":"2022-09-19T11:16:42+00:00","og_image":[{"url":"https:\/\/vived.io\/wp-content\/uploads\/2021\/08\/img_610d099675cd4.gif","type":"","width":"","height":""}],"author":"Tomasz Borowicz","twitter_card":"summary_large_image","schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/vived.io\/pl\/frontend-thursday-vol-39\/#article","isPartOf":{"@id":"https:\/\/vived.io\/pl\/frontend-thursday-vol-39\/"},"author":{"name":"Tomasz Borowicz","@id":"https:\/\/vived.io\/pl\/#\/schema\/person\/9d2a72fe7d0dfbb4092675afbab742bb"},"headline":"Frontend Thursday vol. 39","datePublished":"2021-05-27T15:00:00+00:00","dateModified":"2022-09-19T11:16:42+00:00","mainEntityOfPage":{"@id":"https:\/\/vived.io\/pl\/frontend-thursday-vol-39\/"},"wordCount":1229,"commentCount":0,"publisher":{"@id":"https:\/\/vived.io\/pl\/#organization"},"image":{"@id":"https:\/\/vived.io\/pl\/frontend-thursday-vol-39\/#primaryimage"},"thumbnailUrl":"https:\/\/vived.io\/wp-content\/uploads\/2021\/08\/img_610d099675cd4.gif","articleSection":["Frontend"],"inLanguage":"pl-PL","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/vived.io\/pl\/frontend-thursday-vol-39\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/vived.io\/pl\/frontend-thursday-vol-39\/","url":"https:\/\/vived.io\/pl\/frontend-thursday-vol-39\/","name":"Frontend Thursday vol. 39 - Vived","isPartOf":{"@id":"https:\/\/vived.io\/pl\/#website"},"primaryImageOfPage":{"@id":"https:\/\/vived.io\/pl\/frontend-thursday-vol-39\/#primaryimage"},"image":{"@id":"https:\/\/vived.io\/pl\/frontend-thursday-vol-39\/#primaryimage"},"thumbnailUrl":"https:\/\/vived.io\/wp-content\/uploads\/2021\/08\/img_610d099675cd4.gif","datePublished":"2021-05-27T15:00:00+00:00","dateModified":"2022-09-19T11:16:42+00:00","breadcrumb":{"@id":"https:\/\/vived.io\/pl\/frontend-thursday-vol-39\/#breadcrumb"},"inLanguage":"pl-PL","potentialAction":[{"@type":"ReadAction","target":["https:\/\/vived.io\/pl\/frontend-thursday-vol-39\/"]}]},{"@type":"ImageObject","inLanguage":"pl-PL","@id":"https:\/\/vived.io\/pl\/frontend-thursday-vol-39\/#primaryimage","url":"https:\/\/vived.io\/wp-content\/uploads\/2021\/08\/img_610d099675cd4.gif","contentUrl":"https:\/\/vived.io\/wp-content\/uploads\/2021\/08\/img_610d099675cd4.gif"},{"@type":"BreadcrumbList","@id":"https:\/\/vived.io\/pl\/frontend-thursday-vol-39\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Strona g\u0142\u00f3wna","item":"https:\/\/vived.io\/pl\/"},{"@type":"ListItem","position":2,"name":"Frontend Thursday vol. 39"}]},{"@type":"WebSite","@id":"https:\/\/vived.io\/pl\/#website","url":"https:\/\/vived.io\/pl\/","name":"Vived","description":"platform empowering IT people and technology companies to synergic growth","publisher":{"@id":"https:\/\/vived.io\/pl\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/vived.io\/pl\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"pl-PL"},{"@type":"Organization","@id":"https:\/\/vived.io\/pl\/#organization","name":"Vived","url":"https:\/\/vived.io\/pl\/","logo":{"@type":"ImageObject","inLanguage":"pl-PL","@id":"https:\/\/vived.io\/pl\/#\/schema\/logo\/image\/","url":"https:\/\/vived.io\/wp-content\/uploads\/2020\/03\/logo_vived_color.png","contentUrl":"https:\/\/vived.io\/wp-content\/uploads\/2020\/03\/logo_vived_color.png","width":136,"height":45,"caption":"Vived"},"image":{"@id":"https:\/\/vived.io\/pl\/#\/schema\/logo\/image\/"}},{"@type":"Person","@id":"https:\/\/vived.io\/pl\/#\/schema\/person\/9d2a72fe7d0dfbb4092675afbab742bb","name":"Tomasz Borowicz","image":{"@type":"ImageObject","inLanguage":"pl-PL","@id":"https:\/\/vived.io\/pl\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/804536d2672538508d43f60ad2108e5aaea76c192653eaf95d4c3934b7d1dbb6?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/804536d2672538508d43f60ad2108e5aaea76c192653eaf95d4c3934b7d1dbb6?s=96&d=mm&r=g","caption":"Tomasz Borowicz"}}]}},"blocks_vived":[{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"<h1 id=\"1-webcontainers-czyli-nodejs-natywnie-w-przegl%C4%85darce\">1. WebContainers, czyli Node.js natywnie w przegl\u0105darce<\/h1>\n<p>StackBlitz od jakiego\u015b czasu zapowiada\u0142, \u017ce na Google I\/O poka\u017ce co\u015b du\u017cego, nad czym pracowali od dawna. Nikt nie spodziewa\u0142 si\u0119 jednak, \u017ce b\u0119dzie to najciekawsze og\u0142oszenie dotycz\u0105ce JavaScriptu na ca\u0142ej konferencji. O WebContainers hucza\u0142 w zesz\u0142ym tygodniu ca\u0142y internet (albo przynajmniej ba\u0144ka, w kt\u00f3rej ja si\u0119 obracam). Je\u015bli jeszcze o nich nie s\u0142yszeli\u015bcie, to zaraz przybli\u017c\u0119 Wam og\u00f3ln\u0105 koncepcj\u0119 i powiem, dlaczego nie podzielam wszechobecnej ekscytacji.<\/p>\n<p>WebAssembly to pot\u0119\u017cne narz\u0119dzie i zesp\u00f3\u0142 StackBlitz postanowi\u0142 wykorzysta\u0107 je do stworzenia \u015brodowiska uruchomieniowego Node.js. Oczywi\u015bcie samo dzia\u0142aj\u0105ce w przegl\u0105darce \u015brodowisko uruchomieniowe to nie wszystko i aby uwolni\u0107 pe\u0142ny potencja\u0142 Node.js trzeba zapewni\u0107 poprawne dzia\u0142anie integracji z systemem operacyjnym. Na tym polu nie jest idealnie, ale trzeba przyzna\u0107, \u017ce uda\u0142o si\u0119 dowie\u015b\u0107 ca\u0142kiem sporo (np. emulacja fs jest mo\u017cliwa dzi\u0119ki wykorzystaniu <a href=\"https:\/\/web.dev\/file-system-access\/\">File System Access API<\/a>). Wiemy ju\u017c jak to mo\u017cliwe, \u017ce Node dzia\u0142a w przegl\u0105darce, ale jak si\u0119 z nim po\u0142\u0105czy\u0107? Tutaj do gry wchodzi ServiceWorker, kt\u00f3ry przechwytuje odpowiednie requesty i przekierowuje je do naszego WebContainer. Obecno\u015b\u0107 ServiceWorkera zapewnia r\u00f3wnie\u017c, \u017ce ca\u0142o\u015b\u0107 rozwi\u0105zania mo\u017ce dzia\u0142a\u0107 w 100% offline.<\/p>\n<p>Architektura wygl\u0105da ciekawie, ale po co to wszystko? To co najbardziej ze mn\u0105 rezonuje, to pi\u0119ciokrotne przy\u015bpieszenie czasu instalacji dependencji i bezpiecze\u0144stwo ca\u0142ego rozwi\u0105zania (nie od dzi\u015b wiadomo, \u017ce przegl\u0105darki d\u0105\u017c\u0105 do stworzenia jak najbezpieczniejszego i najbardziej odizolowanego SandBoxa). StackBlitz sta\u0142 si\u0119 w\u0142a\u015bnie idealnym narz\u0119dziem do przygotowania minimalnej reprodukcji Buga i podes\u0142ania go na StackOverflow, gdzie osoby chc\u0105ce pom\u00f3c b\u0119d\u0105 w stanie bardzo szybko i bezpiecznie wskoczy\u0107 w nasz kod.<\/p>\n<figure class=\"kg-card kg-image-card\"><img class=\"kg-image aligncenter\" src=\"https:\/\/vived.io\/wp-content\/uploads\/2021\/08\/img_610d099675cd4.gif\" alt=\"\" \/><\/figure>\n<p>Co budzi moje w\u0105tpliwo\u015bci w ca\u0142ym tym zamieszaniu? WebContainers (czasami w pokr\u0119tny spos\u00f3b) emuluj\u0105 wiele systemowych metod, co spokojnie mo\u017ce doprowadzi\u0107 do r\u00f3\u017cnic w zachowaniu mi\u0119dzy wersj\u0105 odpalon\u0105 w przegl\u0105darce i lokalnie. Kolejny mankament to wspierane przegl\u0105darki. Na ten moment WebContainers dzia\u0142aj\u0105 tylko w silnikach opartych na Chromium, wi\u0119c nie u\u015bwiadczymy ich chocia\u017cby na mobilnych urz\u0105dzeniach z jab\u0142uszkiem czy w Firefox (co mo\u017ce bole\u0107 podw\u00f3jnie, bo to w\u0142a\u015bnie Mozilla utrzymuje zdaniem wielu najlepszy silnik WASM). Opr\u00f3cz tego lista wspieranych framework\u00f3w jest raczej kr\u00f3tka (aczkolwiek trzeba przyzna\u0107, \u017ce zawiera chyba wszystkie najpopularniejsze opcje): Express.js, Koa, NestJS, Next.js, Nuxt.<\/p>\n<figure class=\"kg-card kg-image-card kg-card-hascaption\"><img class=\"kg-image aligncenter\" src=\"https:\/\/vived.io\/wp-content\/uploads\/2021\/08\/img_610d099865c5a.gif\" alt=\"\" \/>\n<figcaption>Deweloper widz\u0105c list\u0119 przegl\u0105darek na kt\u00f3rych dzia\u0142aj\u0105 WebContainers - 2021 koloryzowane<\/figcaption>\n<\/figure>\n<p>Na koniec zostawi\u0142em sobie gw\u00f3\u017ad\u017a do trumny. Z poziomu WebContainers nie po\u0142\u0105czymy si\u0119 z baz\u0105 danych, bo przegl\u0105darki nie mog\u0105 komunikowa\u0107 si\u0119 za pomoc\u0105 niestandardowych protoko\u0142\u00f3w (tutaj zesp\u00f3\u0142 StackBlitz liczy na pojawienie si\u0119 w przegl\u0105darkach <a href=\"https:\/\/bugs.chromium.org\/p\/chromium\/issues\/detail?id=909927&can=2&q=proj-fugu&sort=pri&colspec=ID%20Pri%20M%20Stars%20ReleaseBlock%20Component%20Status%20Owner%20Summary%20OS%20Modified&x=m&y=releaseblock&cells=ids\">Native Sockets<\/a>, ale na razie nie wiadomo, czy i kiedy mo\u017cemy si\u0119 ich spodziewa\u0107). Brak tej funkcjonalno\u015bci wykluczy\u0142 prawdopodobnie wi\u0119kszo\u015b\u0107 backend\u00f3w z tego narz\u0119dzia. Je\u015bli WebContainers aspiruj\u0105 do zostania domy\u015blnym \u015brodowiskiem deweloperskim to przed nimi jeszcze d\u0142uga droga, ale jak na wersj\u0119 beta to jest naprawd\u0119 nie\u017ale.<\/p>\n<h3 id=\"%C5%BAr%C3%B3d%C5%82a\">\u0179r\u00f3d\u0142a:<\/h3>\n<p><a href=\"https:\/\/blog.stackblitz.com\/posts\/introducing-webcontainers\/\">https:\/\/blog.stackblitz.com\/posts\/introducing-webcontainers\/<\/a><br \/><a href=\"https:\/\/twitter.com\/stackblitz\/status\/1395409316270772224\">https:\/\/twitter.com\/stackblitz\/status\/1395409316270772224<\/a><\/p>\n<h1 id=\"2-typescript-43\">2. Typescript 4.3<\/h1>\n<p>O TypeScript 4.3 mogli\u015bcie przeczyta\u0107 ju\u017c przy okazji Bety i Release Candidate, ale ja obieca\u0142em sobie, \u017ce nie b\u0119d\u0119 Wam zawraca\u0142 g\u0142owy dop\u00f3ki nie pojawi si\u0119 wersja stabilna. W tym tygodniu wreszcie si\u0119 doczeka\u0142em i nowy TypeScript zosta\u0142 opublikowany. Mamy tutaj do czynienia z kolejn\u0105 wersj\u0105 minor, wi\u0119c nie powinni\u015bmy oczekiwa\u0107 cud\u00f3w, ale mimo wszystko Microsoft wcisn\u0105\u0142 tu kilka ciekawych usprawnie\u0144.<\/p>\n<p>Jak dla mnie najciekawsz\u0105 nowo\u015bci\u0105 jest dodanie s\u0142owa kluczowego override, kt\u00f3re nie tylko uchroni nas przed liter\u00f3wkami, ale te\u017c pomo\u017ce przy refactorowaniu kodu (je\u015bli zmienimy nazw\u0119 metody tylko w klasie bazowej, to metoda w klasie dziedzicz\u0105cej oznaczona jako override spowoduje pojawienie si\u0119 b\u0142\u0119du kompilacji). Wraz z nowym s\u0142owem kluczowym dochodzi te\u017c nowa flaga `--noImplicitOverride`. Pozwala ona wymusi\u0107 dodawanie nowego s\u0142owa kluczowego tam, gdzie rzeczywi\u015bcie nadpisujemy jak\u0105\u015b metod\u0119.<\/p>\n<pre><code class=\"language-TypeScript\">class SomeComponent {\n show() {\n \t\/\/ ...\n }\n hide() {\n \t\/\/ ...\n }\n}\nclass SpecializedComponent extends SomeComponent {\n override show() {\n \/\/ ...\n }\n override hide() {\n \/\/ ...\n }\n}<\/code><\/pre>\n<p>Druga ciekawa zmiana to rozdzielenie typ\u00f3w setter\u00f3w i getter\u00f3w, co ma pozwoli\u0107 na wygodn\u0105 konwersj\u0119 typ\u00f3w w setterach. Jedynym ograniczeniem jest tu wyst\u0105pienie typu z gettera w setterze. Je\u015bli brzmi to dla Was mgli\u015bcie, to zerknijcie na snippet poni\u017cej.<\/p>\n<pre><code class=\"language-TypeScript\">class Thing {\n\t#size = 0;\n get size(): number {\n \treturn this.#size;\n }\n set size(value: string | number | boolean) {\n let num = Number(value);\n \/\/ Don't allow NaN and stuff.\n if (!Number.isFinite(num)) {\n \tthis.#size = 0;\n \treturn;\n }\n this.#size = num;\n }\n}\nlet thing = new Thing();\n\/\/ Assigning other types to `thing.size` works!\nthing.size = \"hello\";\nthing.size = true;\nthing.size = 42;\n\/\/ Reading `thing.size` always produces a number!\nlet mySize: number = thing.size;<\/code><\/pre>\n<p>Oczywi\u015bcie nie jest to koniec zmian. Nowa wersja dostarcza usprawnienia do string literals znanych z TypeScript 4.1, rozszerza list\u0119 element\u00f3w w klasie, kt\u00f3re mog\u0105 zosta\u0107 oznaczone jako prywatne, czy ulepsza wnioskowanie typ\u00f3w generycznych. Je\u015bli jeste\u015bcie ciekawi szczeg\u00f3\u0142\u00f3w, to zach\u0119cam do przeczytania podlinkowanego poni\u017cej artyku\u0142u bo Microsoft, jak zwykle w swoich release notesach, trzyma poziom.<\/p>\n<h3 id=\"%C5%BAr%C3%B3d%C5%82a-1\">\u0179r\u00f3d\u0142a:<\/h3>\n<p><a href=\"https:\/\/devblogs.microsoft.com\/typescript\/announcing-typescript-4-3\/\">https:\/\/devblogs.microsoft.com\/typescript\/announcing-typescript-4-3\/<\/a><\/p>\n<h1 id=\"3-angular-devtoos\">3. Angular DevToos<\/h1>\n<p>Je\u015bli kiedy\u015b musieli\u015bcie debugowa\u0107 zaawansowan\u0105 angularow\u0105 aplikacj\u0119, to prawdopodobnie kojarzycie wtyczk\u0119 Augry, umo\u017cliwiaj\u0105c\u0105 zaawansowane debugowanie drzewa komponent\u00f3w. W tym tygodniu zyska\u0142a ona powa\u017cnego konkurenta, bo Google og\u0142osi\u0142o powstanie Angular DevTools, kt\u00f3re ju\u017c na starcie posiada wszystko, co posiada\u0142 Augry i nawet odrobin\u0119 wi\u0119cej. Jest tu wi\u0119c mo\u017cliwo\u015b\u0107 podgl\u0105dania drzewa komponent\u00f3w, wybierania komponentu kursorem czy mo\u017cliwo\u015b\u0107 edycji parametr\u00f3w wej\u015bciowych komponent\u00f3w. Ponadto, ciekawie wygl\u0105daj\u0105 opcje profilowania, kt\u00f3re umo\u017cliwiaj\u0105 podejrzenie czas\u00f3w ChangeDetection czy renderowania poszczeg\u00f3lnych komponent\u00f3w.<\/p>\n<p>Je\u015bli wsp\u00f3\u0142praca mi\u0119dzy zespo\u0142em odpowiedzialnym za samego Angulara i Angular DevTools b\u0119dzie przebiega\u0142a sprawnie, to my\u015bl\u0119, \u017ce mo\u017cemy spokojnie po\u017cegna\u0107 si\u0119 z Augry. Mam nadziej\u0119, \u017ce taka symbioza sprawi, \u017ce nowe wersje Angulara b\u0119d\u0105 wspierane od dnia zero, a wsparcie dla starszych nie b\u0119dzie stanowi\u0142o problemu (w przesz\u0142o\u015bci mia\u0142em takie problemy z Augry). Ponadto, po cichu licz\u0119 troch\u0119 na to, \u017ce kolejne iteracje nad Angular DevTools pozwol\u0105 nam lepiej analizowa\u0107, to co dzieje si\u0119 wewn\u0105trz Angulara i dzi\u0119ki temu jeszcze lepiej optymalizowa\u0107 nasze aplikacje.<\/p>\n<figure class=\"kg-card kg-image-card kg-card-hascaption\"><img class=\"kg-image aligncenter\" src=\"https:\/\/vived.io\/wp-content\/uploads\/2021\/08\/img_610d099a0b331.gif\" alt=\"\" \/>\n<p>\u00a0<\/p>\n<figcaption>Unikalne nagranie przedstawiaj\u0105ce przysz\u0142o\u015b\u0107 Augry<\/figcaption>\n<\/figure>\n<h3 id=\"%C5%BAr%C3%B3d%C5%82a-2\">\u0179r\u00f3d\u0142a:<\/h3>\n<p><a href=\"https:\/\/angular.io\/guide\/devtools\">https:\/\/angular.io\/guide\/devtools<\/a><br \/><a href=\"https:\/\/www.youtube.com\/watch?v=d1SJL51FFxQ\">https:\/\/www.youtube.com\/watch?v=d1SJL51FFxQ<\/a><\/p>\n<h1 id=\"4-chrome-91\">4. Chrome 91<\/h1>\n<p>Na zako\u0144czenie mam dla Was pojawienie si\u0119 nowego Chrome\u2019a oznaczonego numerem 91. Co prawda lista nowo\u015bci jest kr\u00f3tka, ale zdecydowanie jest ona konkretna. Do `showSaveFilePicker` dodano parametr `suggestedName`, a do `showOpenFilePicker` parameter `startIn`. Umo\u017cliwiaj\u0105 one odpowiednio nadanie domy\u015blnej nazwy pliku do zapisu i wybranie domy\u015blnego katalogu do kt\u00f3rego u\u017cytkownik zostanie przeniesiony przy wyborze pliku do otwarcie. To nie koniec zmian dotycz\u0105cych interakcji z plikami, bo w Chrome wreszcie pojawia si\u0119 te\u017c zana z Safari mo\u017cliwo\u015b\u0107 wklejenia pliku skopiowanego do schowka. Niby ma\u0142e rzeczy, a sumarycznie mog\u0105 mocno ulepszy\u0107 do\u015bwiadczenia u\u017cytkownika.<\/p>\n<p>Opr\u00f3cz powy\u017cszych zmian ciekawie wygl\u0105da te\u017c mo\u017cliwo\u015b\u0107 oznaczenia stron, mi\u0119dzy kt\u00f3rymi wsp\u00f3\u0142dzielone powinno by\u0107 sugerowanie hase\u0142. Odpowiednia konfiguracja wymaga troch\u0119 pracy (wymagane jest stworzenie pliku assertlinks.json i dodanie go do .well-known), ale z \u0142atwo\u015bci\u0105 przychodz\u0105 mi do g\u0142owy aplikacje, w kt\u00f3rych takiej opcji mi brakowa\u0142o.<\/p>\n<figure class=\"kg-card kg-image-card kg-card-hascaption\"><img class=\"kg-image aligncenter\" src=\"https:\/\/vived.io\/wp-content\/uploads\/2021\/08\/img_610d099a850e1.gif\" alt=\"\" \/>\n<p>\u00a0<\/p>\n<figcaption>Na zako\u0144czenie standardowy mem o Chrome na odwr\u00f3cenie uwagi<\/figcaption>\n<\/figure>\n<h3 id=\"%C5%BAr%C3%B3d%C5%82a-3\">\u0179r\u00f3d\u0142a:<\/h3>\n<p><a href=\"https:\/\/developer.chrome.com\/blog\/new-in-chrome-91\/\">https:\/\/developer.chrome.com\/blog\/new-in-chrome-91\/<\/a><\/p>\n\n","innerContent":["<h1 id=\"1-webcontainers-czyli-nodejs-natywnie-w-przegl%C4%85darce\">1. WebContainers, czyli Node.js natywnie w przegl\u0105darce<\/h1>\n<p>StackBlitz od jakiego\u015b czasu zapowiada\u0142, \u017ce na Google I\/O poka\u017ce co\u015b du\u017cego, nad czym pracowali od dawna. Nikt nie spodziewa\u0142 si\u0119 jednak, \u017ce b\u0119dzie to najciekawsze og\u0142oszenie dotycz\u0105ce JavaScriptu na ca\u0142ej konferencji. O WebContainers hucza\u0142 w zesz\u0142ym tygodniu ca\u0142y internet (albo przynajmniej ba\u0144ka, w kt\u00f3rej ja si\u0119 obracam). Je\u015bli jeszcze o nich nie s\u0142yszeli\u015bcie, to zaraz przybli\u017c\u0119 Wam og\u00f3ln\u0105 koncepcj\u0119 i powiem, dlaczego nie podzielam wszechobecnej ekscytacji.<\/p>\n<p>WebAssembly to pot\u0119\u017cne narz\u0119dzie i zesp\u00f3\u0142 StackBlitz postanowi\u0142 wykorzysta\u0107 je do stworzenia \u015brodowiska uruchomieniowego Node.js. Oczywi\u015bcie samo dzia\u0142aj\u0105ce w przegl\u0105darce \u015brodowisko uruchomieniowe to nie wszystko i aby uwolni\u0107 pe\u0142ny potencja\u0142 Node.js trzeba zapewni\u0107 poprawne dzia\u0142anie integracji z systemem operacyjnym. Na tym polu nie jest idealnie, ale trzeba przyzna\u0107, \u017ce uda\u0142o si\u0119 dowie\u015b\u0107 ca\u0142kiem sporo (np. emulacja fs jest mo\u017cliwa dzi\u0119ki wykorzystaniu <a href=\"https:\/\/web.dev\/file-system-access\/\">File System Access API<\/a>). Wiemy ju\u017c jak to mo\u017cliwe, \u017ce Node dzia\u0142a w przegl\u0105darce, ale jak si\u0119 z nim po\u0142\u0105czy\u0107? Tutaj do gry wchodzi ServiceWorker, kt\u00f3ry przechwytuje odpowiednie requesty i przekierowuje je do naszego WebContainer. Obecno\u015b\u0107 ServiceWorkera zapewnia r\u00f3wnie\u017c, \u017ce ca\u0142o\u015b\u0107 rozwi\u0105zania mo\u017ce dzia\u0142a\u0107 w 100% offline.<\/p>\n<p>Architektura wygl\u0105da ciekawie, ale po co to wszystko? To co najbardziej ze mn\u0105 rezonuje, to pi\u0119ciokrotne przy\u015bpieszenie czasu instalacji dependencji i bezpiecze\u0144stwo ca\u0142ego rozwi\u0105zania (nie od dzi\u015b wiadomo, \u017ce przegl\u0105darki d\u0105\u017c\u0105 do stworzenia jak najbezpieczniejszego i najbardziej odizolowanego SandBoxa). StackBlitz sta\u0142 si\u0119 w\u0142a\u015bnie idealnym narz\u0119dziem do przygotowania minimalnej reprodukcji Buga i podes\u0142ania go na StackOverflow, gdzie osoby chc\u0105ce pom\u00f3c b\u0119d\u0105 w stanie bardzo szybko i bezpiecznie wskoczy\u0107 w nasz kod.<\/p>\n<figure class=\"kg-card kg-image-card\"><img class=\"kg-image aligncenter\" src=\"https:\/\/vived.io\/wp-content\/uploads\/2021\/08\/img_610d099675cd4.gif\" alt=\"\" \/><\/figure>\n<p>Co budzi moje w\u0105tpliwo\u015bci w ca\u0142ym tym zamieszaniu? WebContainers (czasami w pokr\u0119tny spos\u00f3b) emuluj\u0105 wiele systemowych metod, co spokojnie mo\u017ce doprowadzi\u0107 do r\u00f3\u017cnic w zachowaniu mi\u0119dzy wersj\u0105 odpalon\u0105 w przegl\u0105darce i lokalnie. Kolejny mankament to wspierane przegl\u0105darki. Na ten moment WebContainers dzia\u0142aj\u0105 tylko w silnikach opartych na Chromium, wi\u0119c nie u\u015bwiadczymy ich chocia\u017cby na mobilnych urz\u0105dzeniach z jab\u0142uszkiem czy w Firefox (co mo\u017ce bole\u0107 podw\u00f3jnie, bo to w\u0142a\u015bnie Mozilla utrzymuje zdaniem wielu najlepszy silnik WASM). Opr\u00f3cz tego lista wspieranych framework\u00f3w jest raczej kr\u00f3tka (aczkolwiek trzeba przyzna\u0107, \u017ce zawiera chyba wszystkie najpopularniejsze opcje): Express.js, Koa, NestJS, Next.js, Nuxt.<\/p>\n<figure class=\"kg-card kg-image-card kg-card-hascaption\"><img class=\"kg-image aligncenter\" src=\"https:\/\/vived.io\/wp-content\/uploads\/2021\/08\/img_610d099865c5a.gif\" alt=\"\" \/>\n<figcaption>Deweloper widz\u0105c list\u0119 przegl\u0105darek na kt\u00f3rych dzia\u0142aj\u0105 WebContainers - 2021 koloryzowane<\/figcaption>\n<\/figure>\n<p>Na koniec zostawi\u0142em sobie gw\u00f3\u017ad\u017a do trumny. Z poziomu WebContainers nie po\u0142\u0105czymy si\u0119 z baz\u0105 danych, bo przegl\u0105darki nie mog\u0105 komunikowa\u0107 si\u0119 za pomoc\u0105 niestandardowych protoko\u0142\u00f3w (tutaj zesp\u00f3\u0142 StackBlitz liczy na pojawienie si\u0119 w przegl\u0105darkach <a href=\"https:\/\/bugs.chromium.org\/p\/chromium\/issues\/detail?id=909927&can=2&q=proj-fugu&sort=pri&colspec=ID%20Pri%20M%20Stars%20ReleaseBlock%20Component%20Status%20Owner%20Summary%20OS%20Modified&x=m&y=releaseblock&cells=ids\">Native Sockets<\/a>, ale na razie nie wiadomo, czy i kiedy mo\u017cemy si\u0119 ich spodziewa\u0107). Brak tej funkcjonalno\u015bci wykluczy\u0142 prawdopodobnie wi\u0119kszo\u015b\u0107 backend\u00f3w z tego narz\u0119dzia. Je\u015bli WebContainers aspiruj\u0105 do zostania domy\u015blnym \u015brodowiskiem deweloperskim to przed nimi jeszcze d\u0142uga droga, ale jak na wersj\u0119 beta to jest naprawd\u0119 nie\u017ale.<\/p>\n<h3 id=\"%C5%BAr%C3%B3d%C5%82a\">\u0179r\u00f3d\u0142a:<\/h3>\n<p><a href=\"https:\/\/blog.stackblitz.com\/posts\/introducing-webcontainers\/\">https:\/\/blog.stackblitz.com\/posts\/introducing-webcontainers\/<\/a><br \/><a href=\"https:\/\/twitter.com\/stackblitz\/status\/1395409316270772224\">https:\/\/twitter.com\/stackblitz\/status\/1395409316270772224<\/a><\/p>\n<h1 id=\"2-typescript-43\">2. Typescript 4.3<\/h1>\n<p>O TypeScript 4.3 mogli\u015bcie przeczyta\u0107 ju\u017c przy okazji Bety i Release Candidate, ale ja obieca\u0142em sobie, \u017ce nie b\u0119d\u0119 Wam zawraca\u0142 g\u0142owy dop\u00f3ki nie pojawi si\u0119 wersja stabilna. W tym tygodniu wreszcie si\u0119 doczeka\u0142em i nowy TypeScript zosta\u0142 opublikowany. Mamy tutaj do czynienia z kolejn\u0105 wersj\u0105 minor, wi\u0119c nie powinni\u015bmy oczekiwa\u0107 cud\u00f3w, ale mimo wszystko Microsoft wcisn\u0105\u0142 tu kilka ciekawych usprawnie\u0144.<\/p>\n<p>Jak dla mnie najciekawsz\u0105 nowo\u015bci\u0105 jest dodanie s\u0142owa kluczowego override, kt\u00f3re nie tylko uchroni nas przed liter\u00f3wkami, ale te\u017c pomo\u017ce przy refactorowaniu kodu (je\u015bli zmienimy nazw\u0119 metody tylko w klasie bazowej, to metoda w klasie dziedzicz\u0105cej oznaczona jako override spowoduje pojawienie si\u0119 b\u0142\u0119du kompilacji). Wraz z nowym s\u0142owem kluczowym dochodzi te\u017c nowa flaga `--noImplicitOverride`. Pozwala ona wymusi\u0107 dodawanie nowego s\u0142owa kluczowego tam, gdzie rzeczywi\u015bcie nadpisujemy jak\u0105\u015b metod\u0119.<\/p>\n<pre><code class=\"language-TypeScript\">class SomeComponent {\n show() {\n \t\/\/ ...\n }\n hide() {\n \t\/\/ ...\n }\n}\nclass SpecializedComponent extends SomeComponent {\n override show() {\n \/\/ ...\n }\n override hide() {\n \/\/ ...\n }\n}<\/code><\/pre>\n<p>Druga ciekawa zmiana to rozdzielenie typ\u00f3w setter\u00f3w i getter\u00f3w, co ma pozwoli\u0107 na wygodn\u0105 konwersj\u0119 typ\u00f3w w setterach. Jedynym ograniczeniem jest tu wyst\u0105pienie typu z gettera w setterze. Je\u015bli brzmi to dla Was mgli\u015bcie, to zerknijcie na snippet poni\u017cej.<\/p>\n<pre><code class=\"language-TypeScript\">class Thing {\n\t#size = 0;\n get size(): number {\n \treturn this.#size;\n }\n set size(value: string | number | boolean) {\n let num = Number(value);\n \/\/ Don't allow NaN and stuff.\n if (!Number.isFinite(num)) {\n \tthis.#size = 0;\n \treturn;\n }\n this.#size = num;\n }\n}\nlet thing = new Thing();\n\/\/ Assigning other types to `thing.size` works!\nthing.size = \"hello\";\nthing.size = true;\nthing.size = 42;\n\/\/ Reading `thing.size` always produces a number!\nlet mySize: number = thing.size;<\/code><\/pre>\n<p>Oczywi\u015bcie nie jest to koniec zmian. Nowa wersja dostarcza usprawnienia do string literals znanych z TypeScript 4.1, rozszerza list\u0119 element\u00f3w w klasie, kt\u00f3re mog\u0105 zosta\u0107 oznaczone jako prywatne, czy ulepsza wnioskowanie typ\u00f3w generycznych. Je\u015bli jeste\u015bcie ciekawi szczeg\u00f3\u0142\u00f3w, to zach\u0119cam do przeczytania podlinkowanego poni\u017cej artyku\u0142u bo Microsoft, jak zwykle w swoich release notesach, trzyma poziom.<\/p>\n<h3 id=\"%C5%BAr%C3%B3d%C5%82a-1\">\u0179r\u00f3d\u0142a:<\/h3>\n<p><a href=\"https:\/\/devblogs.microsoft.com\/typescript\/announcing-typescript-4-3\/\">https:\/\/devblogs.microsoft.com\/typescript\/announcing-typescript-4-3\/<\/a><\/p>\n<h1 id=\"3-angular-devtoos\">3. Angular DevToos<\/h1>\n<p>Je\u015bli kiedy\u015b musieli\u015bcie debugowa\u0107 zaawansowan\u0105 angularow\u0105 aplikacj\u0119, to prawdopodobnie kojarzycie wtyczk\u0119 Augry, umo\u017cliwiaj\u0105c\u0105 zaawansowane debugowanie drzewa komponent\u00f3w. W tym tygodniu zyska\u0142a ona powa\u017cnego konkurenta, bo Google og\u0142osi\u0142o powstanie Angular DevTools, kt\u00f3re ju\u017c na starcie posiada wszystko, co posiada\u0142 Augry i nawet odrobin\u0119 wi\u0119cej. Jest tu wi\u0119c mo\u017cliwo\u015b\u0107 podgl\u0105dania drzewa komponent\u00f3w, wybierania komponentu kursorem czy mo\u017cliwo\u015b\u0107 edycji parametr\u00f3w wej\u015bciowych komponent\u00f3w. Ponadto, ciekawie wygl\u0105daj\u0105 opcje profilowania, kt\u00f3re umo\u017cliwiaj\u0105 podejrzenie czas\u00f3w ChangeDetection czy renderowania poszczeg\u00f3lnych komponent\u00f3w.<\/p>\n<p>Je\u015bli wsp\u00f3\u0142praca mi\u0119dzy zespo\u0142em odpowiedzialnym za samego Angulara i Angular DevTools b\u0119dzie przebiega\u0142a sprawnie, to my\u015bl\u0119, \u017ce mo\u017cemy spokojnie po\u017cegna\u0107 si\u0119 z Augry. Mam nadziej\u0119, \u017ce taka symbioza sprawi, \u017ce nowe wersje Angulara b\u0119d\u0105 wspierane od dnia zero, a wsparcie dla starszych nie b\u0119dzie stanowi\u0142o problemu (w przesz\u0142o\u015bci mia\u0142em takie problemy z Augry). Ponadto, po cichu licz\u0119 troch\u0119 na to, \u017ce kolejne iteracje nad Angular DevTools pozwol\u0105 nam lepiej analizowa\u0107, to co dzieje si\u0119 wewn\u0105trz Angulara i dzi\u0119ki temu jeszcze lepiej optymalizowa\u0107 nasze aplikacje.<\/p>\n<figure class=\"kg-card kg-image-card kg-card-hascaption\"><img class=\"kg-image aligncenter\" src=\"https:\/\/vived.io\/wp-content\/uploads\/2021\/08\/img_610d099a0b331.gif\" alt=\"\" \/>\n<p>\u00a0<\/p>\n<figcaption>Unikalne nagranie przedstawiaj\u0105ce przysz\u0142o\u015b\u0107 Augry<\/figcaption>\n<\/figure>\n<h3 id=\"%C5%BAr%C3%B3d%C5%82a-2\">\u0179r\u00f3d\u0142a:<\/h3>\n<p><a href=\"https:\/\/angular.io\/guide\/devtools\">https:\/\/angular.io\/guide\/devtools<\/a><br \/><a href=\"https:\/\/www.youtube.com\/watch?v=d1SJL51FFxQ\">https:\/\/www.youtube.com\/watch?v=d1SJL51FFxQ<\/a><\/p>\n<h1 id=\"4-chrome-91\">4. Chrome 91<\/h1>\n<p>Na zako\u0144czenie mam dla Was pojawienie si\u0119 nowego Chrome\u2019a oznaczonego numerem 91. Co prawda lista nowo\u015bci jest kr\u00f3tka, ale zdecydowanie jest ona konkretna. Do `showSaveFilePicker` dodano parametr `suggestedName`, a do `showOpenFilePicker` parameter `startIn`. Umo\u017cliwiaj\u0105 one odpowiednio nadanie domy\u015blnej nazwy pliku do zapisu i wybranie domy\u015blnego katalogu do kt\u00f3rego u\u017cytkownik zostanie przeniesiony przy wyborze pliku do otwarcie. To nie koniec zmian dotycz\u0105cych interakcji z plikami, bo w Chrome wreszcie pojawia si\u0119 te\u017c zana z Safari mo\u017cliwo\u015b\u0107 wklejenia pliku skopiowanego do schowka. Niby ma\u0142e rzeczy, a sumarycznie mog\u0105 mocno ulepszy\u0107 do\u015bwiadczenia u\u017cytkownika.<\/p>\n<p>Opr\u00f3cz powy\u017cszych zmian ciekawie wygl\u0105da te\u017c mo\u017cliwo\u015b\u0107 oznaczenia stron, mi\u0119dzy kt\u00f3rymi wsp\u00f3\u0142dzielone powinno by\u0107 sugerowanie hase\u0142. Odpowiednia konfiguracja wymaga troch\u0119 pracy (wymagane jest stworzenie pliku assertlinks.json i dodanie go do .well-known), ale z \u0142atwo\u015bci\u0105 przychodz\u0105 mi do g\u0142owy aplikacje, w kt\u00f3rych takiej opcji mi brakowa\u0142o.<\/p>\n<figure class=\"kg-card kg-image-card kg-card-hascaption\"><img class=\"kg-image aligncenter\" src=\"https:\/\/vived.io\/wp-content\/uploads\/2021\/08\/img_610d099a850e1.gif\" alt=\"\" \/>\n<p>\u00a0<\/p>\n<figcaption>Na zako\u0144czenie standardowy mem o Chrome na odwr\u00f3cenie uwagi<\/figcaption>\n<\/figure>\n<h3 id=\"%C5%BAr%C3%B3d%C5%82a-3\">\u0179r\u00f3d\u0142a:<\/h3>\n<p><a href=\"https:\/\/developer.chrome.com\/blog\/new-in-chrome-91\/\">https:\/\/developer.chrome.com\/blog\/new-in-chrome-91\/<\/a><\/p>\n\n"]},{"blockName":"core\/paragraph","attrs":[],"innerBlocks":[],"innerHTML":"\n<p><\/p>\n","innerContent":["\n<p><\/p>\n"]}],"_links":{"self":[{"href":"https:\/\/vived.io\/pl\/wp-json\/wp\/v2\/posts\/10132","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/vived.io\/pl\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/vived.io\/pl\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/vived.io\/pl\/wp-json\/wp\/v2\/users\/12"}],"replies":[{"embeddable":true,"href":"https:\/\/vived.io\/pl\/wp-json\/wp\/v2\/comments?post=10132"}],"version-history":[{"count":1,"href":"https:\/\/vived.io\/pl\/wp-json\/wp\/v2\/posts\/10132\/revisions"}],"predecessor-version":[{"id":10638,"href":"https:\/\/vived.io\/pl\/wp-json\/wp\/v2\/posts\/10132\/revisions\/10638"}],"wp:attachment":[{"href":"https:\/\/vived.io\/pl\/wp-json\/wp\/v2\/media?parent=10132"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/vived.io\/pl\/wp-json\/wp\/v2\/categories?post=10132"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/vived.io\/pl\/wp-json\/wp\/v2\/tags?post=10132"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}![\"\"](\"https:\/\/vived.io\/wp-content\/uploads\/2021\/08\/img_610d099675cd4.gif\")
<\/figure>\n![\"\"](\"https:\/\/vived.io\/wp-content\/uploads\/2021\/08\/img_610d099865c5a.gif\")
\n![\"\"](\"https:\/\/vived.io\/wp-content\/uploads\/2021\/08\/img_610d099a0b331.gif\")
\n![\"\"](\"https:\/\/vived.io\/wp-content\/uploads\/2021\/08\/img_610d099a850e1.gif\")
\n