Wes Bos & Scott Tolinski - Full Stack JavaScript Web Developers

Zpravodajství

Technologické zprávy

Technika

Syntax Live React Edition

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.

It’s another live episode of Syntax in which Wes and Scott do Hook’d on Hooks, Who’s Snackin’ on React, Stump’d, Unpopular Opinions, Q & Eh, and more! <h2><a id="Sentry__Sponsor_9" name="Sentry__Sponsor_9"></a>Sentry - Sponsor</h2> If you want to know what’s happening with your errors, track them with <a href="https://sentry.io/">Sentry</a>. Sentry is open-source error tracking that helps developers monitor and fix crashes in real time. Cut your time on error resolution from five hours to five minutes. It works with any language and integrates with dozens of other services. Syntax listeners can get two months for free by visiting <a href= "https://sentry.io/">Sentry.io</a> and using the coupon code “tastytreat”. <h2><a id="The_Armoury__Sponsor_13" name= "The_Armoury__Sponsor_13"></a>The Armoury - Sponsor</h2> The Armoury is a men’s clothing and accessories retailer that provides some of the highest quality clothing you can buy. Designed for those of you who want the highest quality clothing that feels great and will last forever. Buy less, buy better. Follow them on Instagram <a href= "https://www.instagram.com/thearmourynyc/">@thearmourynyc</a> and check out their website <a href= "https://thearmoury.com/">TheArmoury.com</a>. <h2><a id="Show_Notes_17" name="Show_Notes_17"></a>Show Notes</h2> 6:54 - Who’s Snackin’ On React Guess which of these websites have their homepage partially or fully built in React? <ul> <li><a href= "https://www.eltonjohn.com/">EltonJohn.com</a> or <a href="https://www.arianagrande.com/">ArianaGrande.com</a>?</li> <li><a href= "http://ferrari.com/">Ferrari.com</a> or <a href= "http://lamborghini.com/">Lamborghini.com</a>?</li> <li><a href= "https://app.starbucks.com/">Starbucks.com</a> or <a href="http://dunkindonuts.com/">Dunkindonuts.com</a>?</li> <li><a href= "http://wayfair.com/">WayFair.com</a> or <a href= "http://ikea.com/">Ikea.com</a>?</li> <li><a href= "https://www.walgreens.com/">Walgreens.com</a> or <a href="https://www.cvs.com/">Cvs.com</a>?</li> </ul> 10:55 - Hook’d on Hooks <ul> <li> Wes: <ul> <li>useSocket</li> <li>useStaticQuery (gatsby)</li> <li>useKeyPress</li> </ul> </li> <li> Scott <ul> <li>useLocalStorage</li> <li>useClickOutside</li> <li>useMeasure</li> <li>useGesture</li> </ul> </li> </ul> 17:47 - This, That, Both, or Neither? <ul> <li>Gutenborg: A WordPress GUI plugin for creating react-based gutenberg blocks, or a 90’s budget TV show about Cyborgs who read?</li> <li>Nashorn: A Java based JavaScript engine developed by Oracle, or a popular rock climbing spot in Portland?</li> <li>Easy Peasy: A React state library, or children’s spoon set?</li> <li>Use Boxmen: A hooks library that gets box model dimension, or a puzzle-based strategy game for children?</li> <li>Toggs: A lightweight styleable toggle component, or rain resistant outdoor gear?</li> <li>Landwind: A set of React components for using the Tailwinds CSS Library, or a Chinese Knock-off Land Rover SUV?</li> <li>Freeflow: A redux-like state management library built on state, context and hooks, or a California-based hot tub company?</li> <li>Ubergrippen: A popular rock climbing spot in Denver, or a client-side video stabilization framework built on the filereader API?</li> </ul> 26:22 - Tag Team Coding React <ul> <li>Fetch Data from the data jokes API</li> <li>Show a loading indicator</li> <li>Have a button to fetch a new joke</li> </ul> 36:24 - Stump’d <ul> <li>What is a react PureComponent for?</li> <li>Why might you use a callback with setState?</li> <li>How would you reverse an array without mutating the original array?</li> <li>Can you explain what a “downtown job” is?</li> <li>When would you use useReducer?</li> <li>What makes useLayoutEffect different from useEffect?</li> <li>What propType would you use for an object that contains a number and a string</li> </ul> 43:11 - Unpopular Opinions. Overrated, Underrated? <ul> <li>Our own unpopular opinions <ul> <li>Scott: React devs like to make things harder than they need to be.</li> </ul> </li> <li><a href= "https://twitter.com/dan_abramov/status/1109461037391187968">Dan Abramov</a></li> <li><a href= "https://twitter.com/ryanflorence/status/1109513902721634304">Ryan Florence</a></li> <li><a href= "https://twitter.com/sebmarkbage/status/1109481482421067776">Sebastian Markbage</a></li> <li><a href= "https://twitter.com/jaredpalmer/status/1109504427562545153">Jared Palmer</a></li> <li><a href= "https://twitter.com/TheLarkInn/status/1109516791565303808">Sean Thomas Larkin</a></li> <li><a href= "https://twitter.com/latviancoder/status/1109465342215114752">Sergey Ryzhov</a></li> <li><a href= "https://twitter.com/sophiebits/status/1109581621680730113">Sophie Alpert</a></li> <li><a href= "https://twitter.com/_googlemac/status/1109461529055756288">Parker McMullin</a></li> <li>Vue does it better _____</li> </ul> 52:45 - Q + EH with Wes and Scott <ul> <li>What where the first apps you worked on?</li> <li>What React problem stumped you for the longest time?</li> <li>What’s your most expensive mistake?</li> <li>Do we need classes in Javascript?</li> <li>How do you explain what you do to your mom?</li> <li>How do you explain React?</li> <li>What made you start wanting to code?</li> <li>What’s the hackiest thing you’ve ever done?</li> <li>Where do you see yourselves in 10 years?</li> </ul> <h2><a id="Tweet_us_your_tasty_treats_95" name= "Tweet_us_your_tasty_treats_95"></a>Tweet us your tasty treats!</h2> <ul> <li><a href="https://www.instagram.com/stolinski/">Scott’s Instagram</a></li> <li><a href= "https://www.instagram.com/LevelUpTutorials/">LevelUpTutorials Instagram</a></li> <li><a href="https://www.instagram.com/wesbos/">Wes’ Instagram</a></li> <li><a href="https://twitter.com/wesbos">Wes’ Twitter</a></li> <li><a href="https://www.facebook.com/wesbos.developer">Wes’ Facebook</a></li> <li><a href="https://twitter.com/stolinski">Scott’s Twitter</a></li> <li>Make sure to include <a href= "https://twitter.com/SyntaxFM">@SyntaxFM</a> in your tweets</li> </ul>

