Wes Bos & Scott Tolinski - Full Stack JavaScript Web Developers

Zpravodajství

Technologické zprávy

Technika

Potluck - enums, WASM, Lighthouse, Redirects

Syntax - Tasty Web Development Treats

Full Stack Developers Wes Bos and Scott Tolinski dive deep into web development topics, explaining how they work and talking about their own experiences. They cover from JavaScript frameworks like React, to the latest advancements in CSS to simplifying web tooling.

<p>In this episode of Syntax, Scott and Wes answer your questions on a Potluck episode of Syntax.</p> <h2 id="sanity---sponsor" class="code-line" data-line="9">Sanity - Sponsor</h2> <p class="code-line" data-line="11"><a title="http://Sanity.io" href="http://sanity.io/" data-href= "http://Sanity.io">Sanity.io</a> is a real-time headless CMS with a fully customizable Content Studio built in React. Get a Sanity powered site up and running in minutes at <a title= "https://www.sanity.io/create" href="https://www.sanity.io/create" data-href="https://www.sanity.io/create">sanity.io/create</a>. Get an awesome supercharged free developer plan on <a title= "https://www.sanity.io/syntax" href="https://www.sanity.io/syntax" data-href="https://www.sanity.io/syntax">sanity.io/syntax</a>.</p> <h2 id="sentry---sponsor" class="code-line" data-line="13">Sentry - Sponsor</h2> <p class="code-line" data-line="15">If you want to know what’s happening with your code, track errors and monitor performance with Sentry. Sentry’s Application Monitoring platform helps developers see performance issues, fix errors faster, and optimize their code health. Cut your time on error resolution from hours to minutes. It works with any language and integrates with dozens of other services. Syntax listeners new to Sentry can get two months for free by visiting <a title="https://sentry.io" href= "https://sentry.io/" data-href= "https://sentry.io">Sentry.io</a> and using the coupon code TASTYTREAT during sign up.</p> <h2 id="linode---sponsor" class="code-line" data-line="17">Linode - Sponsor</h2> <p class="code-line" data-line="19">Whether you’re working on a personal project or managing enterprise infrastructure, you deserve simple, affordable, and accessible cloud computing solutions that allow you to take your project to the next level. Simplify your cloud infrastructure with Linode’s Linux virtual machines and develop, deploy, and scale your modern applications faster and easier. Get started on Linode today with a $100 in free credit for listeners of Syntax. You can find all the details at <a title= "https://linode.com/syntax" href="https://linode.com/syntax" data-href="https://linode.com/syntax">linode.com/syntax</a>. Linode has 11 global data centers and provides 24/7/365 human support with no tiers or hand-offs regardless of your plan size. In addition to shared and dedicated compute instances, you can use your $100 in credit on S3-compatible object storage, Managed Kubernetes, and more. Visit <a title="https://linode.com/syntax" href= "https://linode.com/syntax" data-href= "https://linode.com/syntax">linode.com/syntax</a> and click on the “Create Free Account” button to get started.</p> <h2 id="show-notes" class="code-line" data-line="21">Show Notes</h2> <ul class="code-line" data-line="23"> <li class="code-line" data-line="23"><strong><a title="#t=02:07" href= "https://file+.vscode-resource.vscode-webview.net/Users/ichris/Documents/GitHub/Syntax/shows/414%20-%20Potluck%20-%20enums%2C%20WASM%2C%20Lighthouse%2C%20Redirects%20.md#t=02:07" data-href="#t=02:07">02:07</a></strong> Google Chrome to start measuring user experience beyond the completion of page load</li> <li class="code-line" data-line="24"><strong><a title="#t=05:47" href= "https://file+.vscode-resource.vscode-webview.net/Users/ichris/Documents/GitHub/Syntax/shows/414%20-%20Potluck%20-%20enums%2C%20WASM%2C%20Lighthouse%2C%20Redirects%20.md#t=05:47" data-href="#t=05:47">05:47</a></strong> How can I ensure that I am executing npm commands safely?</li> <li class="code-line" data-line="25"><strong><a title="#t=07:58" href= "https://file+.vscode-resource.vscode-webview.net/Users/ichris/Documents/GitHub/Syntax/shows/414%20-%20Potluck%20-%20enums%2C%20WASM%2C%20Lighthouse%2C%20Redirects%20.md#t=07:58" data-href="#t=07:58">07:58</a></strong> How should I prefix booleans?</li> <li class="code-line" data-line="26"><strong><a title="#t=09:46" href= "https://file+.vscode-resource.vscode-webview.net/Users/ichris/Documents/GitHub/Syntax/shows/414%20-%20Potluck%20-%20enums%2C%20WASM%2C%20Lighthouse%2C%20Redirects%20.md#t=09:46" data-href="#t=09:46">09:46</a></strong> How do I decide between using an enum vs a union type in Typescript</li> <li class="code-line" data-line="27"><strong><a title="#t=13:40" href= "https://file+.vscode-resource.vscode-webview.net/Users/ichris/Documents/GitHub/Syntax/shows/414%20-%20Potluck%20-%20enums%2C%20WASM%2C%20Lighthouse%2C%20Redirects%20.md#t=13:40" data-href="#t=13:40">13:40</a></strong> What is Web Assembly?</li> <li class="code-line" data-line="28"><strong><a title="#t=18:34" href= "https://file+.vscode-resource.vscode-webview.net/Users/ichris/Documents/GitHub/Syntax/shows/414%20-%20Potluck%20-%20enums%2C%20WASM%2C%20Lighthouse%2C%20Redirects%20.md#t=18:34" data-href="#t=18:34">18:34</a></strong> Sponsor: Sanity</li> <li class="code-line" data-line="29"><strong><a title="#t=19:45" href= "https://file+.vscode-resource.vscode-webview.net/Users/ichris/Documents/GitHub/Syntax/shows/414%20-%20Potluck%20-%20enums%2C%20WASM%2C%20Lighthouse%2C%20Redirects%20.md#t=19:45" data-href="#t=19:45">19:45</a></strong> what happened to Scott using Linux?</li> <li class="code-line" data-line="30"><a title= "https://pop.system76.com" href="https://pop.system76.com/" data-href="https://pop.system76.com">PopOS</a></li> <li class="code-line" data-line="31"><strong><a title="#t=22:44" href= "https://file+.vscode-resource.vscode-webview.net/Users/ichris/Documents/GitHub/Syntax/shows/414%20-%20Potluck%20-%20enums%2C%20WASM%2C%20Lighthouse%2C%20Redirects%20.md#t=22:44" data-href="#t=22:44">22:44</a></strong> Sponsor: Linode</li> <li class="code-line" data-line="32"><strong><a title="#t=23:57" href= "https://file+.vscode-resource.vscode-webview.net/Users/ichris/Documents/GitHub/Syntax/shows/414%20-%20Potluck%20-%20enums%2C%20WASM%2C%20Lighthouse%2C%20Redirects%20.md#t=23:57" data-href="#t=23:57">23:57</a></strong> How do you batch requests in nodejs to an api?</li> <li class="code-line" data-line="33"><strong><a title="#t=26:15" href= "https://file+.vscode-resource.vscode-webview.net/Users/ichris/Documents/GitHub/Syntax/shows/414%20-%20Potluck%20-%20enums%2C%20WASM%2C%20Lighthouse%2C%20Redirects%20.md#t=26:15" data-href="#t=26:15">26:15</a></strong> What are micro-frontends?</li> <li class="code-line" data-line="34"><strong><a title="#t=29:55" href= "https://file+.vscode-resource.vscode-webview.net/Users/ichris/Documents/GitHub/Syntax/shows/414%20-%20Potluck%20-%20enums%2C%20WASM%2C%20Lighthouse%2C%20Redirects%20.md#t=29:55" data-href="#t=29:55">29:55</a></strong> Sponsor: Sentry</li> <li class="code-line" data-line="35"><strong><a title="#t=31:16" href= "https://file+.vscode-resource.vscode-webview.net/Users/ichris/Documents/GitHub/Syntax/shows/414%20-%20Potluck%20-%20enums%2C%20WASM%2C%20Lighthouse%2C%20Redirects%20.md#t=31:16" data-href="#t=31:16">31:16</a></strong> Since Astro seems so amazing, aren’t you tempted to rebuild your site now in Astro instead of Sveltekit?</li> <li class="code-line" data-line="36"><a title="https://astro.build" href="https://astro.build/" data-href= "https://astro.build">Astro</a></li> <li class="code-line" data-line="37"><strong><a title="#t=33:04" href= "https://file+.vscode-resource.vscode-webview.net/Users/ichris/Documents/GitHub/Syntax/shows/414%20-%20Potluck%20-%20enums%2C%20WASM%2C%20Lighthouse%2C%20Redirects%20.md#t=33:04" data-href="#t=33:04">33:04</a></strong> Can you please shed some light on redirects in express/ koa?</li> <li class="code-line" data-line="38"><strong><a title="#t=36:41" href= "https://file+.vscode-resource.vscode-webview.net/Users/ichris/Documents/GitHub/Syntax/shows/414%20-%20Potluck%20-%20enums%2C%20WASM%2C%20Lighthouse%2C%20Redirects%20.md#t=36:41" data-href="#t=36:41">36:41</a></strong> How do deal with ADHD?</li> <li class="code-line" data-line="39"><strong><a title="#t=41:52" href= "https://file+.vscode-resource.vscode-webview.net/Users/ichris/Documents/GitHub/Syntax/shows/414%20-%20Potluck%20-%20enums%2C%20WASM%2C%20Lighthouse%2C%20Redirects%20.md#t=41:52" data-href="#t=41:52">41:52</a></strong> Should I repeat the name of the issue in the commit message or just "Resolves #$issue-number"?</li> <li class="code-line" data-line="40"><strong><a title="#t=44:21" href= "https://file+.vscode-resource.vscode-webview.net/Users/ichris/Documents/GitHub/Syntax/shows/414%20-%20Potluck%20-%20enums%2C%20WASM%2C%20Lighthouse%2C%20Redirects%20.md#t=44:21" data-href="#t=44:21">44:21</a></strong> Do browsers update automatically?</li> <li class="code-line" data-line="41"><strong><a title="#t=47:52" href= "https://file+.vscode-resource.vscode-webview.net/Users/ichris/Documents/GitHub/Syntax/shows/414%20-%20Potluck%20-%20enums%2C%20WASM%2C%20Lighthouse%2C%20Redirects%20.md#t=47:52" data-href="#t=47:52">47:52</a></strong> What do you do when working on a big project?</li> <li class="code-line" data-line="42"><strong><a title="#t=49:55" href= "https://file+.vscode-resource.vscode-webview.net/Users/ichris/Documents/GitHub/Syntax/shows/414%20-%20Potluck%20-%20enums%2C%20WASM%2C%20Lighthouse%2C%20Redirects%20.md#t=49:55" data-href="#t=49:55">49:55</a></strong> Can you guys help to breakdown and explain jargons and differences of RPC, REST, gRPC, GraphQL?</li> <li class="code-line" data-line="43"><strong><a title="#t=53:25" href= "https://file+.vscode-resource.vscode-webview.net/Users/ichris/Documents/GitHub/Syntax/shows/414%20-%20Potluck%20-%20enums%2C%20WASM%2C%20Lighthouse%2C%20Redirects%20.md#t=53:25" data-href="#t=53:25">53:25</a></strong> How to ask a question</li> <li class="code-line" data-line="44"><strong><a title="#t=53:42" href= "https://file+.vscode-resource.vscode-webview.net/Users/ichris/Documents/GitHub/Syntax/shows/414%20-%20Potluck%20-%20enums%2C%20WASM%2C%20Lighthouse%2C%20Redirects%20.md#t=53:42" data-href="#t=53:42">53:42</a></strong> Sick Picks</li> <li class="code-line" data-line="45"><strong><a title="#t=56:17" href= "https://file+.vscode-resource.vscode-webview.net/Users/ichris/Documents/GitHub/Syntax/shows/414%20-%20Potluck%20-%20enums%2C%20WASM%2C%20Lighthouse%2C%20Redirects%20.md#t=56:17" data-href="#t=56:17">56:17</a></strong> Shamless plugs</li> </ul> <h2 id= "%C3%97%C3%97%C3%97-siiiiick-%C3%97%C3%97%C3%97-piiiicks-%C3%97%C3%97%C3%97" class="code-line" data-line="47">××× SIIIIICK ××× PIIIICKS ×××</h2> <ul class="code-line" data-line="49"> <li class="code-line" data-line="49">Scott: <a title= "https://www.amazon.com/gp/product/B09LRKZ4BN?ie=UTF8&psc=1&linkCode=sl1&tag=leveluptuts01-20&linkId=2bc4587e9699c9e45cc2431f557c8ce2&language=en_US&ref_=as_li_ss_tl" href= "https://www.amazon.com/gp/product/B09LRKZ4BN?ie=UTF8&psc=1&linkCode=sl1&tag=leveluptuts01-20&linkId=2bc4587e9699c9e45cc2431f557c8ce2&language=en_US&ref_=as_li_ss_tl" data-href= "https://www.amazon.com/gp/product/B09LRKZ4BN?ie=UTF8&psc=1&linkCode=sl1&tag=leveluptuts01-20&linkId=2bc4587e9699c9e45cc2431f557c8ce2&language=en_US&ref_=as_li_ss_tl">Satechi 3-in-1 Magnetic Wireless Charging Stand</a></li> <li class="code-line" data-line="50">Wes: <a title= "https://the-always-sunny-podcast.simplecast.com" href= "https://the-always-sunny-podcast.simplecast.com/" data-href= "https://the-always-sunny-podcast.simplecast.com">The Always Sunny podcast</a></li> </ul> <h2 id="shameless-plugs" class="code-line" data-line="52">Shameless Plugs</h2> <ul class="code-line" data-line="54"> <li class="code-line" data-line="54">Scott: <a title= "https://www.leveluptutorials.com/pro" href= "https://www.leveluptutorials.com/pro" data-href= "https://www.leveluptutorials.com/pro">Astro Course</a></li> <li class="code-line" data-line="55">Wes: <a title= "https://wesbos.com/courses/" href="https://wesbos.com/courses/" data-href="https://wesbos.com/courses/">All Courses</a></li> </ul> <h2 id="tweet-us-your-tasty-treats" class="code-line" data-line= "57">Tweet us your tasty treats</h2> <ul class="code-line" data-line="59"> <li class="code-line" data-line="59"><a title= "https://www.instagram.com/stolinski/" href= "https://www.instagram.com/stolinski/" data-href= "https://www.instagram.com/stolinski/">Scott's Instagram</a></li> <li class="code-line" data-line="60"><a title= "https://www.instagram.com/LevelUpTutorials/" href= "https://www.instagram.com/LevelUpTutorials/" data-href= "https://www.instagram.com/LevelUpTutorials/">LevelUpTutorials Instagram</a></li> <li class="code-line" data-line="61"><a title= "https://www.instagram.com/wesbos/" href= "https://www.instagram.com/wesbos/" data-href= "https://www.instagram.com/wesbos/">Wes' Instagram</a></li> <li class="code-line" data-line="62"><a title= "https://twitter.com/wesbos" href="https://twitter.com/wesbos" data-href="https://twitter.com/wesbos">Wes' Twitter</a></li> <li class="code-line" data-line="63"><a title= "https://www.facebook.com/wesbos.developer" href= "https://www.facebook.com/wesbos.developer" data-href= "https://www.facebook.com/wesbos.developer">Wes' Facebook</a></li> <li class="code-line" data-line="64"><a title= "https://twitter.com/stolinski" href= "https://twitter.com/stolinski" data-href= "https://twitter.com/stolinski">Scott's Twitter</a></li> <li class="code-line" data-line="65">Make sure to include <a title="https://twitter.com/SyntaxFM" href= "https://twitter.com/SyntaxFM" data-href= "https://twitter.com/SyntaxFM">@SyntaxFM</a> in your tweets</li> </ul>

