Syntax - Tasty Web Development Treats

By Wes Bos & Scott Tolinski - Full Stack JavaScript Web Developers

Listen to a podcast, please open Podcast Republic app. Available on Google Play Store.


Category: Technology

Open in Apple Podcasts


Open RSS feed


Open Website


Rate for this podcast

Subscribers: 1710
Reviews: 5

Arthur
 Mar 28, 2022
I'm a backend Java developer and still find this podcast entertaining and informative. It helps me to keep an eye on what's going on in the front end world.


 Feb 8, 2020
i listen to practically every episode, and gain tips all the time.


 Oct 24, 2018

james
 Sep 20, 2018
funny and informative for web devs

A Podcast Republic user
 Sep 5, 2018

Description

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.

Episode Date
HTTPS + Tunnel Your Localhost - Cloudflare Tunnels, Ngrok, and more!
30:18

In this Hasty Treat, Scott and Wes talk about why you might need to tunnel to your local computer, and how to set that up securely.

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

Tweet us your tasty treats

Mar 20, 2023
Supper Club × Next.js on AWS + Serverless with Dax Raad
55:42

In this supper club episode of Syntax, Wes and Scott talk with Dax Raad about building on serverless infrastructure, Next.js, and SST.

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

××× SIIIIICK ××× PIIIICKS ×××

Shameless Plugs

Tweet us your tasty treats

Mar 17, 2023
New Syntax Website Brainstorm! IRL!
51:48

In this episode of Syntax, Wes and Scott are in the same room together brainstorming new ideas for the Syntax.fm website: search, transcripts, video, tags, audio player, podcast hosting, 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.

Show Notes

××× SIIIIICK ××× PIIIICKS ×××

Shameless Plugs

Tweet us your tasty treats

Mar 15, 2023
Web Streams Explained
34:28

In this Hasty Treat, Scott and Wes explain the what, why, and how of web streaming, and some of the jargon you might encounter with web streams.

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

Tweet us your tasty treats

Mar 13, 2023
Supper Club × Digital Nomad with Eric Sartorius
01:03:01

In this supper club episode of Syntax, Wes and Scott talk with Eric Sartorius about his life as a digital nomad - including recently climbing Kilimanjaro, his tips for travel deals, crazy experiences while travelling, and what he brings on the road with him.

Show Notes

××× SIIIIICK ××× PIIIICKS ×××

Shameless Plugs

Tweet us your tasty treats

Mar 10, 2023
Fundamentals × What Makes a Website Slow?
01:05:10

In this episode of Syntax, Wes and Scott talk through all the reasons your website might be slow, and how you can troubleshoot a slow website such as issues on the server, large assets, caching, CSS, JavaScript, latency, 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.

Show Notes

××× SIIIIICK ××× PIIIICKS ×××

Shameless Plugs

Tweet us your tasty treats

Mar 08, 2023
Node in the Browser × WebContainers + NodeBox
29:02

In this Hasty Treat, Scott and Wes talk about two new services that allow you to run Node in the browser, WebContainers + NodeBox. Why Node in the browser? How does it work? And what are the differences and limitations of the services?

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

Tweet us your tasty treats

Mar 06, 2023
Supper Club × Visual Coding Languages With Steve Sewell
59:28

In this supper club episode of Syntax, Wes and Scott talk with Steve Sewell about Builder.io, Qwik, Partytown, and the tricks and tips he’s learned in building apps for the modern web.

Show Notes

××× SIIIIICK ××× PIIIICKS ×××

Tweet us your tasty treats

Mar 03, 2023
AI and Coding with ChatGPT
01:06:03

In this episode of Syntax, Wes and Scott talk about the current landscape of AI, how AI is trained, is AI going to take your job, who’s going to train AI, and adding AI to your applications.

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

××× SIIIIICK ××× PIIIICKS ×××

Shameless Plugs

Tweet us your tasty treats

Mar 01, 2023
Clean vs Sloppy Code
28:13

In this Hasty Treat, Scott and Wes talk about the difference between sloppy code and clean code, how to establish rules for your code base, and how to enforce your rules.

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

Tweet us your tasty treats

Feb 27, 2023
Supper Club × Astro 2.0 with Fred Schott
58:54

In this supper club episode of Syntax, Wes and Scott talk with Fred Schott about all things Astro v2.0. What is Astro and why should you use it? How do islands work? Images, edge, AI, error overlays, hybrid rendering, and more!

Show Notes

××× SIIIIICK ××× PIIIICKS ×××

Shameless Plugs

Tweet us your tasty treats

Feb 24, 2023
Warp Terminal × Next Gen Terminals
01:06:39

In this episode of Syntax, Wes and Scott talk about why they’re digging Warp as their terminal app of choice, what the terminal is, and some of their wishlist items for Warp.

Show Notes

××× SIIIIICK ××× PIIIICKS ×××

Shameless Plugs

Tweet us your tasty treats

Feb 22, 2023
Logging
25:57

In this Hasty Treat, Scott and Wes talk about the reasons why you should log errors, how it’s not just for debugging, where to save logs, and apps and packages to help with logging.

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

Tweet us your tasty treats

Feb 20, 2023
Supper Club × Solid.js with Ryan Carniato
01:05:43

In this supper club episode of Syntax, Wes and Scott talk with Ryan Carniato about Solid.JS, SolidStart, how web components work with Solid, why he chose JSX, and what the future of Solid is.

Show Notes

××× SIIIIICK ××× PIIIICKS ×××

Shameless Plugs

Tweet us your tasty treats

Feb 17, 2023
Potluck × Native Web Components × JS Class Mixins × Application Secrets
01:06:56

In this potluck episode, Scott and Wes talk home electicity, and then answer your questions about native web components, JS class mixins, JavaScript for marketers, managing application secrets, 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.

Show Notes

  • 00:10 Welcome
  • 01:09 Sponsor: Sentry
  • 02:18 Electrical house update
  • Klien Wirestrippers
  • 07:45 Custom Syntax podcast browser
  • Custom Syntax browser
  • 09:29 When using browser native web components (i.e. extends HTMLElement), should the whole application be wrapped in a component tree similar to how React apps do it?
  • Deno
  • Using Web Components with Next or any SSR Framework
  • 16:12 Should I avoid JS/TS class mixins?
  • 21:07 Is it acceptable to have any string value as a value for a CSS custom property?
  • 26:48 Should agencies consider building marketing sites with JS frameworks or is Wordpress still the best option here?
  • 33:56 What are the main things to think about when laying the foundations for an app or project that will hopefully grow into something big?
  • 41:24 Will Javascript skills give me an edge over other local digital marketers?
  • WordPress
  • Ghost
  • 46:00 What tool, if any, do you use for publishing packages?
  • 50:19 Do you have any suggestions on how I can find time to code more?
  • Bit
  • 54:17 how do you both manage your application secrets (API keys, database credentials etc) when deploying to Digital Ocean or Linode?
  • 58:52 SIIIIICK ××× PIIIICKS ×××

××× SIIIIICK ××× PIIIICKS ×××

Tweet us your tasty treats

Feb 15, 2023
Save us from Config File Hell
24:46

In this Hasty Treat, Scott and Wes talk about what you can do to better organize your config files.

Show Notes

 define: {   __VERSION__: JSON.stringify(process.env.npm_package_version), },  

Tweet us your tasty treats

Feb 13, 2023
Supper Club × Qwik framework from Miško Hevery, the Creator of Angular
01:07:44

In this supper club episode of Syntax, Wes and Scott talk with Miško Hevery about why developers should check out Qwik, the benefits of lazy loading, sharing state between components, and other Builder.io projects like Partytown and Mitosis.

Show Notes

××× SIIIIICK ××× PIIIICKS ×××

Shameless Plugs

Tweet us your tasty treats

Feb 10, 2023
Converting JS to TypeScript
01:12:31

In this episode of Syntax, Wes and Scott talk about their respective processes for converting JavaScript to TypeScript in their projects, why you might want to, and tooling for moving to TypeScript.

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

××× SIIIIICK ××× PIIIICKS ×××

Shameless Plugs

Tweet us your tasty treats

Feb 08, 2023
Polish and Perf
21:19

In this Hasty Treat, Scott and Wes talk through quick tips to improve performance of your website, and the tools available to help diagnose and fix perf issues.

Show Notes

Tweet us your tasty treats

Feb 06, 2023
Supper Club × Rust In Action with Tim McNamara
58:16

In this supper club episode of Syntax, Wes and Scott talk with Tim McNamara, author of Rust in Action about what Rust is, how to get started learning Rust, and ideas of good projects to begin learning Rust with.

Show Notes

××× SIIIIICK ××× PIIIICKS ×××

Shameless Plugs

Tweet us your tasty treats

Feb 03, 2023
570
01:01:32

In this episode of Syntax, Wes and Scott talk through what ESM is, and why you want to move your projects to ESM.

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

××× SIIIIICK ××× PIIIICKS ×××

Shameless Plugs

Tweet us your tasty treats

Feb 01, 2023
CSS Wishlist
35:12

In this Hasty Treat, Scott and Wes talk through their wishlist for CSS in 2023 including mixins, range selectors, fit text, robust color functions, overflown, and more.

Show Notes

Tweet us your tasty treats

Jan 30, 2023
Supper Club × Caleb Porzio
01:05:12

In this supper club episode of Syntax, Wes and Scott talk with Caleb Porzio about Livewire, Alpine.js, what is it with PHP devs making cool stuff, TypeScript thoughts, and more.

Show Notes

××× SIIIIICK ××× PIIIICKS ×××

Shameless Plugs

Tweet us your tasty treats

Jan 27, 2023
We React to State of JS 2022
01:11:04

In this episode of Syntax, Wes and Scott look through the results of the State of JS survey for 2022.

Show Notes

Shameless Plugs

Tweet us your tasty treats

Jan 25, 2023
Container Queries Explained
25:45

In this Hasty Treat, Scott and Wes explain what container queries are, use cases for them, new units of measurement, and possible issues with container queries.

Show Notes

Tweet us your tasty treats

Jan 23, 2023
Supper Club × Simen Svale Skogsrud and Espen Hovlandsdal from Sanity
54:59

