Wes Bos & Scott Tolinski - Full Stack JavaScript Web Developers

Zpravodajství

Technologické zprávy

Technika

Hasty Treat - Git the Latest - New Things In Tech - CoPilot, Petite Vue, Stackblitz, Web3 + 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="7" data-line-end="8">In this Hasty Treat, Scott and Wes launch a new series called Git the Latest — New Things In Tech.</p> <h2 class="code-line" data-line-start="9" data-line-end="10"><a id= "Freshbooks__Sponsor_9" name="Freshbooks__Sponsor_9"></a>Freshbooks - Sponsor</h2> <p class="has-line-data" data-line-start="10" data-line-end="11"> Get a 30 day free trial of Freshbooks at <a href= "https://freshbooks.com/syntax">freshbooks.com/syntax</a> and put SYNTAX in the “How did you hear about us?” section.</p> <h2 class="code-line" data-line-start="12" data-line-end="13"> <a id="Sentry__Sponsor_12" name="Sentry__Sponsor_12"></a>Sentry - Sponsor</h2> <p class="has-line-data" data-line-start="13" data-line-end="14">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 href= "https://sentry.io/">Sentry.io</a> and using the coupon code TASTYTREAT during sign up.</p> <h2 class="code-line" data-line-start="15" data-line-end="16"> <a id="Show_Notes_15" name="Show_Notes_15"></a>Show Notes</h2> <p class="has-line-data" data-line-start="16" data-line-end="17"> 03:47 - <a href="https://copilot.github.com/">GitHub CoPilot</a></p> <ul> <li class="has-line-data" data-line-start="17" data-line-end="18"> AI-powered autocompletion</li> <li class="has-line-data" data-line-start="18" data-line-end="20"> Not going to take your job</li> </ul> <p class="has-line-data" data-line-start="20" data-line-end="21"> 07:18 - <a href="https://nextjs.org/blog/next-11">Next.js 11</a></p> <ul> <li class="has-line-data" data-line-start="21" data-line-end="22"> Image updates</li> <li class="has-line-data" data-line-start="22" data-line-end="24"> Multiplayer</li> </ul> <p class="has-line-data" data-line-start="24" data-line-end="25"> 08:20 - <a href="https://astro.build/">Astro</a></p> <ul> <li class="has-line-data" data-line-start="25" data-line-end="27"> Build faster websites with less client-side JavaScript</li> </ul> <p class="has-line-data" data-line-start="27" data-line-end="28"> 09:50 - <a href="https://developers.notion.com/">Notion API</a></p> <ul> <li class="has-line-data" data-line-start="28" data-line-end="29"> Get database</li> <li class="has-line-data" data-line-start="29" data-line-end="30"> Query database</li> <li class="has-line-data" data-line-start="30" data-line-end="31"> Pages</li> <li class="has-line-data" data-line-start="31" data-line-end="33"> Block children</li> </ul> <p class="has-line-data" data-line-start="33" data-line-end="34"> 11:27 - <a href="https://github.com/vuejs/petite-vue">Petite Vue</a></p> <ul> <li class="has-line-data" data-line-start="34" data-line-end="35"> Petite Vue is an alternative distribution of Vue optimized for progressive enhancement</li> <li class="has-line-data" data-line-start="35" data-line-end="36"> Similar to Alpine.js</li> <li class="has-line-data" data-line-start="36" data-line-end="38"> Without a build step</li> </ul> <p class="has-line-data" data-line-start="38" data-line-end="39"> 13:58 - <a href="https://stackblitz.com/">Stackblitz</a></p> <ul> <li class="has-line-data" data-line-start="39" data-line-end="40"> Node in the browser</li> <li class="has-line-data" data-line-start="40" data-line-end="41"> Not in the cloud</li> <li class="has-line-data" data-line-start="41" data-line-end="43"> Rolled</li> </ul> <p class="has-line-data" data-line-start="43" data-line-end="44"> 15:22 - <a href= "https://github.com/solidjs/solid">Solid.js</a></p> <ul> <li class="has-line-data" data-line-start="44" data-line-end="46"> Solid is a declarative JavaScript library for creating user interfaces. It does not use a Virtual DOM. Instead, it opts to compile its templates down to real DOM nodes and wrap updates in fine-grained reactions. This way when your state updates only the code that depends on it runs.</li> </ul> <p class="has-line-data" data-line-start="46" data-line-end="47"> 16:37 - <a href="https://stately.ai/">Stately</a></p> <ul> <li class="has-line-data" data-line-start="47" data-line-end="49"> From the company that made xState</li> </ul> <p class="has-line-data" data-line-start="49" data-line-end="50"> 18:05 - <a href= "https://web3js.readthedocs.io/en/v1.4.0/">Web3</a></p> <ul> <li class="has-line-data" data-line-start="50" data-line-end="51"> Let us know if you want a show about it</li> <li class="has-line-data" data-line-start="51" data-line-end="52"> Ethereum JavaScript API</li> <li class="has-line-data" data-line-start="52" data-line-end="54"> Apps that run on the Blockchain</li> </ul> <h2 class="code-line" data-line-start="54" data-line-end="55"> <a id="Links_54" name="Links_54"></a>Links</h2> <ul> <li class="has-line-data" data-line-start="55" data-line-end="56"> <a href="https://alpinejs.dev/">https://alpinejs.dev/</a></li> <li class="has-line-data" data-line-start="56" data-line-end="57"> <a href="https://svelte.dev/">https://svelte.dev/</a></li> <li class="has-line-data" data-line-start="57" data-line-end="59"> <a href="https://xstate.js.org/">https://xstate.js.org/</a></li> </ul> <h2 class="code-line" data-line-start="59" data-line-end="60"> <a id="Tweet_us_your_tasty_treats_59" name= "Tweet_us_your_tasty_treats_59"></a>Tweet us your tasty treats!</h2> <ul> <li class="has-line-data" data-line-start="60" data-line-end="61"> <a href="https://www.instagram.com/stolinski/">Scott’s Instagram</a></li> <li class="has-line-data" data-line-start="61" data-line-end="62"> <a href= "https://www.instagram.com/LevelUpTutorials/">LevelUpTutorials Instagram</a></li> <li class="has-line-data" data-line-start="62" data-line-end="63"> <a href="https://www.instagram.com/wesbos/">Wes’ Instagram</a></li> <li class="has-line-data" data-line-start="63" data-line-end="64"> <a href="https://twitter.com/wesbos">Wes’ Twitter</a></li> <li class="has-line-data" data-line-start="64" data-line-end="65"> <a href="https://www.facebook.com/wesbos.developer">Wes’ Facebook</a></li> <li class="has-line-data" data-line-start="65" data-line-end="66"> <a href="https://twitter.com/stolinski">Scott’s Twitter</a></li> <li class="has-line-data" data-line-start="66" data-line-end="67"> Make sure to include <a href= "https://twitter.com/SyntaxFM">@SyntaxFM</a> in your tweets</li> </ul>

