Wes Bos & Scott Tolinski - Full Stack JavaScript Web Developers

Zpravodajství

Technologické zprávy

Technika

Potluck × Twitter Following × TypeScript × Playwright

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 class="has-line-data" data-line-start="0" data-line-end="1">In this potluck episode of Syntax, Wes and Scott answer your questions about strategies to find good Twitter follows, should we use TypeScript for a company blog, what’s Playwright, and more!</p> <h2 class="code-line" data-line-start="2" data-line-end="3"><a id= "Prismic___Sponsor_2" name="Prismic___Sponsor_2"></a>Prismic - Sponsor</h2> <p class="has-line-data" data-line-start="4" data-line-end="5"> Prismic is a Headless CMS that makes it easy to build website pages as a set of components. Break pages into sections of components using React, Vue, or whatever you like. Make corresponding Slices in Prismic. Start building pages dynamically in minutes. Get started at <a href= "https://prismic.io/syntax">prismic.io/syntax</a>.</p> <h2 class="code-line" data-line-start="6" data-line-end="7"><a id= "Sanity__Sponsor_6" name="Sanity__Sponsor_6"></a>Sanity - Sponsor</h2> <p class="has-line-data" data-line-start="8" data-line-end="9"> <a 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 href= "https://www.sanity.io/create">sanity.io/create</a>. Get an awesome supercharged free developer plan on <a href= "https://www.sanity.io/syntax">sanity.io/syntax</a>.</p> <h2 class="code-line" data-line-start="10" data-line-end="11"> <a id="LogRocket__Sponsor_10" name= "LogRocket__Sponsor_10"></a>LogRocket - Sponsor</h2> <p class="has-line-data" data-line-start="12" data-line-end="13"> LogRocket lets you replay what users do on your site, helping you reproduce bugs and fix issues faster. It’s an exception tracker, a session re-player and a performance monitor. Get 14 days free at <a href= "https://logrocket.com/syntax">logrocket.com/syntax</a>.</p> <h2 class="code-line" data-line-start="14" data-line-end="15"> <a id="Show_Notes_14" name="Show_Notes_14"></a>Show Notes</h2> <ul> <li class="has-line-data" data-line-start="16" data-line-end="17"> <strong><a href="#t=00:10">00:10</a></strong> Welcome</li> <li class="has-line-data" data-line-start="17" data-line-end="18"> <strong><a href="#t=01:53">01:53</a></strong> TikTok update</li> <li class="has-line-data" data-line-start="18" data-line-end="19"> <strong><a href="#t=02:46">02:46</a></strong> What strategies do you use to find the good stuff?</li> <li class="has-line-data" data-line-start="19" data-line-end="20"> <a href="https://tweetdeck.twitter.com">Tweetdeck</a></li> <li class="has-line-data" data-line-start="20" data-line-end="21"> <strong><a href="#t=11:17">11:17</a></strong> What is the clear distinction b/w how the CRUD Ops & the Real time chat protocols (XMPP, Websockets, etc) differ?</li> <li class="has-line-data" data-line-start="21" data-line-end="22"> <strong><a href="#t=15:56">15:56</a></strong> Should we use TypeScript for a new blog?</li> <li class="has-line-data" data-line-start="22" data-line-end="23"> <strong><a href="#t=20:45">20:45</a></strong> Sponsor: Sanity</li> <li class="has-line-data" data-line-start="23" data-line-end="24"> <strong><a href="#t=21:45">21:45</a></strong> Is there any reason to still use string concatenation over template literals?</li> <li class="has-line-data" data-line-start="24" data-line-end="25"> <strong><a href="#t=26:13">26:13</a></strong> What should React devs use to get initial scaffolding in place?</li> <li class="has-line-data" data-line-start="25" data-line-end="26"> <a href="https://create-react-app.dev">Create React App</a></li> <li class="has-line-data" data-line-start="26" data-line-end="27"> <a href="https://vitejs.dev">Vite</a></li> <li class="has-line-data" data-line-start="27" data-line-end="28"> <a href="https://turbo.build/pack">Turbo Pack</a></li> <li class="has-line-data" data-line-start="28" data-line-end="29"> <strong><a href="#t=29:38">29:38</a></strong> What’s the deal with Playwright?</li> <li class="has-line-data" data-line-start="29" data-line-end="30"> <a href="https://playwright.dev">Playwright</a></li> <li class="has-line-data" data-line-start="30" data-line-end="31"> <strong><a href="#t=34:28">34:28</a></strong> Sponsor: LogRocket</li> <li class="has-line-data" data-line-start="31" data-line-end="32"> <strong><a href="#t=35:19">35:19</a></strong> What separates a “scripting” language from a “programming” language?</li> <li class="has-line-data" data-line-start="32" data-line-end="33"> <strong><a href="#t=39:37:14">39:37:14</a></strong> Sponsor: Prismic</li> <li class="has-line-data" data-line-start="33" data-line-end="34"> <strong><a href="#t=40:23:02">40:23:02</a></strong> Do you have any tips on how to change a defeated programmer mindset?</li> <li class="has-line-data" data-line-start="34" data-line-end="35"> <a href="https://partytown.builder.io">Partydown</a></li> <li class="has-line-data" data-line-start="35" data-line-end="36"> <strong><a href="#t=47:34:07">47:34:07</a></strong> How has your use of and work in the browser changed with Arc?</li> <li class="has-line-data" data-line-start="36" data-line-end="37"> <a href="https://arc.net">Arc Browser</a></li> <li class="has-line-data" data-line-start="37" data-line-end="38"> <a href= "https://syntax.fm/show/514/supper-club-arc-browser-with-hursh-agrawal"> Syntax 514 - Supper Club × Arc Browser with Hursh Agrawal</a></li> <li class="has-line-data" data-line-start="38" data-line-end="39"> <strong><a href="#t=49:18:15">49:18:15</a></strong> Why would I attach an event listener with the useCapture argument as true?</li> <li class="has-line-data" data-line-start="39" data-line-end="41"> <strong><a href="#t=51:33:24">51:33:24</a></strong> SIIIIICK ××× PIIIICKS ×××</li> </ul> <h2 class="code-line" data-line-start="41" data-line-end="42"> <a id="_SIIIIICK__PIIIICKS__41" name= "_SIIIIICK__PIIIICKS__41"></a>××× SIIIIICK ××× PIIIICKS ×××</h2> <ul> <li class="has-line-data" data-line-start="43" data-line-end="44"> Scott: <a href="https://amzn.to/3hbeT3I">Screwless plates</a> / <a href="https://amzn.to/3TfUhEW">4 pack of screwless plates</a></li> <li class="has-line-data" data-line-start="44" data-line-end="46"> Wes: <a href= "https://www.homedepot.ca/product/tuff-store-5-76l-plastic-storage-utility-tote-box-in-clear/1000705919"> Shoe Boxes for Cords</a></li> </ul> <h2 class="code-line" data-line-start="46" data-line-end="47"> <a id="Shameless_Plugs_46" name="Shameless_Plugs_46"></a>Shameless Plugs</h2> <ul> <li class="has-line-data" data-line-start="48" data-line-end="49"> Scott: <a href="https://www.tiktok.com/@leveluptuts">LevelUp TikTok</a></li> <li class="has-line-data" data-line-start="49" data-line-end="51"> Wes: <a href="https://www.tiktok.com/@wesbos">Wes Bos TikTok</a></li> </ul> <h2 class="code-line" data-line-start="51" data-line-end="52"> <a id="Tweet_us_your_tasty_treats_51" name= "Tweet_us_your_tasty_treats_51"></a>Tweet us your tasty treats</h2> <ul> <li class="has-line-data" data-line-start="53" data-line-end="54"> <a href="https://www.instagram.com/stolinski/">Scott’s Instagram</a></li> <li class="has-line-data" data-line-start="54" data-line-end="55"> <a href= "https://www.instagram.com/LevelUpTutorials/">LevelUpTutorials Instagram</a></li> <li class="has-line-data" data-line-start="55" data-line-end="56"> <a href="https://www.instagram.com/wesbos/">Wes’ Instagram</a></li> <li class="has-line-data" data-line-start="56" data-line-end="57"> <a href="https://twitter.com/wesbos">Wes’ Twitter</a></li> <li class="has-line-data" data-line-start="57" data-line-end="58"> <a href="https://www.facebook.com/wesbos.developer">Wes’ Facebook</a></li> <li class="has-line-data" data-line-start="58" data-line-end="59"> <a href="https://twitter.com/stolinski">Scott’s Twitter</a></li> <li class="has-line-data" data-line-start="59" data-line-end="60"> Make sure to include <a href= "https://twitter.com/SyntaxFM">@SyntaxFM</a> in your tweets</li> </ul>