In this supper club episode of Syntax, Wes and Scott talk with Simen & Espen from Sanity about what Sanity is, who uses Sanity, what is a content lake, how Sanity works with React or TypeScript, what GROQ is, how portable text works, and of course, the supper club questions.

Show Notes

××× SIIIIICK ××× PIIIICKS ×××

Shameless Plugs

Tweet us your tasty treats

Jan 20, 2023
Potluck × JS Modules × HTML Tags × Recession × Budgeting
01:04:58

In this potluck episode of Syntax, Wes and Scott answer your questions about HTML tags, budgeting, recession proofing your business, software dev vs software engineer, taking payments, and more.

Show Notes

××× SIIIIICK ××× PIIIICKS ×××

Shameless Plugs

Tweet us your tasty treats

Jan 18, 2023
Buy It or Build It? A Service is Not a Solution
44:09

In this Hasty Treat, Scott and Wes talk about the differences between building it yourself vs paying for a service to do it for you, such as cron jobs, checkout, hosting, images, video, and more.

Show Notes

Tweet us your tasty treats

Jan 16, 2023
Katherine Mello on Liberal Arts → Coding, Bootcamps, and Sustainability
56:10

In this supper club episode of Syntax, Wes and Scott talk with Katherine Mello about her journey into coding from liberal arts to bootcamp education, data visualization, and coding for a sustainable focused company.

Show Notes

××× SIIIIICK ××× PIIIICKS ×××

Shameless Plugs

Tweet us your tasty treats

Jan 13, 2023
2023 Goals × Learning and Doing
01:04:43

In this episode of Syntax, Wes and Scott talk through their goals for 2023 including coding, tooling, courses and platforms, social media, and fitness.

Show Notes

××× SIIIIICK ××× PIIIICKS ×××

Shameless Plugs

Tweet us your tasty treats

Jan 11, 2023
TypeScript Fundamentals × Satisfies and as const
22:49

In this Hasty Treat, Scott and Wes talk about Satisfies and as const.

Show Notes

 export const currencies = { USD: 'US Dollars', CAD: 'Canadian Dollar', EUR: 'Euro', } as const;  export type Currency = typeof currencies; export type CurrencyCode = keyof Currency;  

Tweet us your tasty treats

Jan 09, 2023
Supper Club × Sarah Drasner on Engineering Management
55:11

In this supper club episode of Syntax, Wes and Scott talk with Sarah Drasner about her new book, Engineering Management for the Rest of Us, what it’s like moving from management to coding and back, the book writing process, and her Fortnite VS Code theme.

Show Notes

××× SIIIIICK ××× PIIIICKS ×××

Shameless Plugs

Tweet us your tasty treats

Jan 06, 2023
Our Predictions for 2023
01:09:07

In this episode of Syntax, Wes and Scott talk about their predictions in web development for 2023.

Show Notes

  • 00:07 Welcome
  • 01:25 SSR JS sites more the norm
  • 03:32 React doing forms
  • 05:39 TypeScript Inferred becomes hot
  • 08:11 Deno gets hotter
  • 12:51 JS Runtimes Mature
  • HTMX
  • 15:00 We will see a new TS Type Checker written in Rust
  • 19:20 New JS APIs
  • 23:37 Writing towards Winter CG Spec Popular. “Worker Ready” script
  • STC
  • 27:05 A new JS framework
  • SolidJS
  • Qwik
  • 29:44 Page Transitions API
  • 32:40 Scott was right / Scotts gonna be right
  • 34:06 Rust becomes more Popular
  • 36:00 React Beta Docs launch after 5 year dev cycle
  • 37:45 CSS Container Queries in Production
  • 41:07 Svelte and Sveltekit Glow Up
  • 43:38 CSS Subgrid
  • 49:19 WASM
  • 51:51 AI
  • Open AI
  • 53:16 Houdini
  • 54:30 People souring on React, Eslint
  • 57:47 Machine learning
  • 01:08 SIIIIICK ××× PIIIICKS ×××

××× SIIIIICK ××× PIIIICKS ×××

Shameless Plugs

Tweet us your tasty treats

Jan 04, 2023
TypeScript Fundamentals × Type Narrowing, Guards, and Predicates
22:58

In this episode of Syntax, Wes and Scott talk through some TypeScript Fundamentals around type narrowing, type guards, and type predicates.

Show Notes

Shameless Plugs

Tweet us your tasty treats

Jan 02, 2023
Supper Club × Polypane with Kilian Valkhof
58:30

In this supper club episode of Syntax, Wes and Scott talk with Kilian Valkhof about his work on Polypane, a browser for developers. How is Polypane built? Why does he have a focus on accessibility in Polypane?

Show Notes

Shameless Plugs

Tweet us your tasty treats

Dec 30, 2022
Were We Wrong? 2022 Predictions Revisited
01:00:12

In this episode of Syntax, Wes and Scott revisit their 2022 predictions and see which ones they got right, and which they got wrong.

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.

Auth0 - Sponsor

Auth0 is the easiest way for developers to add authentication and secure their applications. They provides features like user management, multi-factor authentication, and you can even enable users to login with device biometrics with something like their fingerprint. Not to mention, Auth0 has SDKs for your favorite frameworks like React, Next.js, and Node/Express. Make sure to sign up for a free account and give Auth0 a try with the link below. https://a0.to/syntax

Show Notes

××× SIIIIICK ××× PIIIICKS ×××

Shameless Plugs

Tweet us your tasty treats

Dec 28, 2022
554: Desktop apps in JS × Electron and Tauri
27:07

In this Hasty Treat, Scott and Wes talk about the current state of building desktop apps with Electron or Tauri.

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.

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.

Show Notes

Tweet us your tasty treats

Dec 26, 2022
553: Supper Club × Switching into Coding and climbing the Pommade ladder with Kenneth Lyerly
47:26

In this supper club episode of Syntax, Wes and Scott talk with Kenneth Lyerly about his career path into coding, and how he manages to hold two jobs.

Show Notes

××× SIIIIICK ××× PIIIICKS ×××

Shameless Plugs

Tweet us your tasty treats

Dec 23, 2022
552: Potluck × Twitter Thoughts × Business Models × Senior Developer
01:06:44

In this potluck episode of Syntax, Wes and Scott answer your questions about how to give feedback on the podcast, deciding on a business model for courses, what to do about Twitter, and more.

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.

Freshbooks - Sponsor

Get a 30 day free trial of Freshbooks at freshbooks.com/syntax

Show Notes

××× SIIIIICK ××× PIIIICKS ×××

Shameless Plugs

Tweet us your tasty treats

Dec 21, 2022
“Serverless” Databases
27:37

In this episode of Syntax, Wes and Scott talk about your options for database when you’re working with serverless.

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

Tweet us your tasty treats

Dec 19, 2022
Supper Club × React Video Creator with Jonny Burger
57:12

In this supper club episode of Syntax, Wes and Scott talk with Jonny Burger about why and how he built Remotion, his app that lets you create MP4 videos using React.

Gatsby - Sponsor

Today’s episode was sponsored by Gatsby, the fastest frontend for the headless web. Gatsby is the framework of choice for content-rich sites backed by a headless CMS as its GraphQL data layer makes it straightforward to source website content from anywhere. Gatsby’s opinionated, React-based framework makes the hardest parts of building a performant website simpler. Visit Gatsby.dev/Syntax to get your first Gatsby site up in minutes and experience the speed. ⚡️

Tuple - Sponsor

This week’s sponsor is Tuple, an app built specifically for remote pair programming. The app is written in C++ and tuned for high-resolution screen sharing and low-latency remote control. Because developers deserve better than Zoom or Meet for pairing.

Show Notes

××× SIIIIICK ××× PIIIICKS ×××

Shameless Plugs

Tweet us your tasty treats

Dec 16, 2022
JavaScript in 2022
01:09:56

In this episode of Syntax, Wes and Scott look at the the Web Almanac’s report on the role of JavaScript on the web in 2022.

Auth0 - Sponsor

Auth0 is the easiest way for developers to add authentication and secure their applications. They provides features like user management, multi-factor authentication, and you can even enable users to login with device biometrics with something like their fingerprint. Not to mention, Auth0 has SDKs for your favorite frameworks like React, Next.js, and Node/Express. Make sure to sign up for a free account and give Auth0 a try with the link below. https://a0.to/syntax

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.

Freshbooks - Sponsor

Get a 30 day free trial of Freshbooks at freshbooks.com/syntax

Show Notes

××× SIIIIICK ××× PIIIICKS ×××

Shameless Plugs

Tweet us your tasty treats

Dec 14, 2022
Rendering Methods Explained
28:22

In this Hasty Treat, Scott and Wes talk through the various rendering methods in use today and the pros / cons of each.

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:26 Welcome
  • 01:31 What is rendering?
  • 02:41 Sponsor: Sentry
  • 03:58 Sponsor: Sanity
  • 04:55 Rendering methods
  • 05:48 Single page application (SPA)
  • 07:36 Multi-page Application
  • 09:14 Static Site Generation (SSG)
  • 11:10 Service Side Rendered (SSR)
  • 13:08 Partial hydration
  • 14:03 Progressive hydration
  • 15:38 Island architecture
  • 16:25 Progressive enhancement
  • 18:18 Incremental Static Generation
  • 19:12 Streaming SSR
  • 19:53 Resumability
  • 21:51 Edge rendering
  • 23:11 Missing from the list

Tweet us your tasty treats

Dec 12, 2022
Supper Club × Coding at Disney with Vu Le
49:52

In this supper club episode of Syntax, Wes and Scott talk with Vu Le about his path to working at Disney. How did he learn to code? How do you get a job at Disney? What’s the tech stack inside a Disney team?

Tuple - Sponsor

This week’s sponsor is Tuple, an app built specifically for remote pair programming. The app is written in C++ and tuned for high-resolution screen sharing and low-latency remote control. Because developers deserve better than Zoom or Meet for pairing.

Show Notes

××× SIIIIICK ××× PIIIICKS ×××

  • Garden hose connectors

Tweet us your tasty treats

Dec 09, 2022
Code Styles: Readable Rules and Petty Preferences
01:09:13