In this episode of Syntax, Scott and Wes answer your questions on a Potluck episode of Syntax.
 Sanity - Sponsor Sanity.io is a real-time headless CMS with a fully customizable Content Studio built in React. Get a Sanity powered site up and running in minutes at sanity.io/create. Get an awesome supercharged free developer plan on sanity.io/syntax.
 Sentry - Sponsor If you want to know what’s happening with your code, track errors and monitor performance with Sentry. Sentry’s Application Monitoring platform helps developers see performance issues, fix errors faster, and optimize their code health. Cut your time on error resolution from hours to minutes. It works with any language and integrates with dozens of other services. Syntax listeners new to Sentry can get two months for free by visiting Sentry.io and using the coupon code TASTYTREAT during sign up.
 Linode - Sponsor Whether you’re working on a personal project or managing enterprise infrastructure, you deserve simple, affordable, and accessible cloud computing solutions that allow you to take your project to the next level. Simplify your cloud infrastructure with Linode’s Linux virtual machines and develop, deploy, and scale your modern applications faster and easier. Get started on Linode today with a $100 in free credit for listeners of Syntax. You can find all the details at linode.com/syntax. Linode has 11 global data centers and provides 24/7/365 human support with no tiers or hand-offs regardless of your plan size. In addition to shared and dedicated compute instances, you can use your $100 in credit on S3-compatible object storage, Managed Kubernetes, and more. Visit linode.com/syntax and click on the “Create Free Account” button to get started.
 Show Notes 