In this Hasty Treat, Scott and Wes launch a new series called Git the Latest — New Things In Tech.
 Freshbooks - Sponsor Get a 30 day free trial of Freshbooks at freshbooks.com/syntax and put SYNTAX in the “How did you hear about us?” section.
 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.
 Show Notes 03:47 - GitHub CoPilot
  AI-powered autocompletion
 Not going to take your job
  07:18 - Next.js 11
  Image updates
 Multiplayer
  08:20 - Astro
  Build faster websites with less client-side JavaScript
  09:50 - Notion API
  Get database
 Query database
 Pages
 Block children
  11:27 - Petite Vue
  Petite Vue is an alternative distribution of Vue optimized for progressive enhancement
 Similar to Alpine.js
 Without a build step
  13:58 - Stackblitz
  Node in the browser
 Not in the cloud
 Rolled
  15:22 - Solid.js
  Solid is a declarative JavaScript library for creating user interfaces. It does not use a Virtual DOM. Instead, it opts to compile its templates down to real DOM nodes and wrap updates in fine-grained reactions. This way when your state updates only the code that depends on it runs.
  16:37 - Stately
  From the company that made xState
  18:05 - Web3
  Let us know if you want a show about it
 Ethereum JavaScript API
 Apps that run on the Blockchain
  Links  https://alpinejs.dev/

 https://svelte.dev/

 https://xstate.js.org/

  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

Hasty Treat - Git the Latest - New Things In Tech - CoPilot, Petite Vue, Stackblitz, Web3 + More!

Poslechněte si podcast