It’s another live episode of Syntax in which Wes and Scott do Hook’d on Hooks, Who’s Snackin’ on React, Stump’d, Unpopular Opinions, Q & Eh, and more!
 Sentry - Sponsor If you want to know what’s happening with your errors, track them with Sentry. Sentry is open-source error tracking that helps developers monitor and fix crashes in real time. Cut your time on error resolution from five hours to five minutes. It works with any language and integrates with dozens of other services. Syntax listeners can get two months for free by visiting Sentry.io and using the coupon code “tastytreat”.
 The Armoury - Sponsor The Armoury is a men’s clothing and accessories retailer that provides some of the highest quality clothing you can buy. Designed for those of you who want the highest quality clothing that feels great and will last forever. Buy less, buy better. Follow them on Instagram @thearmourynyc and check out their website TheArmoury.com.
 Show Notes 6:54 - Who’s Snackin’ On React
 Guess which of these websites have their homepage partially or fully built in React?

EltonJohn.com or ArianaGrande.com?

Ferrari.com or Lamborghini.com?

Starbucks.com or Dunkindonuts.com?

WayFair.com or Ikea.com?

Walgreens.com or Cvs.com?
 10:55 - Hook’d on Hooks
  Wes:
 useSocket
 useStaticQuery (gatsby)
 useKeyPress

 Scott
 useLocalStorage
 useClickOutside
 useMeasure
 useGesture

 17:47 - This, That, Both, or Neither?
 Gutenborg: A WordPress GUI plugin for creating react-based gutenberg blocks, or a 90’s budget TV show about Cyborgs who read?
 Nashorn: A Java based JavaScript engine developed by Oracle, or a popular rock climbing spot in Portland?
 Easy Peasy: A React state library, or children’s spoon set?
 Use Boxmen: A hooks library that gets box model dimension, or a puzzle-based strategy game for children?
 Toggs: A lightweight styleable toggle component, or rain resistant outdoor gear?
 Landwind: A set of React components for using the Tailwinds CSS Library, or a Chinese Knock-off Land Rover SUV?
 Freeflow: A redux-like state management library built on state, context and hooks, or a California-based hot tub company?
 Ubergrippen: A popular rock climbing spot in Denver, or a client-side video stabilization framework built on the filereader API?
 26:22 - Tag Team Coding React
 Fetch Data from the data jokes API
 Show a loading indicator
 Have a button to fetch a new joke
 36:24 - Stump’d
 What is a react PureComponent for?
 Why might you use a callback with setState?
 How would you reverse an array without mutating the original array?
 Can you explain what a “downtown job” is?
 When would you use useReducer?
 What makes useLayoutEffect different from useEffect?
 What propType would you use for an object that contains a number and a string
 43:11 - Unpopular Opinions. Overrated, Underrated?
 Our own unpopular opinions Scott: React devs like to make things harder than they need to be.

 Dan Abramov
 Ryan Florence
 Sebastian Markbage
 Jared Palmer
 Sean Thomas Larkin
 Sergey Ryzhov
 Sophie Alpert
 Parker McMullin
 Vue does it better _____
 52:45 - Q + EH with Wes and Scott
 What where the first apps you worked on?
 What React problem stumped you for the longest time?
 What’s your most expensive mistake?
 Do we need classes in Javascript?
 How do you explain what you do to your mom?
 How do you explain React?
 What made you start wanting to code?
 What’s the hackiest thing you’ve ever done?
 Where do you see yourselves in 10 years?
 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

Syntax Live React Edition

Poslechněte si podcast