Wes Bos & Scott Tolinski - Full Stack JavaScript Web Developers

Zpravodajství

Technologické zprávy

Technika

Standard Server JavaScript - Deno, Workers, Bun and More

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 episode of Syntax, Wes and Scott talk about JavaScript runtimes available to use, what to consider, and packages to use.</p> <h2 class="code-line" data-line-start="2" data-line-end="3"><a id= "Show_Notes_2"></a>Show Notes</h2> <ul> <li class="has-line-data" data-line-start="4" data-line-end="5"> <strong><a href="#t=00:10">00:10</a></strong> Welcome</li> <li class="has-line-data" data-line-start="5" data-line-end="6"> <strong><a href="#t=01:00">01:00</a></strong> Scott’s glasses</li> <li class="has-line-data" data-line-start="6" data-line-end="7"> <strong><a href="#t=03:46">03:46</a></strong> All the runtimes</li> <li class="has-line-data" data-line-start="7" data-line-end="8"> <a href="https://bun.sh/">Bun — A fast all-in-one JavaScript runtime</a></li> <li class="has-line-data" data-line-start="8" data-line-end="9"> <a href="https://supabase.com/docs/guides/functions">Edge Functions Supabase Docs</a></li> <li class="has-line-data" data-line-start="9" data-line-end="10"> <a href="https://docs.netlify.com/edge-functions/overview/">Edge Functions Netlify Docs</a></li> <li class="has-line-data" data-line-start="10" data-line-end="11"> <a href="https://deno.land/">Deno — A modern runtime for JavaScript and TypeScript</a></li> <li class="has-line-data" data-line-start="11" data-line-end="12"> <a href="https://fastify.dev/">Fast and low overhead web framework, for Node.js | Fastify</a></li> <li class="has-line-data" data-line-start="12" data-line-end="13"> <a href= "https://www.alibabacloud.com/knowledge/what-is-edge-computing">What Is Edge Computing? Alibaba</a></li> <li class="has-line-data" data-line-start="13" data-line-end="14"> <strong><a href="#t=05:15">05:15</a></strong> A note for anyone new to JavaScript</li> <li class="has-line-data" data-line-start="14" data-line-end="15"> <strong><a href="#t=08:40">08:40</a></strong> Winter CG</li> <li class="has-line-data" data-line-start="15" data-line-end="16"> <a href="https://wintercg.org/">WinterCG</a></li> <li class="has-line-data" data-line-start="16" data-line-end="17"> <strong><a href="#t=11:05">11:05</a></strong> Fetch</li> <li class="has-line-data" data-line-start="17" data-line-end="18"> <a href="https://github.com/sindresorhus/ky">sindresorhus/ky: JavaScript HTTP client based on the browser Fetch API</a></li> <li class="has-line-data" data-line-start="18" data-line-end="19"> <a href= "https://github.com/syntaxfm/website/blob/v2/src/routes/shows/%2Bpage.svelte#L44"> website/src/routes/shows/+page.svelte</a></li> <li class="has-line-data" data-line-start="19" data-line-end="20"> <strong><a href="#t=14:53">14:53</a></strong> URL</li> <li class="has-line-data" data-line-start="20" data-line-end="21"> <strong><a href="#t=20:02">20:02</a></strong> addEVentListener</li> <li class="has-line-data" data-line-start="21" data-line-end="22"> <a href= "https://github.com/wintercg/proposal-common-minimum-api/issues/5">whatwg/fs · Issue #5 · wintercg/proposal-common-minimum-api · GitHub</a></li> <li class="has-line-data" data-line-start="22" data-line-end="23"> <strong><a href="#t=22:53">22:53</a></strong> Web streams</li> <li class="has-line-data" data-line-start="23" data-line-end="24"> <a href="https://syntax.fm/show/587/web-streams-explained">Web Streams Explained — Syntax Podcast 587</a></li> <li class="has-line-data" data-line-start="24" data-line-end="25"> <strong><a href="#t=26:03">26:03</a></strong> Structured Clone</li> <li class="has-line-data" data-line-start="25" data-line-end="26"> <a href="https://workers.tools/structured-json/">Structured JSON | Worker Tools</a></li> <li class="has-line-data" data-line-start="26" data-line-end="27"> <strong><a href="#t=33:43">33:43</a></strong> What does JSON 5 do?</li> <li class="has-line-data" data-line-start="27" data-line-end="28"> <strong><a href="#t=34:48">34:48</a></strong> Markdown flavors</li> <li class="has-line-data" data-line-start="28" data-line-end="29"> <strong><a href="#t=36:46">36:46</a></strong> File</li> <li class="has-line-data" data-line-start="29" data-line-end="30"> <strong><a href="#t=40:32">40:32</a></strong> AbortController and AbortSignal</li> <li class="has-line-data" data-line-start="30" data-line-end="31"> <a href="https://dom.spec.whatwg.org/#abortsignal">DOM Standard</a></li> <li class="has-line-data" data-line-start="31" data-line-end="32"> <a href="https://dom.spec.whatwg.org/#abortcontroller">DOM Standard</a></li> <li class="has-line-data" data-line-start="32" data-line-end="33"> <strong><a href="#t=42:45">42:45</a></strong> Packages for building</li> <li class="has-line-data" data-line-start="33" data-line-end="34"> <a href="https://www.npmjs.com/package/linkedom">linkedom - npm</a></li> <li class="has-line-data" data-line-start="34" data-line-end="35"> <strong><a href="#t=44:05">44:05</a></strong> Honking the Hono.dev</li> <li class="has-line-data" data-line-start="35" data-line-end="36"> <a href="https://www.npmjs.com/package/itty-router">Itty Router</a></li> <li class="has-line-data" data-line-start="36" data-line-end="37"> <a href="https://itty.dev/">Itty Dev</a></li> <li class="has-line-data" data-line-start="37" data-line-end="38"> <a href="https://hono.dev/">Hono.dev</a></li> <li class="has-line-data" data-line-start="38" data-line-end="40"> <strong><a href="#t=55:25">55:25</a></strong> SIIIIICK ××× PIIIICKS ×××</li> </ul> <h2 class="code-line" data-line-start="40" data-line-end="41"> <a id="_SIIIIICK__PIIIICKS__40"></a>××× SIIIIICK ××× PIIIICKS ×××</h2> <ul> <li class="has-line-data" data-line-start="42" data-line-end="43"> Scott: <a href="https://macrofactorapp.com/">Macro Factor</a></li> <li class="has-line-data" data-line-start="43" data-line-end="45"> Wes: <a href="https://crpproducts.com/">CRP Products</a></li> </ul> <h2 class="code-line" data-line-start="45" data-line-end="46"> <a id="Shameless_Plugs_45"></a>Shameless Plugs</h2> <ul> <li class="has-line-data" data-line-start="47" data-line-end="48"> Scott: <a href="https://sentry.io">Sentry</a></li> <li class="has-line-data" data-line-start="48" data-line-end="50"> Wes: <a href="https://wesbos.com/courses">Wes Bos Tutorials</a></li> </ul> <h2 class="code-line" data-line-start="50" data-line-end="51"> <a id="Tweet_us_your_tasty_treats_50"></a>Tweet us your tasty treats</h2> <ul> <li class="has-line-data" data-line-start="52" data-line-end="53"> <a href="https://www.instagram.com/stolinski/">Scott’s Instagram</a></li> <li class="has-line-data" data-line-start="53" data-line-end="54"> <a href= "https://www.instagram.com/LevelUpTutorials/">LevelUpTutorials Instagram</a></li> <li class="has-line-data" data-line-start="54" data-line-end="55"> <a href="https://www.instagram.com/wesbos/">Wes’ Instagram</a></li> <li class="has-line-data" data-line-start="55" data-line-end="56"> <a href="https://twitter.com/wesbos">Wes’ Twitter</a></li> <li class="has-line-data" data-line-start="56" data-line-end="57"> <a href="https://www.facebook.com/wesbos.developer">Wes’ Facebook</a></li> <li class="has-line-data" data-line-start="57" data-line-end="58"> <a href="https://twitter.com/stolinski">Scott’s Twitter</a></li> <li class="has-line-data" data-line-start="58" data-line-end="59"> Make sure to include <a href= "https://twitter.com/SyntaxFM">@SyntaxFM</a> in your tweets</li> <li class="has-line-data" data-line-start="59" data-line-end="60"> <a href="https://bsky.app/profile/wesbos.com">Wes Bos on Bluesky</a></li> <li class="has-line-data" data-line-start="60" data-line-end="61"> <a href="https://bsky.app/profile/tolin.ski">Scott on Bluesky</a></li> <li class="has-line-data" data-line-start="61" data-line-end="62"> <a href="https://bsky.app/profile/syntax.fm">Syntax on Bluesky</a></li> </ul>

