Potluck - Immutability × Turning Off Your Brain × Types vs Interfaces × Hooks vs Components × Making the Most of Your First Job × Confidence in Svelte × More!

In this episode of Syntax, Wes and Scott talk about 10 browser API’s you might not be familiar with including getUserMedia, Resize Observer, SpeechRecognition, 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. 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. Freshbooks - Sponsor Get a 30 day free trial of Freshbooks at freshbooks.com/syntax Show Notes 00:13 Welcome 01:05 Dishwasher talk 04:30 getUserMedia Hair.WesBos.com Javascript 30 07:22 FileSystem Level Up Tutorials: Browser APIs Electron 12:50 Geolocation 15:07 Sponsor: Prismic 16:41 Permissions 22:36 Web Animations Web Animations API Framer Motion Motion One 26:31 Resize Observer Resize Observer API 29:33 Sponsor: LogRocket 30:45 Clipboard Clipboard API 34:10 Web storage Web storage 37:11 Sponsor: Freshbooks 38:09 SpeechSynthesis 41:32 SpeechRecognition 46:14 ××× SIIIIICK ××× PIIIICKS ××× ××× SIIIIICK ××× PIIIICKS ××× Scott: RCA to HDMI adapter Wes: SlimLED Shameless Plugs Scott: LevelUp Tutorials 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

11 Maj 20221h

In this Hasty Treat, Scott and Wes talk about TypeScript Fundamentals, including narrowing, discriminating unions, and type guards. 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. Payments Hub - Sponsor There are hundreds of payments processing companies out there. Hit up developer.paymentshub.com/syntax to learn more about how Payments Hub Developers not only processes ecommerce and in-person payments, but also boards and underwrites your merchants in as little as 90 minutes. We are currently offering Syntax listeners who become new partners 6 months free data through our Business Reporting API! Show Notes 00:24 Welcome 01:35 Sponsor: Sentry 02:23 Sponsor: Payments Hub 05:21 Intro to TypeScript fundamentals 06:28 What is Type Narrowing? 09:32 typeof 11:58 instanceof 13:29 Custom typeguards 16:12 this is 17:59 discriminated unions 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

9 Maj 202222min

In this episode of Syntax, Wes and Scott talk about what edge functions are, the upsides and downsides of edge functions, and what they’re used for. 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. 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. Freshbooks - Sponsor Get a 30 day free trial of Freshbooks at freshbooks.com/syntax. Show Notes 00:10 Welcome 01:56 A big announcement 04:33 What is the Edge? 08:27 The upsides of edge functions 12:13 Cold start 18:21 Sponsor: Linode 19:24 What are downsides of edge functions? 27:27 Sponsor: LogRocket 28:35 What is the use case for an edge function? 34:52 Authentication 37:23 Caching 40:51 Are there flavors of edge functions? 44:00 Sponsor: Freshbooks 46:06 What are edge functions not used for? 47:39 What companies offer this? 50:58 Sick Picks Netlify announcing serverless compute with edge functions Syntax 310 Serverless, Deno and TypeScript with Brian Leroux Vercel Middleware AWS Lambda ××× SIIIIICK ××× PIIIICKS ××× Scott: Patented History of Innovations Wes: Fastmov Precut Parchment Paper Shameless Plugs Scott: LevelUp Tutorials 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

4 Maj 202256min

In this Hasty Treat, Scott and Wes talk about why people still use Axios over Fetch, and why people wouldn’t use Axios. 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. 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 00:22 Welcome Twitter thread of questions from listeners 01:25 Sponsor: Linode 02:07 Sponsor: Sentry 03:04 What’s Axios? Syntax 224 - Serverless Cloud Functions 04:10 Why someone wouldn’t use Axios? 07:06 Interceptors 09:30 Catching expired JWT and renewing it 10:26 Upload or download progress events 12:03 Valid status API 13:45 Defaults 15:32 Custom timeouts 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

2 Maj 202219min