In this episode of Syntax, Wes and Scott talk about their preferred coding styles and preferences they use, and why.

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:11 Welcome
  • 02:35 Function definition
  • 06:43 File path aliases
  • 09:36 Implicit vs Explicit Return
  • 13:49 Array.reduce() VS literally anything else
  • 17:37 Loop vs array method
  • 22:55 Sponsor: Linode
  • 23:37 Updating vs creating a new var
  • 30:36 Iterable to Array
  • 34:46 Sponsor: LogRocket
  • 36:16 Destructuring vs Object.property
  • 39:22 Destructuring Arrays vs Reference by index
  • 41:40 Number(string) vs +string
  • 43:35 Incrementing
  • 45:06 Multiple ifs
  • 47:48 Multiple ifs vs switch vs Ternary
  • 51:05 Promises / Error Catching
  • 53:50 if(falsy) block VS return false;
  • 55:51 Sponsor: Freshbooks
  • 56:26 Spaces vs tabs
  • 58:39 Trailing commas
  • 00:40 Semicolons
  • 02:49 SIIIIICK ××× PIIIICKS ×××

××× SIIIIICK ××× PIIIICKS ×××

Shameless Plugs

Tweet us your tasty treats

Dec 07, 2022
GitHub Next Projects
32:03

In this Hasty Treat, Scott and Wes talk about new features coming to GitHub including Hey, GitHub!, GitHub Blocks, GitHub Copilot CLI, and more!

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.

Show Notes

Tweet us your tasty treats

Dec 05, 2022
Supper Club × Bun with Jared Sumner
51:04

In this supper club episode of Syntax, Wes and Scott talk with Jared Sumner about why and how he created Bun, what Zig is, and the future of Bun.

Tuple - Sponsor

This week’s sponsor is Tuple, an app built specifically for remote pair programming. The app is written in C++ and tuned for high-resolution screen sharing and low-latency remote control. Because developers deserve better than Zoom or Meet for pairing. Tuple.app.

Show Notes

××× SIIIIICK ××× PIIIICKS ×××

Tweet us your tasty treats

Dec 02, 2022
Potluck × Twitter Following × TypeScript × Playwright
57:31

In this potluck episode of Syntax, Wes and Scott answer your questions about strategies to find good Twitter follows, should we use TypeScript for a company blog, what’s Playwright, 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.

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.

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

××× SIIIIICK ××× PIIIICKS ×××

Shameless Plugs

Tweet us your tasty treats

Nov 30, 2022
Serverless Limitations
20:28

In this episode of Syntax, Wes and Scott talk through some of the limitations of using serverless in your project.

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.

MagicBell - Sponsor

MagicBell is the the notification inbox for your product. Add a MagicBell to your product for announcements, billing, workflow, and other notifications. The free plan supports up to 100 Monthly Active Users - use the coupon code SYNTAXFM for 10% off the first 12 months.

Show Notes

Shameless Plugs

Tweet us your tasty treats

Nov 28, 2022
Supper Club × Anything But Coding with Wes and Scott
01:01:46

In this supper club episode of Syntax, Wes and Scott talk with Scott and Wes! Talking about BBQ, electric cars, workout equipment, home renos - but they do sneak in a bit of coding talk!

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.

Tuple - Sponsor

This week’s sponsor is Tuple, an app built specifically for remote pair programming. The app is written in C++ and tuned for high-resolution screen sharing and low-latency remote control. Because developers deserve better than Zoom or Meet for pairing. https://tuple.app/syntax

Show Notes

Tweet us your tasty treats

Nov 25, 2022
Responsive Design Techniques
01:01:56

In this episode of Syntax, Wes and Scott talk through some modern responsive design techniques that you may not have heard of, or haven’t had a chance to use yet.

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

××× SIIIIICK ××× PIIIICKS ×××

Shameless Plugs

Tweet us your tasty treats

Nov 23, 2022
React use() hook and Async Server Components Proposal
22:11

In this Hasty Treat, Scott and Wes talk about the new proposal for React, what the basics of it are, why it’s being proposed, and some benefits and issues it brings up.

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.

Auth0 - Sponsor

Auth0 is the easiest way for developers to add authentication and secure their applications. They provides features like user management, multi-factor authentication, and you can even enable users to login with device biometrics with something like their fingerprint. Not to mention, Auth0 has SDKs for your favorite frameworks like React, Next.js, and Node/Express. Make sure to sign up for a free account and give Auth0 a try with the link below. https://a0.to/syntax

Show Notes

Tweet us your tasty treats

Nov 21, 2022
Supper Club × Ryan Dahl and Deno
55:34

In this supper club episode of Syntax, Wes and Scott talk with Ryan Dahl about Deno. Why was Deno created? What is Deno written in? How is Deno so much faster? And what’s the future of Deno?

Gatsby - Sponsor

Today’s episode was sponsored by Gatsby, the fastest frontend for the headless web. Gatsby is the framework of choice for content-rich sites backed by a headless CMS as its GraphQL data layer makes it straightforward to source website content from anywhere. Gatsby’s opinionated, React-based framework makes the hardest parts of building a performant website simpler. Visit Gatsby.dev/Syntax to get your first Gatsby site up in minutes and experience the speed. ⚡️

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

Tweet us your tasty treats

Nov 18, 2022
CSS Trends Almanac for 2022 Part 2
58:41

In this episode of Syntax, it’s part 2 of Wes and Scott’s journey through the CSS Trends Almanac for 2022 talking through the rest of the popular CSS properties on the web.

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.

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.

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

××× SIIIIICK ××× PIIIICKS ×××

Shameless Plugs

Tweet us your tasty treats

Nov 16, 2022
Short Form Content with Tiktok, Reels, Shorts, Tweets
36:30

In this Hasty Treat, Scott and Wes talk about creating short form content for TikTok, Reels, Shorts, and tweets. What are some of the benefits and limitations of creating for vertical video, and what tools are they using to create videos.

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.

Freshbooks - Sponsor

Get a 30 day free trial of Freshbooks at freshbooks.com/syntax

Show Notes

Tweet us your tasty treats

Nov 14, 2022
Supper Club × Open Table LIVE SHOW
01:05:58

In this supper club episode of Syntax, Wes and Scott recorded a live open table episode with guests calling in to talk about Wasm, building Riverside.fm, home networking, getting a job at Microsoft, Svelte and Sveltekit, htmx, and more!

Auth0 - Sponsor

Auth0 is the easiest way for developers to add authentication and secure their applications. They provides features like user management, multi-factor authentication, and you can even enable users to login with device biometrics with something like their fingerprint. Not to mention, Auth0 has SDKs for your favorite frameworks like React, Next.js, and Node/Express. Make sure to sign up for a free account and give Auth0 a try with the link below. https://a0.to/syntax

Appwrite - Sponsor

Appwrite is a self-hosted backend-as-a-service platform that provides developers with all the core APIs required to build any application. Get free cloud credits by signing up for early access to the Appwrite Cloud launch!

Show Notes

Tweet us your tasty treats

Nov 11, 2022
Potluck × Meeting IRL × SSG vs SSR × Domain Privacy
01:07:29

In this Potluck episode of Syntax, Wes and Scott answer your questions about meeting IRL, bookmarks, SSG vs SSR, domain privacy, deploying monorepos, 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.

Freshbooks - Sponsor

Get a 30 day free trial of Freshbooks at freshbooks.com/syntax

Show Notes

  • 00:08 Welcome
  • 01:20 Weather updates
  • 02:21 How often have you gotten together in real life?
  • Jamstack Conf
  • Reactathon
  • 05:33 What are people using to bookmark sites?
  • Arc Browser
  • 09:03 When not to use Static Site Generation (SSG), and when to use Server-side Rendering (SSR)?
  • Svelte Kit
  • 13:53 How do you do correct error handling to catch everything?
  • Sentry.io
  • 21:13 Sponsor: Sentry
  • 22:50 Is there any benefit to using getters and setters in classes set them over plain methods?
  • 27:47 Will there ever be a js framework that can SSR on a non-JS backend?
  • Render
  • pnpm
  • 32:40 Have either of you thought about learning and teaching Python or Django?
  • 34:56 What is your opinion on purchasing “Domain Privacy” with each domain?
  • 37:49 Sponsor: Sanity
  • 38:44 Domain privacy continued
  • 39:22 How you deploy monorepo packages?
  • Tanstack
  • Vite
  • 43:48 As a member of a non margin group should I avoid applying for jobs when they say they welcome applicants who are of a marginalized group to support diversity?
  • 46:12 When would you, if ever, choose good-old React over something like Next JS?
  • 53:24 Sponsor: Freshbooks
  • 54:16 Is it preferred to import via absolute reference or relative reference?
  • 00:23 SIIIIICK ××× PIIIICKS ×××

××× SIIIIICK ××× PIIIICKS ×××

Shameless Plugs

Tweet us your tasty treats

Nov 09, 2022
Zod Schema Validation and Type Generation
24:05

In this Hasty Treat, Scott and Wes talk about Zod, a TypeScript-first schema validation with static type inference. How are we using Zod? What do we like? And our thoughts on the Zod ecosystem.

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.

Show Notes

Tweet us your tasty treats

Nov 07, 2022
Supper Club × Coding with ADHD with Dr. Courtney Tolinski
59:53

In this supper club episode of Syntax, Wes and Scott talk with Dr. Courtney Tolinski about ADHD, how to tell if you have ADHD, issues related to ADHD for computer workers, anxiety vs ADHD, and more.

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.

Appwrite - Sponsor

Appwrite is a self-hosted backend-as-a-service platform that provides developers with all the core APIs required to build any application. Get free cloud credits by signing up for early access to the Appwrite Cloud launch!

Show Notes

××× SIIIIICK ××× PIIIICKS ×××

Tweet us your tasty treats

Nov 04, 2022
Spooky Web Dev Stories Part 2
43:48

In this episode of Syntax, Wes and Scott tell more of your scary web dev stories including lorem ipsum mistakes, naming something Skynet, blackouts, Twitch streaming, and more!

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.

Auth0 - Sponsor

Auth0 is the easiest way for developers to add authentication and secure their applications. They provides features like user management, multi-factor authentication, and you can even enable users to login with device biometrics with something like their fingerprint. Not to mention, Auth0 has SDKs for your favorite frameworks like React, Next.js, and Node/Express. Make sure to sign up for a free account and give Auth0 a try with the link below. https://a0.to/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

