Syntax - Tasty Web Development Treats

Latest Episodes:

Why do we need Web Interop? Another Standards Body? May 16, 2022

Show notes

In this Hasty Treat, Scott and Wes talk about why we need Web Interop? Yet another standards body? Our thoughts on Serverless, Edge Compute, and more.

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.

Show Notes

00:23 Welcome
01:25 Sponsor: Sentry
02:25 Sponsor: Sanity
04:10 The Syntax Lift adventure
06:04 A new Community Group for Web-interoperable JavaScript runtimes.
07:07 JavaScript environments
09:19 What’s bun?
Bun
13:28 Are we excited about this?
16:27 What’s the future of this?

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

Supper Club × NX Monorepos with Victor Savkin May 13, 2022

Show notes

In this supper club episode of Syntax, Wes and Scott talk with Victor Savkin about NX Monorepo development.

Whiskey Web and Whatnot - Sponsor

Whiskey Web and Whatnot is different than your typical dev podcast. We show a lighter, more human side of developers you know and love, like a fireside chat with your favorite devs. Past guests include Tom Preston-Werner, Kent C. Dodds, Charlie Gerard, and of course Wes Bos! We have discussed everything from Next.js and TypeScript to Chuck’s past life as a blackjack dealer, Cincinnati Chili, the best casseroles, and of course whiskey!

Visit whiskeywebandwhatnot.fm or find them wherever you listen to podcasts.

Strapi - Sponsor

Strapi enables developers to build projects faster by providing a customizable API out of the box and giving them the freedom to use their favorite tool as it has both REST and GraphQL endpoints. Strapi is extensible and frontend agnostic, built to cover all your content use cases. Give Strapi a try at strapi.io/demo, find your missing content workflow piece on our marketplace,and learn more about Strapi and how it help you on our Youtube channel.

Show Notes

00:29 Welcome
02:42 Guest introduction
04:07 What tools did Google use?
10:49 What do bigger companies use for version control?
14:40 What is Nx?
Nx
21:02 How does Nx help you upgrade projects?
27:42 Sponsor: Whiskey Web and Whatnot
28:33 How does Nx fit into the existing tooling?
37:27 Sponsor: Strapi
39:02 Caching and skipping builds
44:50 The problem with caching
48:44 Is it used for images or video?
51:40 Small projects can benefit as well
53:13 Lightning questions
Happy Hacking KB
IntelliJ
LunarVim
VS Code
02:23 Shameless Plugs

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

10 Nifty Browser APIs May 11, 2022

Show notes

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

TypeScript Fundamentals × Narrowing, Discriminating Unions, and Type Guards May 09, 2022

Show notes

In this Hasty Treat, Scott and Wes talk about TypeScript Fundamentals, including narrowing, discriminating unions, and type guards.

Sentry - Sponsor

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

WTF is the Edge? Edge Compute / Functions May 04, 2022

Show notes

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

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

Why do people still use Axios over Fetch? May 02, 2022

Show notes

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

Sentry - Sponsor

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

JavaScript × STUMP’D Apr 27, 2022

Show notes

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

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

Building a Coupon Engine Apr 25, 2022

Show notes

In this Hasty Treat, Scott and Wes talk about the coupon engines they’ve built and use on their courses.

Prismic - Sponsor

LogRocket - Sponsor

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

Potluck - Working on a Team × Dealing with Imposter Syndrome × Animating on the Web × Icon Libraries × Demanding Clients Apr 20, 2022

Show notes

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

Sanity - Sponsor

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