In this episode of Syntax, Wes and Scott talk about JavaScript runtimes available to use, what to consider, and packages to use.
 Show Notes  00:10 Welcome
 01:00 Scott’s glasses
 03:46 All the runtimes
 Bun — A fast all-in-one JavaScript runtime

 Edge Functions Supabase Docs

 Edge Functions Netlify Docs

 Deno — A modern runtime for JavaScript and TypeScript

 Fast and low overhead web framework, for Node.js | Fastify

 What Is Edge Computing? Alibaba

 05:15 A note for anyone new to JavaScript
 08:40 Winter CG
 WinterCG

 11:05 Fetch
 sindresorhus/ky: JavaScript HTTP client based on the browser Fetch API

  website/src/routes/shows/+page.svelte

 14:53 URL
 20:02 addEVentListener
 whatwg/fs · Issue #5 · wintercg/proposal-common-minimum-api · GitHub

 22:53 Web streams
 Web Streams Explained — Syntax Podcast 587

 26:03 Structured Clone
 Structured JSON | Worker Tools

 33:43 What does JSON 5 do?
 34:48 Markdown flavors
 36:46 File
 40:32 AbortController and AbortSignal
 DOM Standard

 DOM Standard

 42:45 Packages for building
 linkedom - npm

 44:05 Honking the Hono.dev
 Itty Router

 Itty Dev

 Hono.dev

 55:25 SIIIIICK ××× PIIIICKS ×××
  ××× SIIIIICK ××× PIIIICKS ×××  Scott: Macro Factor

 Wes: CRP Products

  Shameless Plugs  Scott: Sentry

 Wes: Wes Bos Tutorials

  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
 Wes Bos on Bluesky

 Scott on Bluesky

 Syntax on Bluesky

Aplikace Youradio Talk

Standard Server JavaScript - Deno, Workers, Bun and More

Poslechněte si podcast