××× SIIIIICK ××× PIIIICKS ×××

Shameless Plugs

Tweet us your tasty treats

Nov 02, 2022
Explained - Buzz Words and Concepts
22:04

In this Hasty Treat, Scott and Wes explain more buzz words like schema, promises, async, sync, dom vs shadow dom vs page HTML, props, and more.

Appwrite - Sponsor

Appwrite is a self-hosted backend-as-a-service platform that provides developers with all the core APIs required to build any application. Get free cloud credits by signing up for early access to the Appwrite Cloud launch.

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

Tweet us your tasty treats

Oct 31, 2022
Supper Club × GraphQL as an Aggregation Layer with Filipe Ferreira of Sky TV
51:57

In this supper club episode of Syntax, Wes and Scott talk with Filipe Ferreira of Sky TV about the tech stack used to deliver streaming TV content, build Apple TV apps, host media, and more.

Gatsby - Sponsor

Today’s episode was sponsored by Gatsby, the fastest frontend for the headless web. Gatsby is the framework of choice for content-rich sites backed by a headless CMS as its GraphQL data layer makes it straightforward to source website content from anywhere. Gatsby’s opinionated, React-based framework makes the hardest parts of building a performant website simpler. Visit Gatsby.dev/Syntax to get your first Gatsby site up in minutes and experience the speed. ⚡️

Sponsorname - Sponsor

Retool is the fast way to build internal tools. Visually design apps that interface with any database or API. Switch to code nearly anywhere to customize how your apps look and work. With Retool, you ship more apps and move your business forward—all in less time.

retool.com/syntax

Sponsorname - Sponsor

Storyblok is a headless component-based CMS with a real-time visual editor. It offers the flexibility for developers to craft their perfect tech stack, but it also empowers content creators to make changes independently. The result is that every team has the freedom to quickly and easily create the ideal website with limitless extensibility. Other key features include robust Storyblok SDKs and APIs, powerful internationalization options, and an eCommerce-ready platform.

Show Notes

××× SIIIIICK ××× PIIIICKS ×××

Tweet us your tasty treats

Oct 28, 2022
Spooky Web Dev Stories 2022
54:35

In this episode of Syntax, Wes and Scott tell your spookiest scary web dev stories including spooky render times, push notification hell, dark Friday, 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.

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.

Freshbooks - Sponsor

Get a 30 day free trial of Freshbooks at freshbooks.com/syntax

Show Notes

××× SIIIIICK ××× PIIIICKS ×××

Shameless Plugs

Tweet us your tasty treats

Oct 26, 2022
Hydration & New Frameworks Like Qwik
25:19

In this Hasty Treat, Scott and Wes talk about Qwik, a new framework designed for the edge. How are things like hydration, lazy loading, rendering, and optimization handled by Qwik?

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

Tweet us your tasty treats

Oct 24, 2022
Supper Club × tRPC With Alex KATT Johansson
57:29

In this supper club episode of Syntax, Scott talks with Alex Johansson about his work on tRPC, how it compares to other tools like GraphQL, and what’s next for tRPC?

Polypane - Sponsor

If you want to build a great website or web app, there’s a million things you need to take care of: responsive design, accessibility, SEO, Meta tags and page structure, to name just a few. Polypane is the browser for developers with tools that help with literally every part of modern web development, helping you save hours (and frustration!) with every project. It shows your site in multiple fully-synced viewports at once, Gives you advice on better accessibility and gives you insight into your performance and quality. Go to polypane.app/syntax to start a 14 day free trial and use SYNTAX20 for a 20% discount at checkout.

FireHydrant - Sponsor

Incidents are hard. Managing them shouldn’t be. FireHydrant makes it easy for anyone in your organization to respond to incidents efficiently and consistently. Intuitive, guided workflows provide turn-by-turn navigation for incident response, while thoughtful prompts and powerful integrations capture all of your incident data to drive useful retros and actionable analytics.

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.

Show Notes

××× SIIIIICK ××× PIIIICKS ×××

Tweet us your tasty treats

Oct 21, 2022
2022 CSS Trends and Usage Web Almanac
58:58

In this episode of Syntax, Wes and Scott talk about some of the CSS Trends and Usage for 2022 as documented by the Web Almanac - and give some great cleaning tips along the way.

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

××× SIIIIICK ××× PIIIICKS ×××

Shameless Plugs

Tweet us your tasty treats

Oct 19, 2022
Bookmarklets
11:12

In this Hasty Treat, Scott and Wes take Matt Busche’s suggestion and talk all about bookmarklets and scripts to modify or manipulate web pages.

MagicBell - Sponsor

MagicBell is the the notification inbox for your product. Add a MagicBell to your product for announcements, billing, workflow, and other notifications. The free plan supports up to 100 Monthly Active Users - use the coupon code SYNTAXFM for 10% off the first 12 months.

NAME - Sponsor

COPY HERE

Show Notes

Tweet us your tasty treats

Oct 17, 2022
Supper Club × Neovim, Lua, RPC and Twitch with TJ DeVries
56:18

In this supper club episode of Syntax, Wes and Scott talk with TJ DeVries about his work on Neovim, programming in Lua, the benefits of RPC, live streaming your work day, and PDE.

FireHydrant - Sponsor

Incidents are hard. Managing them shouldn’t be. FireHydrant makes it easy for anyone in your organization to respond to incidents efficiently and consistently. Intuitive, guided workflows provide turn-by-turn navigation for incident response, while thoughtful prompts and powerful integrations capture all of your incident data to drive useful retros and actionable analytics.

Hasura - Sponsor

With Hasura, you can get a fully managed, production-ready GraphQL API as a service to help you build modern apps faster. You can get started for free in 30 seconds, or if you want to try out the Standard tier for zero cost, use the code “TryHasura” at this link: hasura.info. We’ve also got an amazing selection of GraphQL tutorials at hasura.io/learn.

Gatsby - Sponsor

Today’s episode was sponsored by Gatsby, the fastest frontend for the headless web. Gatsby is the framework of choice for content-rich sites backed by a headless CMS as its GraphQL data layer makes it straightforward to source website content from anywhere. Gatsby’s opinionated, React-based framework makes the hardest parts of building a performant website simpler. Visit Gatsby.dev/Syntax to get your first Gatsby site up in minutes and experience the speed. ⚡️

Show Notes

Tweet us your tasty treats

Oct 14, 2022
Use The Platform!
01:01:45

In this episode of Syntax, Wes and Scott talk about the benefits of sticking to the web platform that is available to you through APIs you may not know about.

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.

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.

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

××× SIIIIICK ××× PIIIICKS ×××

Shameless Plugs

Tweet us your tasty treats

Oct 12, 2022
Syntactic Sugar, Declarative and First Class Citizens? What does that even mean?
15:04

In this Hasty Treat, Scott and Wes explain what the jargon you hear in JavaScript means.

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.

Freshbooks - Sponsor

Get a 30 day free trial of Freshbooks at freshbooks.com/syntax

Show Notes

  • 00:25 Welcome
  • 01:06 Sponsor: Sentry
  • 01:59 Sponsor: Freshbooks
  • 02:27 What does that even mean?
  • 02:55 Everything in JavaScript is an Object!
  • 04:43 X is just Syntactic Sugar
  • 09:00 Functions are first class citizens
  • 10:04 Object Literals or Template Literals
  • 11:12 Declarative vs Imperative

Tweet us your tasty treats

Oct 10, 2022
Supper Club × ORMs with Nikolas Burk from Prisma
01:02:33

In this supper club episode of Syntax, Wes and Scott talk with Nikolas Burk from Prisma about the role an ORM plays in a tech stack, how Prisma has changed over the years, ways to query data in Prisma, and how migrations work with Prisma.

Hasura - Sponsor

With Hasura, you can get a fully managed, production-ready GraphQL API as a service to help you build modern apps faster. You can get started for free in 30 seconds, or if you want to try out the Standard tier for zero cost, use the code “TryHasura” at this link: hasura.info. We’ve also got an amazing selection of GraphQL tutorials at hasura.io/learn.

Storyblok - Sponsor

Storyblok is a headless component-based CMS with a real-time visual editor. It offers the flexibility for developers to craft their perfect tech stack, but it also empowers content creators to make changes independently. The result is that every team has the freedom to quickly and easily create the ideal website with limitless extensibility. Other key features include robust Storyblok SDKs and APIs, powerful internationalization options, and an eCommerce-ready platform.

FireHydrant - Sponsor

Incidents are hard. Managing them shouldn’t be. FireHydrant makes it easy for anyone in your organization to respond to incidents efficiently and consistently. Intuitive, guided workflows provide turn-by-turn navigation for incident response, while thoughtful prompts and powerful integrations capture all of your incident data to drive useful retros and actionable analytics.

Did we mention that FireHydrant is free? Get started at Firehydrant.com/syntax.

Show Notes

××× SIIIIICK ××× PIIIICKS ×××

Shameless Plugs

Tweet us your tasty treats

Oct 07, 2022
Potluck - Using Emoji in Naming × Project Estimates × Goal Planning
01:01:47

In this episode of Syntax, Wes and Scott answer your questions about whether you should use emoji in naming grid elements, how to estimate project times, responsive design tips, animating gradient backgrounds, and more.

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.

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:10 Welcome
  • 01:22 Shooting some pucks at the football game
  • 04:06 Should we use emoji naming conventions for our grid template areas instead of just words?
  • Screenshot of Grid question
  • 08:38 How do you estimate a reliable timeline for a project?
  • 12:18 Do you think about sustainable web development?
  • 16:24 What kind of tips and tricks around responsive design do you have?
  • 18:22 Sponsor: Linode
  • 18:55 How would you go about documenting your achievements throughout your career to reflect on during interviews and employee reviews?
  • 23:33 How do you plan long term for projects or goals?
  • Forever Jobless Goals worksheet
  • 28:22 Can you please make a fundamentals episode that only cares about clarifying the terms everyone assume to be well known to even beginner devs?
  • 22 Buzzwords Explained
  • 31:01 Sponsor: LogRocket
  • 32:20 How would one go about animating a gradient background based on mouse movement?
  • JavaScript 30
  • 38:13 Is there any way using the children API to render the close button and menu items in different locations in the menu component?
  • @Luke_lafr come on the show!
  • 42:04 Where should I begin with design systems?
  • 48:10 Sponsor: Sanity
  • 49:24 Is JSON always safe?
  • 55:01 SIIIIICK ××× PIIIICKS ×××