In this potluck episode of Syntax, Wes and Scott answer your questions about strategies to find good Twitter follows, should we use TypeScript for a company blog, what’s Playwright, and more!
 Prismic - Sponsor Prismic is a Headless CMS that makes it easy to build website pages as a set of components. Break pages into sections of components using React, Vue, or whatever you like. Make corresponding Slices in Prismic. Start building pages dynamically in minutes. Get started at prismic.io/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.
 LogRocket - Sponsor LogRocket lets you replay what users do on your site, helping you reproduce bugs and fix issues faster. It’s an exception tracker, a session re-player and a performance monitor. Get 14 days free at logrocket.com/syntax.
 Show Notes  00:10 Welcome
 01:53 TikTok update
 02:46 What strategies do you use to find the good stuff?
 Tweetdeck

 11:17 What is the clear distinction b/w how the CRUD Ops & the Real time chat protocols (XMPP, Websockets, etc) differ?
 15:56 Should we use TypeScript for a new blog?
 20:45 Sponsor: Sanity
 21:45 Is there any reason to still use string concatenation over template literals?
 26:13 What should React devs use to get initial scaffolding in place?
 Create React App

 Vite

 Turbo Pack

 29:38 What’s the deal with Playwright?
 Playwright

 34:28 Sponsor: LogRocket
 35:19 What separates a “scripting” language from a “programming” language?
 39:37:14 Sponsor: Prismic
 40:23:02 Do you have any tips on how to change a defeated programmer mindset?
 Partydown

 47:34:07 How has your use of and work in the browser changed with Arc?
 Arc Browser

  Syntax 514 - Supper Club × Arc Browser with Hursh Agrawal

 49:18:15 Why would I attach an event listener with the useCapture argument as true?
 51:33:24 SIIIIICK ××× PIIIICKS ×××
  ××× SIIIIICK ××× PIIIICKS ×××  Scott: Screwless plates / 4 pack of screwless plates

 Wes: Shoe Boxes for Cords

  Shameless Plugs  Scott: LevelUp TikTok

 Wes: Wes Bos TikTok

  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 × Twitter Following × TypeScript × Playwright

Poslechněte si podcast