In this episode of Syntax, Wes and Scott ask each other hiring questions asked of JavaScript developers in job interviews. Kontent by Kentico - Sponsor Kontent by Kentico is a headless CMS that provides live editing experience to non-technical users and hands you the technical tools to build websites, mobile apps, voice assistants, or anything else where you need content. Use REST API or GraphQL and get your content via the global Fastly CDN. Designed to unify all your content and operations, in compliance with ISO27001 and SOC2Type2 certifications.Spin up a new project today and discover Kontent. 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. Freshbooks - Sponsor Get a 30 day free trial of Freshbooks at freshbooks.com/syntax Show Notes JavaScript Interview Questions 00:13 Let’s get STUMP’d 01:08 Cleaning out the garage 05:05 What are 4 methods available on weakmap? 07:07 How do you make an object iterable in JavaScript? 09:29 How do you make the first letter of a string into uppercase? 10:26 What is the typeof operator? 11:53 What are classes in ES6? 13:21 How do you enumerate key and value pairs of an object? 15:44 Kontent by Kentico 17:08 What is an event queue? 21:05 Why do you need JSON? 24:49 Why do you need a promise? 25:45 Explain the range overflow property 28:21 How do you return all matching strings against a matching expression? 30:14 Sponsor: LogRocket 30:51 What is a thunk function? 33:46 Can you redeclare let or const variables? 34:17 What are enhanced object literals? 35:56 What is the difference between call, apply, and bind? 38:52 Sponsor: Freshbooks 39:57 What are benefits of modules and why would you need them? 43:50 ××× SIIIIICK ××× PIIIICKS ××× 48:47 Shameless Plugs ××× SIIIIICK ××× PIIIICKS ××× Scott: Who ARTed Podcast Wes: Patio furniture Shameless Plugs Scott: LevelUp Tutorials 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

27 Apr 202250min

In this Hasty Treat, Scott and Wes talk about the coupon engines they’ve built and use on their courses. 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. 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:26 Welcome 01:12 Sponsor: Prismic 02:32 Sponsor: LogRocket 04:06 What we use for coupons Stripe Braintree 06:27 Structure of our coupons 10:43 Products and carts 13:59 Country validation 15:11 Affiliate codes 16:36 Chaining rules together 19:41 Tracking coupons 20:54 Automatically applied coupons 22:12 Quick tips for coupons 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

25 Apr 202226min

In this potluck episode of Syntax, Wes and Scott answer your questions about working on a team, dealing with imposter syndrome, animating on the web, using the table element, landing pages for apps, and building full stack apps with NextJS. 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. 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. Freshbooks - Sponsor Get a 30 day free trial of Freshbooks at freshbooks.com/syntax. Show Notes 00:10 Welcome 01:05 The mustard bandit podcast 02:54 How can Developers work with designers and Product managers seamlessly? 06:37 How do I deal with imposter syndrome? 10:46 Any good coffee shops in Denver? 17 of Denver’s Best Coffee Shops 11:38 Do you use Table element or CSS Grid for tabular data? 13:18 How do you manage animations without a library? Greensock 17:05 Sponsor: Sentry 18:01 What do you use for icon libraries? Icons8 Font Awesome Icons React Icons Flat Icons 25:10 How do you unregister the service worker to clear site data? Syntax 346 - Selling T Shirts 29:15 Sponsor: Sanity.io 30:47 Since NextJS has API routes, could you build a full-stack application using just NextJS? 35:41 Do you keep your landing pages and home pages seperate from your app? 37:35 Where’s the line for moving something hosted on a developer server to moving it to production? CodePen Replit Netlify 41:44 How do you deal with ignorant or demanding clients? 45:54 As a JS/TS developer, which other language should I learn to compliment my skills? Rust PHP 50:58 Sponsor: Freshbooks 51:49 ××× SIIIIICK ××× PIIIICKS ××× 58:41 Shameless Plugs ××× SIIIIICK ××× PIIIICKS ××× Scott: Glass Drinking Straws Wes: Lawn Lift Shameless Plugs Scott: LevelUp Tutorials Wes: Beginner Javascript 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

20 Apr 20221h 1min

In this Hasty Treat, Scott and Wes talk about Svelte Cubed and working in 3D in the browser. 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. 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:21 Welcome 01:00 Sponsor: LogRocket 01:41 Sponsor: Prismic 02:45 Intro to 3D in the browser Svelte Cubed Getting started with Svelte Cubed 03:49 Declarative vs imperative 07:43 How does Three.JS work? ThreeJS 12:28 Orbit controls 15:47 Svelte Cannon Svelte Cannon Blender 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

18 Apr 202220min