××× SIIIIICK ××× PIIIICKS ×××

Shameless Plugs

Tweet us your tasty treats

Oct 05, 2022
How to Get Past the Blahs and Finish Your Project
22:23

In this Hasty Treat, Scott and Wes talk about the ways they get unstuck when working on the last bit of a project to help push it over the finish line.

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.

Show Notes

Tweet us your tasty treats

Oct 03, 2022
Supper Club × Open Sauced With bdougie
53:02

In this supper club episode of Syntax, Wes and Scott talk with bdougie about his work on Open Sauced, thoughts on getting into open source development, and his live streaming set up.

Hasura - Sponsor

With Hasura, you can get a fully managed, production-ready GraphQL API as a service to help you build modern apps faster. You can get started for free in 30 seconds, or if you want to try out the Standard tier for zero cost, use the code “TryHasura” at this link: hasura.info. We’ve also got an amazing selection of GraphQL tutorials at hasura.io/learn.

FireHydrant - Sponsor

Incidents are hard. Managing them shouldn’t be. FireHydrant makes it easy for anyone in your organization to respond to incidents efficiently and consistently. Intuitive, guided workflows provide turn-by-turn navigation for incident response, while thoughtful prompts and powerful integrations capture all of your incident data to drive useful retros and actionable analytics.

Get started at Firehydrant.com/syntax

Storyblok - Sponsor

Storyblok is a headless component-based CMS with a real-time visual editor. It offers the flexibility for developers to craft their perfect tech stack, but it also empowers content creators to make changes independently. The result is that every team has the freedom to quickly and easily create the ideal website with limitless extensibility. Other key features include robust Storyblok SDKs and APIs, powerful internationalization options, and an eCommerce-ready platform.

Show Notes

××× SIIIIICK ××× PIIIICKS ×××

Shameless Plugs

Tweet us your tasty treats

Sep 30, 2022
Wes’ New Soundproof Office
01:11:04

In this episode of Syntax, Wes talks through all the gear, renovations, and upgrades he’s made to his new home office. Lighting, soundproofing, desk, windows, 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

××× SIIIIICK ××× PIIIICKS ×××

Shameless Plugs

Tweet us your tasty treats

Sep 28, 2022
WTF Is Enhance Framework?
17:20

In this Hasty Treat, Scott and Wes talk about a new framework called Enhance. What is Enhance and how does it differ from other new frameworks like Astro?

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

 export default function HelloWorld({ html, state }) {   const { attrs } = state   const { greeting='Hello World' } = attrs   return html`          

${greeting}

` }

Tweet us your tasty treats

Sep 26, 2022
Supper Club × Arc Browser with Hursh Agrawal
46:04

In this supper club episode of Syntax, Wes and Scott talk with Hursh Agrawal of The Browser Company about Scott’s favorite browser, Arc. How do you make a browser in 2022? Will there be a Windows version? And who is the target market for Arc?

FireHydrant - Sponsor

Incidents are hard. Managing them shouldn’t be. FireHydrant makes it easy for anyone in your organization to respond to incidents efficiently and consistently. Intuitive, guided workflows provide turn-by-turn navigation for incident response, while thoughtful prompts and powerful integrations capture all of your incident data to drive useful retros and actionable analytics.

Gatsby - Sponsor

Today’s episode was sponsored by Gatsby, the fastest frontend for the headless web. Gatsby is the framework of choice for content-rich sites backed by a headless CMS as its GraphQL data layer makes it straightforward to source website content from anywhere. Gatsby’s opinionated, React-based framework makes the hardest parts of building a performant website simpler. Visit Gatsby.dev/Syntax to get your first Gatsby site up in minutes and experience the speed. ⚡️

Auth0 - Sponsor

Auth0 is the easiest way for developers to add authentication and secure their applications. They provides features like user management, multi-factor authentication, and you can even enable users to login with device biometrics with something like their fingerprint. Not to mention, Auth0 has SDKs for your favorite frameworks like React, Next.js, and Node/Express. Make sure to sign up for a free account and give Auth0 a try with the link below. https://a0.to/syntax

Show Notes

××× SIIIIICK ××× PIIIICKS ×××

Tweet us your tasty treats

Sep 23, 2022
The Productivity Episode
01:04:06

In this episode of Syntax, Wes and Scott talk through what they do to get things done - apps for to do list tracking, calendar blocking, and how they determine a productive day.

StoryBlok - Sponsor

Storyblok is a headless component-based CMS with a real-time visual editor. It offers the flexibility for developers to craft their perfect tech stack, but it also empowers content creators to make changes independently. The result is that every team has the freedom to quickly and easily create the ideal website with limitless extensibility. Other key features include robust Storyblok SDKs and APIs, powerful internationalization options, and an eCommerce-ready platform.

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

××× SIIIIICK ××× PIIIICKS ×××

Shameless Plugs

Tweet us your tasty treats

Sep 21, 2022
AI and Coding - Is Github Co-Pilot Worth It?
23:55

In this Hasty Treat, Scott and Wes talk all about GitHub Co-Pilot and whether it’s ethical, secure, worth it, gonna make you dumb, just going to get in your way, or the greatest thing for programmers to use.

Sentry - Sponsor

Sentry Dex conference is a free, one-day event to share best practices, epic fails, and seasoned insights on how to improve productivity.

From controlling chaotic workflows to maintaining stable code, there’s a lot that can drive a developer mad. We’re hosting DEX, the conference for developers by developers, to give us all a chance to come together and sort through that madness.

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.

Sentry Dex conference is a free, one-day event to share best practices, epic fails, and seasoned insights on how to improve productivity.

From controlling chaotic workflows to maintaining stable code, there’s a lot that can drive a developer mad. We’re hosting DEX, the conference for developers by developers, to give us all a chance to come together and sort through that madness.

Show Notes

Tweet us your tasty treats

Sep 19, 2022
Supper Club × Raycast with Thomas Mann
57:42

In this supper club episode of Syntax, Wes and Scott talk with Thomas Mann about Raycast - an app that can replace Spotlight on your Mac, and do so much more.

FireHydrant - Sponsor 

Incidents are hard. Managing them shouldn’t be. FireHydrant makes it easy for anyone in your organization to respond to incidents efficiently and consistently. Intuitive, guided workflows provide turn-by-turn navigation for incident response, while thoughtful prompts and powerful integrations capture all of your incident data to drive useful retros and actionable analytics. 

Did we mention that FireHydrant is free? Get started at Firehydrant.com/syntax

 

Show Notes

××× SIIIIICK ××× PIIIICKS ×××

Tweet us your tasty treats

Sep 16, 2022
How To Build an API in 2022
01:07:12

In this episode of Syntax, Wes and Scott talk about what APIs are, the API standards that exist, and walk through the various layers of what goes into making an API.

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!

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

××× SIIIIICK ××× PIIIICKS ×××

Shameless Plugs

Tweet us your tasty treats

Sep 14, 2022
Use Next-gen CSS Today (Post CSS Configs)
24:49

In this Hasty Treat, Scott and Wes talk about next generation CSS that you can use today with PostCSS including importing, nesting, variables, media query ranges, custom media queries, 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.

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

 "postcss-import"  @import './elements/headings.css';  
 "postcss-media-minmax"  @media screen and (width >= 500px) and (width <= 1200px)  
 "postcss-custom-media"  @custom-media --below_small (width < env(--small_bp));  @media (--above_small) {}  
 "postcss-env-function"  env(--small_bp)  
  • 20:12 Color Function and Color Function Notation
 /* color-function */ p {   color: color(display-p3 1 0.5 0);   color: color(display-p3 1 0.5 0 / .5); }  

Tweet us your tasty treats

Sep 12, 2022
Supper Club × The Primeagan - Vim, Streaming, Rust, all Around Interesting Guy
01:04:21

In this supper club episode of Syntax, Wes and Scott talk with The Primeagan about his streaming set up, how he decides what to stream, why he makes the kind of content he does, and why he loves Vim.

Hasura - Sponsor

With Hasura, you can get a fully managed, production-ready GraphQL API as a service to help you build modern apps faster. You can get started for free in 30 seconds, or if you want to try out the Standard tier for zero cost, use the code “TryHasura” at this link: hasura.info. We’ve also got an amazing selection of GraphQL tutorials at hasura.io/learn.

Storyblok - Sponsor

Storyblok is a headless component-based CMS with a real-time visual editor. It offers the flexibility for developers to craft their perfect tech stack, but it also empowers content creators to make changes independently. The result is that every team has the freedom to quickly and easily create the ideal website with limitless extensibility. Other key features include robust Storyblok SDKs and APIs, powerful internationalization options, and an eCommerce-ready platform.

Show Notes

Tweet us your tasty treats

Sep 09, 2022
Potluck - How to Pick a Tech Stack × useEffect × setTimeout × Staying Focused
01:02:45

In this episode of Syntax, Wes and Scott answer your questions about picking the right tech stack, whether useEffect is still useful, benefit to use uses setTimeout, and more!

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.

Auth0 - Sponsor

Auth0 is the easiest way for developers to add authentication and secure their applications. They provides features like user management, multi-factor authentication, and you can even enable users to login with device biometrics with something like their fingerprint. Not to mention, Auth0 has SDKs for your favorite frameworks like React, Next.js, and Node/Express. Make sure to sign up for a free account and give Auth0 a try with the link below. a0.to/syntax

Show Notes

Sep 07, 2022
Big Deno Changes
23:17

In this Hasty Treat, Scott and Wes talk about the changes announced by Deno and their thoughts on the changes.

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.

Show Notes

Tweet us your tasty treats

Sep 05, 2022
Supper Club × Steve Ruiz Building a Drawing App
56:20

In this supper club episode of Syntax, Wes and Scott talk with Steve Ruiz about how he built tldraw, how he manages state, what was done to support mobile, and more.

Gatsby - Sponsor