02:07 Google Chrome to start measuring user experience beyond the completion of page load

05:47 How can I ensure that I am executing npm commands safely?

07:58 How should I prefix booleans?

09:46 How do I decide between using an enum vs a union type in Typescript

13:40 What is Web Assembly?

18:34 Sponsor: Sanity

19:45 what happened to Scott using Linux?
 PopOS

22:44 Sponsor: Linode

23:57 How do you batch requests in nodejs to an api?

26:15 What are micro-frontends?

29:55 Sponsor: Sentry

31:16 Since Astro seems so amazing, aren’t you tempted to rebuild your site now in Astro instead of Sveltekit?
 Astro

33:04 Can you please shed some light on redirects in express/ koa?

36:41 How do deal with ADHD?

41:52 Should I repeat the name of the issue in the commit message or just "Resolves #$issue-number"?

44:21 Do browsers update automatically?

47:52 What do you do when working on a big project?

49:55 Can you guys help to breakdown and explain jargons and differences of RPC, REST, gRPC, GraphQL?

53:25 How to ask a question

53:42 Sick Picks

56:17 Shamless plugs
 ××× SIIIIICK ××× PIIIICKS ××× Scott: Satechi 3-in-1 Magnetic Wireless Charging Stand

 Wes: The Always Sunny podcast

 Shameless Plugs Scott: Astro Course

 Wes: All Courses

 Tweet us your tasty treats Scott's Instagram
 LevelUpTutorials Instagram
 Wes' Instagram
 Wes' Twitter
 Wes' Facebook
 Scott's Twitter
 Make sure to include @SyntaxFM in your tweets

Aplikace Youradio Talk

Potluck - enums, WASM, Lighthouse, Redirects

Poslechněte si podcast