Today’s episode was sponsored by Gatsby, the fastest frontend for the headless web. Gatsby is the framework of choice for content-rich sites backed by a headless CMS as its GraphQL data layer makes it straightforward to source website content from anywhere. Gatsby’s opinionated, React-based framework makes the hardest parts of building a performant website simpler. Visit gatsby.dev/syntax to get your first Gatsby site up in minutes and experience the speed. ⚡️

Show Notes

××× SIIIIICK ××× PIIIICKS ×××

Shameless Plugs

Tweet us your tasty treats

Sep 02, 2022
Syntax Highlight
01:06:40

In this episode of Syntax, Wes and Scott review the websites you’ve submitted including Ruben Oliveira, Adam Collier, Consolecmnd, Brad Preston, and more!

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.

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.

MagicBell - Sponsor

MagicBell is the the notification inbox for your product. Add a MagicBell to your product for announcements, billing, workflow, and other notifications. The free plan supports up to 100 Monthly Active Users - use the coupon code SYNTAXFM for 10% off the first 12 months.

Show Notes

××× SIIIIICK ××× PIIIICKS ×××

Shameless Plugs

Tweet us your tasty treats

Aug 31, 2022
Margins
21:16

In this Hasty Treat, Scott and Wes talk about margins. There are a lot of techniques for dealing with margins - padding instead of margin, only margin or padding bottom, Flexbox for everything, Grid for everything, or a spacing Div.

Sentry - Sponsor

Find out about Sentry’s Dex Conference.

From controlling chaotic workflows to maintaining stable code, there’s a lot that can drive a developer mad. We’re hosting DEX, the conference for developers by developers, to give us all a chance to come together and sort through that madness.

This is a free, one-day event to share best practices, epic fails, and seasoned insights on how to improve productivity. Whether you join us in-person in San Francisco or virtually from your home, you’ll have the opportunity to share your thoughts, engage with other developers, and walk away with your own personal madness sorting algorithm.

Auth0 - Sponsor

Auth0 is the easiest way for developers to add authentication and secure their applications. They provides features like user management, multi-factor authentication, and you can even enable users to login with device biometrics with something like their fingerprint. Not to mention, Auth0 has SDKs for your favorite frameworks like React, Next.js, and Node/Express. Make sure to sign up for a free account and give Auth0 a try with the link below. https://a0.to/syntax

Show Notes

Tweet us your tasty treats

Aug 29, 2022
Supper Club × Self Hosted Backend-as-a-service with Brandon Roberts
47:28

In this supper club episode of Syntax, Wes and Scott talk with Brandon Roberts about Appwrite, how Appwrite works, who it’s for, as well as his thoughts on Angular, Remix, and more.

Hasura - Sponsor

With Hasura, you can get a fully managed, production-ready GraphQL API as a service to help you build modern apps faster. You can get started for free in 30 seconds, or if you want to try out the Standard tier for zero cost, use the code “TryHasura” at this link: hasura.info. We’ve also got an amazing selection of GraphQL tutorials at hasura.io/learn.

Lightstep Incident Response - Sponsor

Streamline on-call, collaboration, incident management, and automation with a free 30-day trial of Lightstep Incident Response, built on ServiceNow. Usage-based pricing on active services promotes collaboration across your entire team to build a culture of service ownership. Listeners of Syntax will also receive a free Lightstep Incident Response T-shirt after firing an alert or incident.

Pay for the services you use, not the number of people on your team with Lightstep Incident Response, built on ServiceNow. Streamline on-call, collaboration, incident management, and automation with a free 30-day trial. Fire an alert or incident today and receive a free Lightstep Incident Response t-shirt.

Show Notes

Shameless Plugs

Tweet us your tasty treats

Aug 26, 2022
Fundamentals - Web Workers and Service Workers
55:13

In this episode of Syntax, Wes and Scott talk through the fundamentals of web workers and service workers - examples, when you should use them, how to debug, local dev, and more.

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.

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

××× SIIIIICK ××× PIIIICKS ×××

Shameless Plugs

Tweet us your tasty treats

Aug 24, 2022
Episode 500!
32:45

In this Hasty Treat, Scott and Wes talk about the past 499 episodes of Syntax, what have been the most downloaded episodes, their favorite episodes, and the sickest of sick pics.

Sentry - Sponsor

Attend Dex

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

Tweet us your tasty treats

Aug 22, 2022
Supper Club × Rich Harris, Author of Svelte
56:19

In this supper club episode of Syntax, Wes and Scott talk with the author of Svelte, Rich Harris, about what influenced the creation of Svelte, his thoughts on web components, the virtual DOM, why companies are switching to Svelte, and what’s next for Svelte.

Gatsby - Sponsor

Today’s episode was sponsored by Gatsby, the fastest frontend for the headless web. Gatsby is the framework of choice for content-rich sites backed by a headless CMS as its GraphQL data layer makes it straightforward to source website content from anywhere. Gatsby’s opinionated, React-based framework makes the hardest parts of building a performant website simpler. Visit gatsby.dev/syntax to get your first Gatsby site up in minutes and experience the speed. ⚡️

Lightstep Incident Response - Sponsor

Streamline on-call, collaboration, incident management, and automation with a free 30-day trial of Lightstep Incident Response, built on ServiceNow. Usage-based pricing on active services promotes collaboration across your entire team to build a culture of service ownership. Listeners of Syntax will also receive a free Lightstep Incident Response T-shirt after firing an alert or incident.

Pay for the services you use, not the number of people on your team with Lightstep Incident Response, built on ServiceNow. Streamline on-call, collaboration, incident management, and automation with a free 30-day trial. Fire an alert or incident today and receive a free Lightstep Incident Response t-shirt.

Show Notes

××× SIIIIICK ××× PIIIICKS ×××

Shameless Plugs

Tweet us your tasty treats

Aug 19, 2022
Job Types Agency, Tech, Startup, Entrepreneur VS Tech company VS In House
01:06:34

In this Hasty Treat, Scott and Wes talk about their thoughts on the different types of tech jobs you can get, and the pros and cons of each style of job in tech.

Lightstep Incident Response - Sponsor

Streamline on-call, collaboration, incident management, and automation with a free 30-day trial of Lightstep Incident Response, built on ServiceNow. Usage-based pricing on active services promotes collaboration across your entire team to build a culture of service ownership. Listeners of Syntax will also receive a free Lightstep Incident Response T-shirt after firing an alert or incident.

Pay for the services you use, not the number of people on your team with Lightstep Incident Response, built on ServiceNow. Streamline on-call, collaboration, incident management, and automation with a free 30-day trial. Fire an alert or incident today and receive a free Lightstep Incident Response t-shirt.

Freshbooks - Sponsor

Get a 30 day free trial of Freshbooks at freshbooks.com/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

××× SIIIIICK ××× PIIIICKS ×××

Shameless Plugs

Tweet us your tasty treats

Aug 17, 2022
CSS Proposals @when, CSS Masonry, Carets
20:12

In this episode of Syntax, Wes and Scott talk about proposals to CSS including @when, CSS Masonry, CSS Caret, ENV Vars, and Media Query Ranges.

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

 @when media(width >= 400px) and media(pointer: fine) and supports(display: flex) {   /* A */ } @else supports(caret-color: pink) and supports(background: double-rainbow()) {   /* B */ } @else {   /* C */ }  
 .grid {   display: inline-grid;   grid: masonry / repeat(3, 2ch);   border: 1px solid;   masonry-auto-flow: next; }  

Tweet us your tasty treats

Aug 15, 2022
Supper Club × Headless Ecommerce with Shopify’s Josh Larson
51:44

In this supper club episode of Syntax, Wes and Scott talk with Josh Larson from Shopify about headless ecommerce, including Hydrogen from Shopify, how integrations work with Shopify, and what the tech stack is behind Hydrogen.

Hasura - Sponsor

With Hasura, you can get a fully managed, production-ready GraphQL API as a service to help you build modern apps faster. You can get started for free in 30 seconds, or if you want to try out the Standard tier for zero cost, use the code “TryHasura” at this link: hasura.info. We’ve also got an amazing selection of GraphQL tutorials at hasura.io/learn.

Lightstep Incident Response - Sponsor

Streamline on-call, collaboration, incident management, and automation with a free 30-day trial of Lightstep Incident Response, built on ServiceNow. Usage-based pricing on active services promotes collaboration across your entire team to build a culture of service ownership. Listeners of Syntax will also receive a free Lightstep Incident Response T-shirt after firing an alert or incident.

Pay for the services you use, not the number of people on your team with Lightstep Incident Response, built on ServiceNow. Streamline on-call, collaboration, incident management, and automation with a free 30-day trial. Fire an alert or incident today and receive a free Lightstep Incident Response t-shirt.

Show Notes

××× SIIIIICK ××× PIIIICKS ×××

Shameless Plugs

Tweet us your tasty treats

Aug 12, 2022
Potluck - API Fetching × PDF Creation × tRPC × Stripe vs PayPal
01:02:17

In this potluck episode of Syntax, Wes and Scott answer your questions about middleman for API fetching, when to introduce SvelteKit, generating PDFs serverside, trade offs of being an entrepreneur vs employee, 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.

Auth0 - Sponsor

Auth0 is the easiest way for developers to add authentication and secure their applications. They provides features like user management, multi-factor authentication, and you can even enable users to login with device biometrics with something like their fingerprint. Not to mention, Auth0 has SDKs for your favorite frameworks like React, Next.js, and Node/Express. Make sure to sign up for a free account and give Auth0 a try with the link below. https://a0.to/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

××× SIIIIICK ××× PIIIICKS ×××

Shameless Plugs

Tweet us your tasty treats

Aug 10, 2022
Browsers, Engines, Support and the Other Guys
30:36

In this Hasty Treat, Scott and Wes talk about the various web browers that might show up in your analytics and whether you need to worry about supporting them or not.

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.

MagicBell - Sponsor

MagicBell is the The notification inbox for your product. Add a MagicBell to your product for announcements, billing, workflow, and other notifications. The free plan supports up to 100 Monthly Active Users - use the coupon code SYNTAXFM for 10% off the first 12 months.

Show Notes

Tweet us your tasty treats

Aug 08, 2022
Supper Club × Lee Robinson on React Suspense, Server Components
01:02:35

In this supper club episode of Syntax, Wes and Scott talk with Lee Robinson from Vercel about React Suspense, server components, the edge, and more!

Lightstep Incident Response - Sponsor

Streamline on-call, collaboration, incident management, and automation with a free 30-day trial of Lightstep Incident Response, built on ServiceNow. Usage-based pricing on active services promotes collaboration across your entire team to build a culture of service ownership. Listeners of Syntax will also receive a free Lightstep Incident Response T-shirt after firing an alert or incident.

Pay for the services you use, not the number of people on your team with Lightstep Incident Response, built on ServiceNow. Streamline on-call, collaboration, incident management, and automation with a free 30-day trial. Fire an alert or incident today and receive a free Lightstep Incident Response t-shirt.

Gatsby - Sponsor

Today’s episode was sponsored by Gatsby, the fastest frontend for the headless web. Gatsby is the framework of choice for content-rich sites backed by a headless CMS as its GraphQL data layer makes it straightforward to source website content from anywhere. Gatsby’s opinionated, React-based framework makes the hardest parts of building a performant website simpler. Visit gatsby.dev/syntax to get your first Gatsby site up in minutes and experience the speed. ⚡️

Show Notes

××× SIIIIICK ××× PIIIICKS ×××

Shameless Plugs

Tweet us your tasty treats

Aug 05, 2022
Our Web Dev Wish List
54:08

In this episode of Syntax, Wes and Scott talk through their web dev wish list of things they want to just work already!

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.

Freshbooks - Sponsor

Get a 30 day free trial of Freshbooks at freshbooks.com/syntax

Show Notes

  • 00:11 Welcome
  • 02:20 Write Custom animation transitions
  • 03:32 date input translate to JavaScript date
  • 06:48 Smooth and animated drag and drop
  • 08:35 TypeScript Interfaces are faster than Types
  • 10:35 Request animation frame
  • 12:52 Custom Elements / Web Components
  • 13:52 Authentication
  • Web Authentication API
  • 16:12 Sponsor: Linode
  • 17:48 useIsomporphic vs useLayoutEffect
  • 19:48 useEffect dependency array
  • 21:27 fragments without fragments
  • 24:46 Overflow hidden without hiding shadows
  • 27:11 Fluid text
  • 28:52 Sponsor: Sentry
  • 29:34 translate3d vs translate
  • 30:59 Gradient borders
  • 33:33 Independent transforms
  • 36:16 animate height auto
  • 38:40 Sponsor: Freshbooks
  • 39:02 Auto synced deps when changing package file
  • 40:36 Peer dependencies
  • 42:32 VS Code Reload after plugins install is kinda annoying
  • 43:04 Safari updates
  • 44:20 Apps checking for passwords
  • 45:02 File name casing as changes
  • 45:56 Better sounding commit names
  • 46:33 Test runner that is the same and just works
  • 47:32 SIIIIICK ××× PIIIICKS ×××

××× SIIIIICK ××× PIIIICKS ×××

Shameless Plugs

Tweet us your tasty treats

Aug 03, 2022
How to Spark your Imagination and Get Excited about Coding
18:30

In this Hasty Treat, Scott and Wes talk the appreciation of coding projects that supposedly serve no purpose, but can be great ways to learn something new.

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.

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.

Show Notes

Tweet us your tasty treats

Aug 01, 2022
Supper Club × Syed Balkhi and WordPress
56:39

In this supper club episode of Syntax, Wes and Scott talk with Syed Balkhi about his experiences blogging and developing plugins in the WordPress ecosytem.

Hasura - Sponsor

With Hasura, you can get a fully managed, production-ready GraphQL API as a service to help you build modern apps faster. You can get started for free in 30 seconds, or if you want to try out the Standard tier for zero cost, use the code “TryHasura” at this link: hasura.info. We’ve also got an amazing selection of GraphQL tutorials at hasura.io/learn.

Sponsorname - Sponsor

Show Notes

××× SIIIIICK ××× PIIIICKS ×××

Tweet us your tasty treats

Jul 29, 2022
Potluck! Node Versions, Old Man Internet, Responsive Design + MORE
01:04:36

In this Potluck episode of Syntax, Wes and Scott answer your questions about resolving node version errors, using social media, bundler for building React component, and how does Syntax get made?

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.

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.

Freshbooks - Sponsor

Get a 30 day free trial of Freshbooks at freshbooks.com/syntax

Show Notes

××× SIIIIICK ××× PIIIICKS ×××

Shameless Plugs

Tweet us your tasty treats

Jul 27, 2022
What is Bun? The New JS Runtime
23:54

In this Hasty Treat, Scott and Wes talk about Bun, a new all-in-one JavaScript runtime. What makes Bun so fast? What’s on Bun’s roadmap? And why do we need another JavaScript runtime?

Lightstep Incident Response - Sponsor

Streamline on-call, collaboration, incident management, and automation with a free 30-day trial of Lightstep Incident Response, built on ServiceNow. Usage-based pricing on active services promotes collaboration across your entire team to build a culture of service ownership. Listeners of Syntax will also receive a free Lightstep Incident Response T-shirt after firing an alert or incident.

Pay for the services you use, not the number of people on your team with Lightstep Incident Response, built on ServiceNow. Streamline on-call, collaboration, incident management, and automation with a free 30-day trial. Fire an alert or incident today and receive a free Lightstep Incident Response t-shirt.

Freshbooks - Sponsor

Get a 30 day free trial of Freshbooks at freshbooks.com/syntax

Show Notes

Tweet us your tasty treats

Jul 25, 2022
Supper Club × Adam Cowley and Neo4j Database
57:01

In this supper club episode of Syntax, Wes and Scott talk with Adam Cowley about how Neo4j Database can help when working with data for your next app.

Gatsby - Sponsor

Today’s episode was sponsored by Gatsby, the fastest frontend for the headless web. Gatsby is the framework of choice for content-rich sites backed by a headless CMS as its GraphQL data layer makes it straightforward to source website content from anywhere. Gatsby’s opinionated, React-based framework makes the hardest parts of building a performant website simpler. Visit gatsby.dev/syntax to get your first Gatsby site up in minutes and experience the speed. ⚡️

Lightstep Incident Response - Sponsor

Streamline on-call, collaboration, incident management, and automation with a free 30-day trial of Lightstep Incident Response, built on ServiceNow. Usage-based pricing on active services promotes collaboration across your entire team to build a culture of service ownership. Listeners of Syntax will also receive a free Lightstep Incident Response T-shirt after firing an alert or incident.

Pay for the services you use, not the number of people on your team with Lightstep Incident Response, built on ServiceNow. Streamline on-call, collaboration, incident management, and automation with a free 30-day trial. Fire an alert or incident today and receive a free Lightstep Incident Response t-shirt.

Show Notes

××× SIIIIICK ××× PIIIICKS ×××

Tweet us your tasty treats

Jul 22, 2022
Our Code Styles
58:55

In this episode of Syntax, Wes and Scott talk about their coding styles - functional vs object oriented, interfaces vs types, tabs vs spaces, should comments exist? And a whole lot more.

Freshbooks - Sponsor

Get a 30 day free trial of Freshbooks at freshbooks.com/syntax

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

××× SIIIIICK ××× PIIIICKS ×××

Shameless Plugs

Tweet us your tasty treats

Jul 20, 2022
STUMP’D Interview Coding Questions
25:47

In this Hasty Treat, Scott and Wes try to stump each other with coding interview questions like what is a higher order component? What is functional programming? 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.

Lightstep Incident Response - Sponsor

Streamline on-call, collaboration, incident management, and automation with a free 30-day trial of Lightstep Incident Response, built on ServiceNow. Usage-based pricing on active services promotes collaboration across your entire team to build a culture of service ownership. Listeners of Syntax will also receive a free Lightstep Incident Response T-shirt after firing an alert or incident.

Pay for the services you use, not the number of people on your team with Lightstep Incident Response, built on ServiceNow. Streamline on-call, collaboration, incident management, and automation with a free 30-day trial. Fire an alert or incident today and receive a free Lightstep Incident Response t-shirt.

Show Notes

  • 00:26 Welcome
  • 01:47 Sponsor: Lightstep Incident Response
  • 03:00 Sponsor: Sentry
  • 04:10 What is a higher order component?
  • 05:34 What is functional programming?
  • 09:00 What’s the purpose of cache busting and how do you achieve it?
  • Wes’ course for Beginner JavaScript
  • 10:37 What is short circuit evaluation?
  • 13:19 What is a closure?
  • 15:49 What is the reason for wrapping the contents of a JavaScript source file in a function that is then invoked?
  • 17:30 Can you describe how CSS specificity works?
  • 20:15 How does prototypal inheritance differ from classical inheritance?
  • 23:56 What is the difference between a parameter and an argument?

Tweet us your tasty treats

Jul 18, 2022
Supper Club × 70,000 Serverless Functions with Kristi Perreault of Liberty Mutual
56:17

In this supper club episode of Syntax, Wes and Scott talk with Kristi Perreault of Liberty Mutual about why they’re using serverless functions, what languages they write in, managing security and montoring, and Kristi’s journey into tech as a career.

Hasura - Sponsor

With Hasura, you can get a fully managed, production-ready GraphQL API as a service to help you build modern apps faster. You can get started for free in 30 seconds, or if you want to try out the Standard tier for zero cost, use the code “TryHasura” at this link: hasura.info. We’ve also got an amazing selection of GraphQL tutorials at hasura.io/learn.

Stack Overflow Podcast - Sponsor

For over a dozen years, the Stack Overflow Podcast has been exploring what it means to be a developer, and how the art and practice of software programming is changing our world. Hosted by Ben Popper, Cassidy Williams, and Ceora Ford, the Stack Overflow Podcast is your home for all things code.

Listen to new episodes twice a week, wherever you get your podcasts.

Lightstep Incident Response - Sponsor

Streamline on-call, collaboration, incident management, and automation with a free 30-day trial of Lightstep Incident Response, built on ServiceNow. Usage-based pricing on active services promotes collaboration across your entire team to build a culture of service ownership. Listeners of Syntax will also receive a free Lightstep Incident Response T-shirt after firing an alert or incident.

Pay for the services you use, not the number of people on your team with Lightstep Incident Response, built on ServiceNow. Streamline on-call, collaboration, incident management, and automation with a free 30-day trial. Fire an alert or incident today and receive a free Lightstep Incident Response t-shirt.

Show Notes

××× SIIIIICK ××× PIIIICKS ×××

Shameless Plugs

Tweet us your tasty treats

Jul 15, 2022
Potluck - Peer Dependencies × Vitest × NVM and PNPM × Sprites
01:06:05

In this potluck episode of Syntax, Wes and Scott answer your questions about peer dependencies, Vitest, NVM and PNPM, using sprites for images, common MongoDB operations, 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.

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.

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:03 Welcome
  • 01:53 Configuring home internet routers
  • 04:42 Scott’s Home Assistant update
  • Mushroom Theme
  • 07:52 Could you explain to me peer-dependencies and how does it work?
  • 13:24 Using Vitest do you still have to transpile code?
  • 16:14 Can you talk about helpful and common MongoDB operations, beyond just CRUD.
  • 18:49 How can I update the “updatedAt” field of the document on every save automatically?
  • 20:40 What is aggregation, and when do you use it?
  • 25:33 Sponsor: Prismic
  • 27:27 How does NVM relate to PNPM?
  • pnpm
  • nvm
  • 30:45 I’m looking to upskill from front-end JavaScript?
  • 33:53 Is it possible to have a private NPM repo I can “npm install” from, or do I put my components up on NPM publicly?
  • Creating a private npm package
  • 37:51 Sponsor: LogRocket
  • 39:14 Should a majority of lodash functions be considered deprecated?
  • angus c just
  • 42:36 Please do an episode on programming/learning with ADHD.
  • 44:04 Should I still be putting images in sprites?
  • 49:20 Does Mux have a simple mechanism for adding auth to each video or group of videos?
  • Mux Create playback restriction
  • 53:48 Sponsor: Sanity.io
  • 55:02 Is there copyright issues with using public APIs?
  • Moneypuck
  • 59:38 ××× SIIIIICK ××× PIIIICKS ×××

××× SIIIIICK ××× PIIIICKS ×××

Shameless Plugs

Tweet us your tasty treats

Jul 13, 2022
Clamp & Interpolate
19:12

In this Hasty Treat, Scott and Wes talk about clamp and interpolate and how you might want to use them in your next project.

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.

NAME - 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

CSS clamp:
font-size: clamp(1rem, 10vw, 2rem);

JavaScript Clamp:
const clamp = (num, min, max) => Math.min(Math.max(num, min), max)

Tweet us your tasty treats

Jul 11, 2022
Supper Club × Voice Coding with Pokey Rule
58:07

In this supper club episode of Syntax, Wes and Scott talk with Pokey Rule about using his voice to code, and the current state of voice coding software.

Stackoverflow Podcast - Sponsor

For over a dozen years, the Stack Overflow Podcast has been exploring what it means to be a developer, and how the art and practice of software programming is changing our world. Hosted by Ben Popper, Cassidy Williams, and Ceora Ford, the Stack Overflow Podcast is your home for all things code.

Listen to new episodes twice a week, wherever you get your podcasts.

directus - Sponsor

Directus is an open-source data platform that instantly layers on top of any SQL database. Our Data Engine empowers engineers with dynamic REST+GraphQL APIs, workflow automation, built-in auth, caching, and asset transformations. And the included Data Studio democratizes your database, allowing even non-technical users to browse, manage, and visualize database content through a no-code data collaboration app.

Get started in minutes with a free Directus Community Cloud project.

Show Notes

××× SIIIIICK ××× PIIIICKS ×××

Shameless Plugs

Tweet us your tasty treats

Jul 08, 2022
10 years of Speaking + Conferences
01:01:53

In this episode of Syntax, Wes and Scott talk about their experiences speaking at conferences, why they’ve done it, how they prepare talks, and tips for anyone interested in wanting to give talks.

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.

Freshbooks - Sponsor

Get a 30 day free trial of Freshbooks at freshbooks.com/syntax

Show Notes

××× SIIIIICK ××× PIIIICKS ×××

Shameless Plugs

Tweet us your tasty treats

Jul 06, 2022
CSS5 Color Functions
24:06

In this Hasty Treat, Scott and Wes talk about new CSS color functions, and tips for viewing the different options and ways of presenting color that are coming.

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.

Show Notes

Tweet us your tasty treats

Jul 04, 2022
Supper Club × Developer Experience with Shawn Wang
53:31

In this supper club episode of Syntax, Wes and Scott talk with Shawn Wang about his thoughts on developer experience, why DX is important, and the importance of learning in public.

Hasura - Sponsor

With Hasura, you can get a fully managed, production-ready GraphQL API as a service to help you build modern apps faster. You can get started for free in 30 seconds, or if you want to try out the Standard tier for zero cost, use the code “TryHasura” at this link: hasura.info. We’ve also got an amazing selection of GraphQL tutorials at hasura.io/learn.

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

××× SIIIIICK ××× PIIIICKS ×××

Shameless Plugs

Tweet us your tasty treats

Jul 01, 2022
Tips for Communicating
59:11

In this episode of Syntax, Wes and Scott talk about their tips for better communication in email, Zoom calls, code reviews, or asking for help.

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.

Auth0 - Sponsor

Auth0 is the easiest way for developers to add authentication and secure their applications. They provides features like user management, multi-factor authentication, and you can even enable users to login with device biometrics with something like their fingerprint. Not to mention, Auth0 has SDKs for your favorite frameworks like React, Next.js, and Node/Express. Make sure to sign up for a free account and give Auth0 a try with the link below. https://a0.to/syntax

Show Notes

××× SIIIIICK ××× PIIIICKS ×××

Shameless Plugs

Tweet us your tasty treats

Jun 29, 2022
Browser CSS Page Transitions API aka Shared Element Transitions
20:43

In this Hasty Treat, Scott and Wes talk about the new Browser CSS Page Transitions API proposal and what features it opens up for developers on the web.

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

 async function doTransition() {   let transition = document.createDocumentTransition();      // Specify offered elements. The tag below is used to refer   // to the generated pseudo elemends in script/CSS.   document.querySelector(".old-message").style.pageTransitionTag = "message";      // The start() call triggers an async operation to capture   // snapshots for the offered elements,   await transition.start(async () => {     // This callback is invoked by the browser when the capture     // finishes and the DOM can be switched to the new state.     // No frames are rendered until this callback returns.          // Asynchronously load the new page.     await coolFramework.changeTheDOMToPageB();          // Clear the old message if that element is still in the page     document.querySelector(".old-message").style.pageTransitionTag = "";     // Set new message as the shared element 'message'     document.querySelector(".new-message").style.pageTransitionTag = "message";          // Set up animations using WA-API on the next frame.     requestAnimationFrame(() => {       document.documentElement.animate(keyframes, {       ...animationOptions,       pseudoElement: "::page-transition-container(message)",       });     });          // Note that when this callback finishes, the animations will start with the tagged elements.   }); }  

Tweet us your tasty treats

Jun 27, 2022
Supper Club × Authoring Browser Extensions with Tim Leland
48:09

In this supper club episode of Syntax, Wes and Scott talk with Tim Leland - developer of browser extensions like WeatherExtension and Link Shortener Extension.

Postlight Podcast - Sponsor

Postlight is a strategy, design, and engineering firm that builds platforms for some of the biggest organizations in the world. The Postlight Podcast is hosted by senior leaders Rich Ziade, Paul Ford, Gina Trapani, and Chris LoSacco.

If you’re looking for answers to tough leadership questions, the Postlight Podcast has you covered.

Listen to new episodes every Tuesday, wherever you get your podcasts.

WP Mail SMTP - Sponsor

Did you know that many WordPress sites are not properly configured to send emails? With WP Mail SMTP, you can easily optimize your site to send emails, avoid the spam folder, and make sure your emails land in the inbox every time.

WP Mail SMTP comes with detailed email logs, email engagement tracking, visual email reports, weekly email summaries, integrations with popular email providers like SendLayer, Gmail, Outlook, and more!

Try WP Mail SMTP Pro today and get 50% off or start with their free version by downloading it from the WordPress plugin directory.

Show Notes

Shameless Plugs

Tweet us your tasty treats

Jun 24, 2022
Home Automation - A Look Ahead
01:09:32

In this Tasty Treat, Scott and Wes talk about the current state of home automation, and the kinds of software and hardware they’re using in their homes to automate their lives.

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.

Auth0 - Sponsor

Auth0 is the easiest way for developers to add authentication and secure their applications. They provides features like user management, multi-factor authentication, and you can even enable users to login with device biometrics with something like their fingerprint. Not to mention, Auth0 has SDKs for your favorite frameworks like React, Next.js, and Node/Express. Make sure to sign up for a free account and give Auth0 a try with the link below. https://a0.to/syntax

Freshbooks - Sponsor

Get a 30 day free trial of Freshbooks at freshbooks.com/syntax

Show Notes

××× SIIIIICK ××× PIIIICKS ×××

Shameless Plugs

Tweet us your tasty treats

Jun 22, 2022
New Viewport Units
19:25

In this episode of Syntax, Wes and Scott talk about the new viewport units coming to the web - what are they and when can we use them?

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.

Sanity.io - 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

Tweet us your tasty treats

Jun 20, 2022
Supper Club × Edge Functions and Deno with Eduardo Bouças of Netlify
55:13

In this supper club episode of Syntax, Wes and Scott talk edge functions and Deno with Eduardo Bouças of Netlify.

Hasura - Sponsor

With Hasura, you can get a fully managed, production-ready GraphQL API as a service to help you build modern apps faster. You can get started for free in 30 seconds, or if you want to try out the Standard tier for zero cost, use the code “TryHasura” at this link: hasura.info. We’ve also got an amazing selection of GraphQL tutorials at hasura.io/learn.

Postlight Podcast - Sponsor

Postlight is a strategy, design, and engineering firm that builds platforms for some of the biggest organizations in the world. The Postlight Podcast is hosted by senior leaders Rich Ziade, Paul Ford, Gina Trapani, and Chris LoSacco.

If you’re looking for answers to tough leadership questions, the Postlight Podcast has you covered.

Listen to new episodes every Tuesday, wherever you get your podcasts.