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

• 00:24 Welcome
• 01:09 GitHub tarball web streams
• 05:09 Sponsor: Sentry
• 05:48 Why would I need security locally?
• Caddy Server
• 11:23 Cookie issues
• 13:04 Examples of things that need a secure context
• MDN Features restricted to secure contexts
• 14:58 What is tunneling?
• 19:22 Cloudflare Tunnels
• Cloudflared
• Cloudflare Tunnel
• 20:50 nGrok
• ngrok
• 23:22 Local tunnel
• Local Tunnel
• 24:55 Tunnel to
• Tunnel to dev - Expose your local web server to the internet with a public URL
• 26:02 Cloudflare subdomain

Tweet us your tasty treats

• Scott’s Instagram
• LevelUpTutorials Instagram
• Wes’ Instagram
• Wes’ Twitter
• Wes’ Facebook
• Scott’s Twitter
• Make sure to include @SyntaxFM in your tweets

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

• 00:36 Welcome
• 01:05 Sponsor: Sentry
• 02:05 Who is Dax Raad?
• Dax on Twitter
• thdxr.com
• Tomorrow.fm Podcast
• SST.dev
• 04:22 Why doesn’t AWS have a simple way to build on top of it?
• 07:46 What is Open Next?
• Vercel
• Next.js
• Open-Next.js
• 10:25 How many people are involved in building Open Next?
• 11:14 Mapping Next.js to Amazon products
• 14:25 What is the edge?
• 18:56 Pricing in serverless
• 23:33 What about image assets?
• 25:02 Is the CDK a layer on top of something Amazon is doing?
• Amazon CDK
• 27:23 What is terraform?
• Terraform
• 28:50 What is SST and why SST?
• 30:54 Do I build with SST or on top of SST?
• 32:06 How do you do local development with SST?
• 37:01 What about databases with SST?
• 40:12 What about build pipelines?
• 42:28 What is Seed?
• Seed
• 43:52 Any advice for someone learning AWS?
• SST on YouTube
• 46:05 Supper Club questions
• Neovim
• Toyko Night theme
• Nerd Fonts
• Astro
• TypeScript
• Alacritty
• i3
• Cloudflare
• Inside the Meteoric Rise—and More Epic Flop—of HQ Trivia
• 52:45 SIIIIICK ××× PIIIICKS ×××

××× SIIIIICK ××× PIIIICKS ×××

• Planetscale

Shameless Plugs

• Rebase.tv
• @RebaseTV on Twitter
• Tomorrow.fm episode on Rebase.tv

Tweet us your tasty treats

• Scott’s Instagram
• LevelUpTutorials Instagram
• Wes’ Instagram
• Wes’ Twitter
• Wes’ Facebook
• Scott’s Twitter
• Make sure to include @SyntaxFM in your tweets

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

• 01:08 Sponsor: Sentry
• 01:43 Brainstorming for Syntax’s new website
• 02:27 Are there good podcast websites out there?
• 03:26 Homepage design
• 07:33 How would you handle login?
• 09:40 Search on the site
• SvelteKit docs
• Flexsearch
• 13:59 Transcripts
• Open AI Whisper
• Whisper AI for podcasters
• 18:25 The player
• 21:11 Tagging
• 23:45 Video
• Linus Tech Tips - WAN Show
• 27:45 Show notes
• 29:57 Surfacing good content on the podcast
• 35:30 Interactions
• 36:25 Deploy to Podcast Host
• Libsyn
• Editor Chris on Mastodon
• 38:43 Code base
• Syntax website on GitHub
• 45:21 Listener feedback
• 46:27 SIIIIICK ××× PIIIICKS ×××

××× SIIIIICK ××× PIIIICKS ×××

• Scott: Screen door dog
• Wes: Apple Watch bands

Shameless Plugs

• Scott: LevelUp Tutorials
• Wes: Wes Bos Tutorials

Tweet us your tasty treats

• Scott’s Instagram
• LevelUpTutorials Instagram
• Wes’ Instagram
• Wes’ Twitter
• Wes’ Facebook
• Scott’s Twitter
• Make sure to include @SyntaxFM in your tweets

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

• 00:26:11 Welcome
• 00:59:07 Sponsor: Sentry
• 01:39:17 What are Web Streams?
• 03:15:11 Why are web streams picking up steam lately?
• 04:41:21 How are web streams streaming?
• 09:28:11 Searching a database can use streaming
• 13:07:11 Web stream jargon
• 18:06:11 FileReader is a Stream
• 19:31:05 Other Types of Streams
• Cloudlfare HTML Rewriter
• 21:50:05 ReadableStream and Writable Stream
• 27:23:00 Creating a Writable Stream
• 28:39:11 TextDecoderStream

Tweet us your tasty treats

• Scott’s Instagram
• LevelUpTutorials Instagram
• Wes’ Instagram
• Wes’ Twitter
• Wes’ Facebook
• Scott’s Twitter
• Make sure to include @SyntaxFM in your tweets

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

• 01:02 Guest introduction
• EricSartorius.com
• Eric on GitHub
• PureFunc
• Train Surfing
• Get Stream
• 02:51 Where have you travelled?
• 04:27 What are the challenges of being a digital nomad?
• 09:08 How do you research before travel?
• 13:04 How do you approach applying for a job?
• 21:10 Do you travel with other digital nomads?
• R16 video
• 22:43 What are the best locations you’ve been?
• 24:21 What about health and insurance?
• Tiny Toones
• TSA post raw meat on carousel
• 28:21 What motivated you to want to climb Kilimanjaro?
• 41:14 What gear do you travel with for web dev?
• Osprey Talon 33
• Packing cubes
• Outlier
• Google Fi
• Google Flights explore
• 51:12 Using credit card points for flights
• 54:45 How do you handle customs?
• 00:13 SIIIIICK ××× PIIIICKS ×××

××× SIIIIICK ××× PIIIICKS ×××

• Comfort 2.0 Czech sock shoes

Shameless Plugs

• PureFunc
• @TheEpicLife on Instagram
• Pamoja Safaris

Tweet us your tasty treats

• Scott’s Instagram
• LevelUpTutorials Instagram
• Wes’ Instagram
• Wes’ Twitter
• Wes’ Facebook
• Scott’s Twitter
• Make sure to include @SyntaxFM in your tweets

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

• 00:11 Welcome
• Glove 80 keyboard
• Raycast
• 03:06 Sponsor: Sentry
• 05:15 What makes a website slow?
• Uses.tech
• 06:29 Server Generation Times
• 13:33 Large payloads
• Redis
• Gzip
• Brotli compression
• Cloudflare
• Cloudinary
• 18:13 Assets being too large
• 23:01 Caching assets
• 28:25 CDN
• 30:35 Caching 101
• 37:04 Render blocking requests
• 40:01 CSS
• 42:25 JavaScript
• 44:51 Latency
• 49:17 Flash of dark mode or unsigned out
• 55:00 Data uris
• Content-visibility
• vite-plugin-singlefile
• Pool in your URL
• 58:11 SIIIIICK ××× PIIIICKS ×××

××× SIIIIICK ××× PIIIICKS ×××

• Scott: 3Blue1Brown
• Wes: Suavecito Firme Clay Pomade

Shameless Plugs

• Scott: LevelUp Tutorials
• Wes: Wes Bos Tutorials

Tweet us your tasty treats

• Scott’s Instagram
• LevelUpTutorials Instagram
• Wes’ Instagram
• Wes’ Twitter
• Wes’ Facebook
• Scott’s Twitter
• Make sure to include @SyntaxFM in your tweets

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

• 00:25 Welcome
• 01:14 Sponsor: Sentry
• 02:45 Webcontainers and NodeBox
• Introducing WebContainers
• Code Sandbox
• CodePen
• Replit
• GitHub Codespaces
• 06:42 Why Node.js in the browser?
• 11:08 How does it work?
• 13:10 Clientside APIs
• 14:27 Using iFrame to proxy messages
• 17:39 Are these open source?
• 19:22 Differences between the two services
• 21:10 Wes to Figma, Scott to Penpot
• Figma
• Penpot
• 24:51 Limitations

Tweet us your tasty treats

• Scott’s Instagram
• LevelUpTutorials Instagram
• Wes’ Instagram
• Wes’ Twitter
• Wes’ Facebook
• Scott’s Twitter
• Make sure to include @SyntaxFM in your tweets

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

• 00:37 Welcome
• 01:14 Guest introduction
• Steve on Twitter
• Steve on GitHub
• Builder.io
• Builder.io/demo
• 04:07 Builder works with any tech stack?
• 06:29 Where is the structure of the site coming from?
• 07:28 What is Builder.io?
• 11:34 What’s the workflow for updating content?
• 13:03 What is Builder built in?
• Mobx
• 14:36 Moving from Figma to HTML
• 18:41 Is an app like this divs all the way down?
• 24:55 Stories of browser gremlins building?
• 26:29 Advice for anyone building drag and drop
• Fullstory
• 29:04 Does FPS play a part in development?
• 33:31 Do you use SVG?
• 36:15 Where does Qwik and Partytown fit into all of it?
• Qwik
• Partytown
• 46:45 How does accessibility play into Builder?
• 49:44 Supper club questions
• 54:30 SIIIIICK ××× PIIIICKS ×××

××× SIIIIICK ××× PIIIICKS ×××

• Dead Space Remake

Tweet us your tasty treats

• Scott’s Instagram
• LevelUpTutorials Instagram
• Wes’ Instagram
• Wes’ Twitter
• Wes’ Facebook
• Scott’s Twitter
• Make sure to include @SyntaxFM in your tweets

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

• 00:11:10 Welcome
• 01:58:01 Sponsor: Sentry
• 03:16:05 What this episode is not going to be
• 07:36:11 The current landscape
• Chat GPT
• GitHub Copilot
• Warp Completions
• Midjourney
• Bing AI
• From Bing to Sydney
• Why a Chat with Bing Left Me Deeply Unsettled
• Tensorflow
• Stable Diffusion
• Amazing AI
• Dall E
• 15:26:11 Timeline of growth of AI
• AI Timeline
• 16:24:11 What is a model for AI?
• 24:20:11 How do you use AI?
• 33:14:00 Code brushes
• 35:57:18 Midjourney
• Yandex
• 40:13:18 Is it going to take your job?
• Canva
• Cal
• 50:22:19 Cost prohibitive
• 52:26:20 Who’s going to train the robots?
• 57:29:12 Adding AI to your apps
• 58:50:11 SIIIIICK ××× PIIIICKS ×××

××× SIIIIICK ××× PIIIICKS ×××

• Scott: Motion sensor
• Wes: Apple Watch Ultra

Shameless Plugs

• Scott: LevelUp Tutorials
• Wes: Wes Bos Tutorials

Tweet us your tasty treats

• Scott’s Instagram
• LevelUpTutorials Instagram
• Wes’ Instagram
• Wes’ Twitter
• Wes’ Facebook
• Scott’s Twitter
• Make sure to include @SyntaxFM in your tweets

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

• 00:24 Welcome
• 00:46 Sponsor: Sentry
• 01:51 Uses performance issues
• Uses.tech
• 04:23 Understand Sloppy Code
• 10:17 Syntax website timestamp issue
• 12:56 Establish rules to fix sloppy code
• 16:35 Adding a feature, do you refactor an unrelated function?
• 23:07 How do you enforce rules?
• GitHub Actions

Tweet us your tasty treats

• Scott’s Instagram
• LevelUpTutorials Instagram
• Wes’ Instagram
• Wes’ Twitter
• Wes’ Facebook
• Scott’s Twitter
• Make sure to include @SyntaxFM in your tweets

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

• 00:40 Welcome
• 01:08 Guest introduction
• FredKSchott.com
• @Fredkschott on Twitter
• Fred on GitHub
• 02:17 What is Astro and why should someone use it?
• 04:57 What can you build with Astro?
• 06:11 What’s an island in content?
• 09:43 How do routes work with Astro?
• 12:30 How is Markdown handled in Astro?
• mdxjs
• 14:32 How does Astro work on the edge?
• 18:15 How does Astro v2 handle data fetching?
• 23:25 Integrations with Astro
• 26:38 Astro AI bot?
• AI Langchain
• 30:40 Error overlay design
• 36:10 What are some of the most important upgrades in v2?
• 37:18 Hybrid rendering
• 40:27 Astro’s image component
• Squoosh
• 44:39 What happened to snowpack? Pikapkg?
• 46:48 What is the financial model for Astro?
• 50:28 Supper Club questions
• Obsidian

××× SIIIIICK ××× PIIIICKS ×××

• Chat Langchain

Shameless Plugs

• Astro
• Astro Discord

Tweet us your tasty treats

• Scott’s Instagram
• LevelUpTutorials Instagram
• Wes’ Instagram
• Wes’ Twitter
• Wes’ Facebook
• Scott’s Twitter
• Make sure to include @SyntaxFM in your tweets

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

• 00:09 Welcome
• 02:11 Disclaimers
• 04:17 What is the terminal?
• 06:54 What we’ve used for terminal
• Get Warp
• Hyper Terminal
• iTerm
• Alacritty
• 11:14 Terminal terminology
• CommandLinePowerUser.com
• WSL
• OhMyPosh
• OhMyZsh
• Starship
• Ion
• 17:35 The basic features of Warp
• 20:45 Autocomplete issues
• Fig
• 25:06 Sticky header
• 26:13 Blocks
• 29:17 The prompt
• 30:38 Sharing blocks and live sessions
• 32:29 AI Command Search
• AI Command search
• 35:51 Remote SSH
• 37:53 Window management
• Launch configurations
• 38:42 Workflows
• 40:19 The command palette
• 42:36 How does Warp make money?
• 43:54 Warp requires an account
• 46:09 Annoyances and wishlists
• 58:29 SIIIIICK ××× PIIIICKS ×××

××× SIIIIICK ××× PIIIICKS ×××

• Scott: 50 Pokemon Cards for $5
• Wes: iPad Sorter Station

Shameless Plugs

• Scott: LevelUp Tutorials
• Wes: Wes Bos Tutorials

Tweet us your tasty treats

• Scott’s Instagram
• LevelUpTutorials Instagram
• Wes’ Instagram
• Wes’ Twitter
• Wes’ Facebook
• Scott’s Twitter
• Make sure to include @SyntaxFM in your tweets

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

• 00:25 Welcome
• 01:37 Sponsor: Sentry
• 02:16 What is logging? Why log?
• 04:59 Logging isn’t just for debugging
• 08:22 What do we log?
• 13:34 What not to log
• 14:58 Development, staging, and production
• 17:36 Logging bots
• 19:33 Where to put logs
• 20:59 How to log
• Log Tail
• Paper Trail
• Sematext Logs
• DataDog
• Winston
• Pino

Tweet us your tasty treats

• Scott’s Instagram
• LevelUpTutorials Instagram
• Wes’ Instagram
• Wes’ Twitter
• Wes’ Facebook
• Scott’s Twitter
• Make sure to include @SyntaxFM in your tweets

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

• 00:37 Welcome
• 01:38 Who is Ryan Carniato?
• @RyanCarniato on Twitter
• Ryan on Dev.to
• Solid.JS
• 02:37 Why did you build Solid?
• Knockout.JS
• Marko JS
• 09:15 What is Solid?
• 12:55 What does it mean to compile to vanilla JavaScript?
• SolidStart
• Tanstack Query
• 19:39 What are observables and signals?
• 27:17 How are web components used inside of Solid?
• 29:38 Why aren’t we using web components more?
• 32:37 Why would someone pick SolidStart vs Solid?
• 39:07 Why did you choose JSX?
• 44:45 How did you build live code examples into documentation?
• SolidJS Docs
• Solid-Movies.app
• 47:19 What is Solid.JS built on?
• 53:36 What is the future of Solid?
• 00:39 Supper club questions
• 02:57 SIIIIICK ××× PIIIICKS ×××

××× SIIIIICK ××× PIIIICKS ×××

• Alice in Borderland

Shameless Plugs

• Ryan on Twitch
• Ryan on YouTube

Tweet us your tasty treats

• Scott’s Instagram
• LevelUpTutorials Instagram
• Wes’ Instagram
• Wes’ Twitter
• Wes’ Facebook
• Scott’s Twitter
• Make sure to include @SyntaxFM in your tweets

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

• Scott: Physical 100
• Wes: Leviton D23LP-2RW Decora Smart Wi-Fi Mini Plug-In Dimmer

Tweet us your tasty treats

• Scott’s Instagram
• LevelUpTutorials Instagram
• Wes’ Instagram
• Wes’ Twitter
• Wes’ Facebook
• Scott’s Twitter
• Make sure to include @SyntaxFM in your tweets

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

Show Notes

• 00:21 Welcome
• 02:20 Electric car ski tripping
• 05:01 Why config files?
• 07:47 Custom Vite config files
• Wes’ Vite config

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

• 11:16 Node has failed us
• 13:30 Cosmic config
• Cosmiconfig
• 16:46 File nesting
• 21:01 Standardize on a format

Tweet us your tasty treats

• Scott’s Instagram
• LevelUpTutorials Instagram
• Wes’ Instagram
• Wes’ Twitter
• Wes’ Facebook
• Scott’s Twitter
• Make sure to include @SyntaxFM in your tweets

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

• 00:35 Welcome
• 01:19 Guest intro
• Miško Hevery
• @MHevery
• 01:58 What is Resumability?
• 05:06 What is Qwik?
• Qwik
• Qwik City
• 07:03 Why would you want to make a component resumable?
• 12:08 Qwik code can be lazy loaded
• 15:28 How is server side rendering handled?
• 18:12 How does Vite help?
• 22:40 A bit more about hydration
• 31:03 How does the server collection information?
• 32:11 How do you share state between components?
• 34:45 How is data fetching handled?
• 37:47 Why are you using JSX?
• 41:53 Dealing with components in other frameworks
• Mitosis
• 49:21 What is Partytown?
• Partytown
• 54:30 Supper Club questions

××× SIIIIICK ××× PIIIICKS ×××

• Thinking Fast and Slow

Shameless Plugs

• Builder.io

Tweet us your tasty treats

• Scott’s Instagram
• LevelUpTutorials Instagram
• Wes’ Instagram
• Wes’ Twitter
• Wes’ Facebook
• Scott’s Twitter
• Make sure to include @SyntaxFM in your tweets

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

• 00:10 Welcome
• 00:36 Sponsor: Sentry
• 02:23 Electrical updates
• 08:16 Moving to TypeScript
• 09:34 What are you doing with GraphQL?
• GraphQL Codegen
• 11:35 Why move to TypeScript?
• 12:00 Refactoring is easier
• 14:58 Better DX
• 18:42 Adding a tsconfig.json file
• 22:43 Figure out your tooling
• 23:50 Type Checker
• 25:13 MongoDB to TypScript Generator
• 26:44 Eslint-Typescript
• 28:03 Deprank
• Deprank
• 29:18 Refactor and rename to .ts
• 32:40 Typing your code
• 43:04 Utilities and unions
• 46:11 Where do you put your types?
• 49:29 Typing Dependencies
• Definitely Typed
• Raycast Search npm
• 54:26 Global types
• 01:08 Now what?
• 03:58 SIIIIICK ××× PIIIICKS ×××

××× SIIIIICK ××× PIIIICKS ×××

• Scott: Elegrp USB C Walloutlet
• Wes: Barrina Shop Lights

Shameless Plugs

• Scott: LevelUp Tutorials
• Wes: Wes Bos Tutorials

Tweet us your tasty treats

• Scott’s Instagram
• LevelUpTutorials Instagram
• Wes’ Instagram
• Wes’ Twitter
• Wes’ Facebook
• Scott’s Twitter
• Make sure to include @SyntaxFM in your tweets

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

• 00:25 Welcome
• 00:50 Polish And Perf explained
• 02:05 What kinds of tools are available to improve performance
• Lighthouse in Chrome
• PageSpeed
• 09:32 Identify route caching and http caching
• 14:25 Partytown
• Partytown
• 15:19 Unnecessary network calls

Tweet us your tasty treats

• Scott’s Instagram
• LevelUpTutorials Instagram
• Wes’ Instagram
• Wes’ Twitter
• Wes’ Facebook
• Scott’s Twitter
• Make sure to include @SyntaxFM in your tweets

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

• 00:37 Welcome
• 01:26 Guest introduction
• Rust in Action
• Tim on Twitter
• Tim on YouTube
• 03:51 What was it like to write a book on Rust?
• 07:52 What drew you to Rust?
• 13:01 The approachability of Rust
• 21:41 What’s a good introductory project with Rust?
• 25:15 Why would someone learn Rust?
• It’s time to try WASM
• 40:23 What is a crate and cargo in Rust?
• 44:17 Running Rust in various places
• 50:53 Should the average web developer try Rust?
• 52:13 Supper club questions
• 54:17 SIIIIICK ××× PIIIICKS ×××

××× SIIIIICK ××× PIIIICKS ×××

• kokako

Shameless Plugs

• Tim McNamara - How to learn Rust

Tweet us your tasty treats

• Scott’s Instagram
• LevelUpTutorials Instagram
• Wes’ Instagram
• Wes’ Twitter
• Wes’ Facebook
• Scott’s Twitter
• Make sure to include @SyntaxFM in your tweets

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

• 00:10 Welcome
• 00:51 Sponsor: Sentry
• 02:32 Our experiences with ESM
• 06:54 Why ESM?
• 11:42 Top Level Await
• 16:16 Assert Import type eventually
• Scott’s Vite chunk import map
• 21:00 Converting code to ESM
• 27:22 .JS on end of files
• 32:12 Imports and exports
• 37:52 TypeScript
• 40:24 Bundling / Transpiling
• Vite Node
• 43:42 Dependencies
• Sindre thread
• 45:16 Publishing
• 53:25 SIIIIICK ××× PIIIICKS ×××

××× SIIIIICK ××× PIIIICKS ×××

• Scott: Egg dispenser
• Wes: Pure Cinema Podcast

Shameless Plugs

• Scott: LevelUp Tutorials
• Wes: Wes Bos Tutorials

Tweet us your tasty treats

• Scott’s Instagram
• LevelUpTutorials Instagram
• Wes’ Instagram
• Wes’ Twitter
• Wes’ Facebook
• Scott’s Twitter
• Make sure to include @SyntaxFM in your tweets

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

• 00:26 Welcome
• 01:09 Snow skate update
• 03:01 Mixins
• 05:06 Range selector
• 09:36 :first-of-column :last-of:column / row
• Ability to target items in nth-row of autofilled, implicit grid
• 11:43 Fit Text
• 13:34 Overflow-x, overflow-y control
• 15:36 Full support for CSS with Inline Styles
• 16:24 nth-of-found()
• 18:18 Robust Color functions
• 22:19 resize: both but no overflow or scroll
• 23:39 Animate height auto
• 23:57 Full attr() support
• 25:07 CSS References
• CSS References
• 26:59 overflown + :stuck
• 28:56 Multi-line selectors
• 30:35 Container Queries - select the container itself
• 32:04 :is-scrolled - select a container when it’s scrolled

Tweet us your tasty treats

• Scott’s Instagram
• LevelUpTutorials Instagram
• Wes’ Instagram
• Wes’ Twitter
• Wes’ Facebook
• Scott’s Twitter
• Make sure to include @SyntaxFM in your tweets

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

• 00:36 Welcome
• 01:05 Buffalo and Canada
• History of Target in Canada
• 06:23 Who is Caleb Porzio?
• @CalebPorzio on Twitter
• 09:26 What is Livewire?
• Livewire
• Alpine.js
• HotWired
• 12:58 Are these MVC frameworks?
• 18:11 What is the process behind the scenes?
• 20:36 How does Hotwire handle rendering?
• 25:38 What is Alpine.js?
• 33:19 Why are PHP devs making interesting things?
• Laravel
• Tailwind
• 40:32 What is a nextTick in JavaScript?
• Microtask Guide
• 46:20 TypeScript thoughts
• 48:05 Server side rendering?
• Morph
• 49:25 Supper Club questions
• Ergodox Keyboards
• Glove 80 Keyboards
• Natty Theme
• MonoLisa
• 59:40 ××× SIIIIICK ××× PIIIICKS ×××

××× SIIIIICK ××× PIIIICKS ×××

• Ugmonk Analog

Shameless Plugs

• Make VS Code Awesome
• Alpine.js
• Livewire

Tweet us your tasty treats

• Scott’s Instagram
• LevelUpTutorials Instagram
• Wes’ Instagram
• Wes’ Twitter
• Wes’ Facebook
• Scott’s Twitter
• Make sure to include @SyntaxFM in your tweets

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

Show Notes

• State of JS 2022

• 00:26 Welcome

• 01:24 Thoughts on the survey in general

• 04:24 Country of origin

• 05:53 Salaries

• 08:14 Higher education

• 08:58 JavaScript features

• 15:41 Browser APIs

• 21:15 Library Usage

• 26:11 Interest in frontend frameworks

• 28:40 Framework usage

• 31:41 Rendering frameworks

• 34:57 Build tools usage over time

• 39:37 Monorepo tools

• Moon

• 46:41 Backend frameworks

• Civet

• 47:42 JavaScript run times

• 51:01 TypeScript JavaScript balance

• 52:17 JavaScript flavors

• 57:03 Resources

• Fireship Dev

Shameless Plugs

• Scott: LevelUp Tutorials
• Wes: Wes Bos Tutorials

Tweet us your tasty treats

• Scott’s Instagram
• LevelUpTutorials Instagram
• Wes’ Instagram
• Wes’ Twitter
• Wes’ Facebook
• Scott’s Twitter
• Make sure to include @SyntaxFM in your tweets

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

• 00:28 Welcome
• 01:46 What are Container Queries?
• Tweet about Container Queries
• 03:28 Use cases for Container Queries
• Home Assistant
• Can I Use?
• 06:11 The syntax of container queries
• 13:42 New units
• 22:27 Old iOS versions may cause issues

Tweet us your tasty treats

• Scott’s Instagram
• LevelUpTutorials Instagram
• Wes’ Instagram
• Wes’ Twitter
• Wes’ Facebook
• Scott’s Twitter
• Make sure to include @SyntaxFM in your tweets

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

• 00:36 Welcome

• 01:37 Who are you and what is Sanity?

• 04:04 What kinds of services use Sanity?

• 06:18 What is a content lake?

• 07:26 Enabling code access to Sanity Studio

• 13:12 Implenting Sanity into a React app

• 14:49 What is GROQ?

• 21:04 Is GraphQL still the best way to query data?

• 25:32 Workflows in Sanity

• 27:48 What is portable text?

• 35:19 How does Sanity work with TypeScript?

• 38:51 Ecommerce options with Sanity

• 41:29 Supper club questions

• 50:33 SIIIIICK ××× PIIIICKS ×××

• Syntax 533 - Zod Schema

• Elden Ring

• Risk of Rain

• Sharp

• Syntax 526 - Supper Club with on TRPC

××× SIIIIICK ××× PIIIICKS ×××

• Espen bread
• Medium Tall

Shameless Plugs

• Sanity Syntax code

Tweet us your tasty treats

• Scott’s Instagram
• LevelUpTutorials Instagram
• Wes’ Instagram
• Wes’ Twitter
• Wes’ Facebook
• Scott’s Twitter
• Make sure to include @SyntaxFM in your tweets

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

• 00:11:11 Welcome
• 01:29:11 When should you use article and section in HTML?
• 08:03:08 Does your business suffer from the economic recession?
• 15:47:18 How do you manage your money or budget?
• PlainTextAccounting
• YNAB
• Copilot
• 20:51:11 What should I consider using? There’s a lot of options. CommonJS, AMD, UMD, es modules?
• 26:30:09 What’s the difference between a software developer and software engineer?
• 30:36:11 How do you handle payment for your course platforms?
• Braintree
• Gumroad
• Paddle
• Stripe
• 38:33:23 Why is this false? “I’m a string” instanceof String
• 40:38:22 Do you all use Mac spaces for organizing windows?
• Arc
• 45:55:21 Do you have any tips that would help my front end team avoid rendering a DOM with invalid element nesting?
• 48:48:14 Would you do an episode commenting on the CSS Nesting survey released this week?
• Help Choose CSS Nesting Syntax
• 53:57:01 How do you guys go about prioritizing your work?
• Height.app
• Things
• 58:50:19 SIIIIICK ××× PIIIICKS ×××

××× SIIIIICK ××× PIIIICKS ×××

• Scott: Bundle of Eucalyptus
• Wes: Recycling bin brackets

Shameless Plugs

• Scott: LevelUp Tutorials
• Wes: Wes Bos Tutorials

Tweet us your tasty treats

• Scott’s Instagram
• LevelUpTutorials Instagram
• Wes’ Instagram
• Wes’ Twitter
• Wes’ Facebook
• Scott’s Twitter
• Make sure to include @SyntaxFM in your tweets

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

• 00:24 Welcome
• 03:19 Buying vs building topic
• 07:09 Strategy
• 09:50 Escapability
• 14:56 Services You Could Use
• Sentry
• Postmark
• 16:34 Efficiency of using a service
• 18:08 Cron jobs
• 20:43 Checkout
• Recurly
• Lemon Squeezy
• Stripe
• Braintree
• 24:29 Hosting
• 26:00 Screenshots and open graph images
• Cloudinary
• Vercel OG
• Puppeteer
• 29:25 Search
• Algolia
• Elastic
• MongoDB
• 33:32 Auth
• PasswordJS
• 36:55 Images
• 39:46 Video Hosting
• Vimeo
• Mux
• Amazon Kinesis

Tweet us your tasty treats

• Scott’s Instagram
• LevelUpTutorials Instagram
• Wes’ Instagram
• Wes’ Twitter
• Wes’ Facebook
• Scott’s Twitter
• Make sure to include @SyntaxFM in your tweets

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

• 00:34 Welcome
• 01:10 Guest introduction
• Rolling With Kat
• 03:05 Bag milk?
• 04:34 What is Tangible Materials?
• Tangible Materials
• 07:27 How did you end up at Tangible?
• Full Stack Academy
• 10:05 Are bootcamps worth it?
• 14:46 How important were in person classes to you?
• All We Can Save
• Braiding Sweetgrass
• 20:46 What do you enjoy about data visualization?
• D3
• Data visualization society
• Three.js
• Observable
• Color Wheel
• 27:21 Working at WeWork
• WeWork: Or the Making and Breaking of a $47 Billion Unicorn • Official Trailer
• 34:14 What is your tech stack at Tangible?
• 38:26 What backend would Wes use for a project?
• Svelte Kit
• Supabase
• Super Bass
• 42:10 Is there environmental web hosting?
• 43:47 Supper Club Questions
• Uplift Desks
• 50:22 SIIIIICK ××× PIIIICKS ×××

××× SIIIIICK ××× PIIIICKS ×××

• Climavores

Shameless Plugs

• Drinking from the Garden Hose
• Hiring at Tangible Materials

Tweet us your tasty treats

• Scott’s Instagram
• LevelUpTutorials Instagram
• Wes’ Instagram
• Wes’ Twitter
• Wes’ Facebook
• Scott’s Twitter
• Make sure to include @SyntaxFM in your tweets

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

• 00:17 Welcome
• 02:38 What’s a cantina?
• 06:33 Scott’s coding goals
• Animated grid layouts
• Tauri
• 14:39 Wes’ code goals
• Uses
• Stripe
• Stripe Elements
• Shoelace
• 23:17 Tooling
• Vite Plugin List Directory Contents
• 26:39 Scott’s courses and platform
• LevelUp.video
• 29:36 Wes’ courses
• Wes Bos Tutorials
• 31:11 Scott’s fitness goals
• 35:55 Wes’ fitness goals
• 39:44 Apple Watch for fitness
• 41:54 Syntax podcast goals
• 50:13 Scott’s social media goals
• Scott on TikTok
• LevelUp Newsletter
• 52:35 Wes’ social media goals
• Wes on TikTok
• 58:02 SIIIIICK ××× PIIIICKS ×××

××× SIIIIICK ××× PIIIICKS ×××

• Scott: The Menu
• Wes: JB Weld Clearweld, big version

Shameless Plugs

• Scott: LevelUp Tutorials
• Wes: Wes Bos Tutorials

Tweet us your tasty treats

• Scott’s Instagram
• LevelUpTutorials Instagram
• Wes’ Instagram
• Wes’ Twitter
• Wes’ Facebook
• Scott’s Twitter
• Make sure to include @SyntaxFM in your tweets

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

Show Notes

• 00:25 Welcome
• 02:04 Xmas recap
• Peloton
• 04:09 Satisfies and as const
• 06:16 What is const?
• 10:30 Helping with currency
• 12:44 Bos monster server update
• 14:13 Satisfies

 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

• Scott’s Instagram
• LevelUpTutorials Instagram
• Wes’ Instagram
• Wes’ Twitter
• Wes’ Facebook
• Scott’s Twitter
• Make sure to include @SyntaxFM in your tweets

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

• 00:36 Welcome
• 01:59 Who is Sarah Drasner?
• @Sarah_Edo on Twitter
• @Sarah_Edo on Mastodon
• @Sdras on CodePen
• @SDras on GitHub
• SarahDrasnerDesign.com
• Google
• Engineering Management for the Rest of Us
• Amazon: Engineering Management for the Rest of Us
• Netlify
• 05:25 How did you figure out what to do in management?
• 07:20 How do you get out of engineer’s way?
• The Engineer Manager pendulum
• 09:39 Do you spend time on making the person happy in the job?
• 15:51 Should managers code?
• 19:16 Was it difficult to step out of coding?
• 21:07 Why do people leave jobs?
• 24:04 Dealing with conflict and reorgs
• 28:36 What makes a good retro?
• 31:25 What was your process for writing a book?
• SVG Animations: From Common UX Implementations to Complex Responsive Animation
• Scrivener
• Egghead
• Mayfly Design
• Sarah Drasner’s articles on CSS Tricks
• Sarah Drasner’s articles on Smashing Magazine
• 43:44 Supper Club questions
• Sarah Drasner’s VS Code snippets and themes
• Creating a VS Code theme
• Wes Bos Cobalt 2 VS Code theme
• Partytown beta
• 53:10 SIIIIICK ××× PIIIICKS ×××

××× SIIIIICK ××× PIIIICKS ×××

• Paper Koi Lantern: a DIY Kit

Shameless Plugs

• Engineering Management for the Rest of Us

Tweet us your tasty treats

• Scott’s Instagram
• LevelUpTutorials Instagram
• Wes’ Instagram
• Wes’ Twitter
• Wes’ Facebook
• Scott’s Twitter
• Make sure to include @SyntaxFM in your tweets

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

• Scott: Cron
• Wes: Wyze Headphones

Shameless Plugs

• Scott: LevelUp SvelteKit Tutorial
• Wes: Wes Bos Tutorials

Tweet us your tasty treats

• Scott’s Instagram
• LevelUpTutorials Instagram
• Wes’ Instagram
• Wes’ Twitter
• Wes’ Facebook
• Scott’s Twitter
• Make sure to include @SyntaxFM in your tweets

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

Show Notes

• 00:24 Welcome
• 01:40 Rocking predicates
• 02:54 What is a type in TypeScript?
• 04:11 Type Narrowing
• 08:18 Type Guard
• 16:19 Type Predicates

Shameless Plugs

• Scott: LevelUp Tutorials
• Wes: Wes Bos Tutorials

Tweet us your tasty treats

• Scott’s Instagram
• LevelUpTutorials Instagram
• Wes’ Instagram
• Wes’ Twitter
• Wes’ Facebook
• Scott’s Twitter
• Make sure to include @SyntaxFM in your tweets

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

• 00:39 Welcome
• 01:48 Who is Kilian Valkhof?
• kilianvalkhof.com
• @kilianvalkhof on Twitter
• 04:50 What is Polypane?
• Polypane
• @Polypane on Twitter
• FromScratch
• 09:31 How is Polypane built?
• 14:18 What about the Dev tools tab?
• 20:15 Outline tab
• 23:23 Color picker
• 27:33 Canvas rules and guides
• 32:16 Accessibility background and tools
• 40:28 How do you parse the CSS?
• 42:51 What else do you want people to know about Polypane?
• 44:42 Supper Club questions
• 53:59 SIIIIICK ××× PIIIICKS ×××

Shameless Plugs

• Fix Contrast
• Superposition

Tweet us your tasty treats

• Scott’s Instagram
• LevelUpTutorials Instagram
• Wes’ Instagram
• Wes’ Twitter
• Wes’ Facebook
• Scott’s Twitter
• Make sure to include @SyntaxFM in your tweets

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

• 00:09 Welcome
• Syntax 420: 2022 Predictions
• 01:44 Svelte popularity
• Svelte
• Svelte Kit
• 04:09 Next.js data layer
• 05:06 Web components UI
• Open UI
• 06:19 Rust popularity
• Rust
• 10:07 Serverless and Cloud functions
• 10:42 Tailwind popularity
• 16:20 Sponsor: Sentry
• 17:59 Next gen dev tools
• 19:46 CSS Container queries
• 21:45 GraphQL
• 26:26 Deno
• 29:44 TypeScript
• 34:28 Sponsor: Sanity
• 35:07 Server comeback
• 36:21 Checkouts and payment processers
• Lemon Squeezy
• 43:05 Sponsor: Auth0
• 44:18 Temporal API
• 46:44 Remote dev thin client popularity
• 49:49 SIIIIICK ××× PIIIICKS ×××

××× SIIIIICK ××× PIIIICKS ×××

• Scott: JADENS Label Maker Machine with Tape
• Wes: Chipolo One Spot

Shameless Plugs

• Scott: LevelUp Svelte Kit Tutorial
• Wes: Wes Bos Tutorials

Tweet us your tasty treats

• Scott’s Instagram
• LevelUpTutorials Instagram
• Wes’ Instagram
• Wes’ Twitter
• Wes’ Facebook
• Scott’s Twitter
• Make sure to include @SyntaxFM in your tweets

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

• 00:33 Welcome
• 01:18 Sponsor: Sentry
• 02:47 Sponsor: Prismic
• 04:01 Our experience with building desktop apps
• Level Up Tutorials: Level 1 Electron
• Hair.WesBos.com
• 10:04 Frameworks for building apps
• 10:56 Tauri vs Electron
• Tauri
• Electron
• 23:38 Tooling
• vite-plugin-electron

Tweet us your tasty treats

• Scott’s Instagram
• LevelUpTutorials Instagram
• Wes’ Instagram
• Wes’ Twitter
• Wes’ Facebook
• Scott’s Twitter
• Make sure to include @SyntaxFM in your tweets

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

• 00:38 Welcome
• Ken.dev
• Ken on Github
• 01:59 How do you have two jobs?
• 09:46 When did you start a second job?
• 16:02 Any tips for someone wanting to switch into coding?
• 24:03 Do you have advice for people trying to market themselves?
• 31:38 What is working these days for marketing efforts?
• 34:47 Where can devs learn about marketing?
• 35:50 Barbershop culture
• 39:47 Supper club questions
• Snazzy Labs custom Touch ID button
• Tech Meme Ride Home podcast
• 44:10 SIIIIICK ××× PIIIICKS ×××

××× SIIIIICK ××× PIIIICKS ×××

• Traeger Grills

Shameless Plugs

• Suavecito
• ResortPass

Tweet us your tasty treats

• Scott’s Instagram
• LevelUpTutorials Instagram
• Wes’ Instagram
• Wes’ Twitter
• Wes’ Facebook
• Scott’s Twitter
• Make sure to include @SyntaxFM in your tweets

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

• 00:10 Welcome
• 01:51 Podcast feedback
• 04:46 Can you talk about how you made the decision to re-write LevelUp?
• Strangler Fig
• 13:54 How did you get a score for your website?
• Google Pagespeed
• 19:30 Where will we move to when Twitter implodes?
• Twitter Blue
• 26:29 Sponsor: Linode
• 27:06 How did you arrive at your business model?
• 33:15 Advice for getting into freelancing web dev?
• 38:49 Sponsor: Sentry
• 40:07 How to feel more “senior” as a developer
• 43:30 How do you manage notifications between various apps?
• Hazel
• 50:46 Label makers
• Nimbot label makers
• 54:14 Sponsor: Freshbooks
• 54:45 How are people testing node apps?
• JestJS
• Vitest
• Mocha
• ChaiJS
• 56:38 What are your thoughts on the TanStack Router?
• Tanstack
• Astro
• SvelteKit
• Nozzle
• 01:09 SIIIIICK ××× PIIIICKS ×××

××× SIIIIICK ××× PIIIICKS ×××

• Scott: Sensibo Air
• Wes: We Crashed

Shameless Plugs

• Scott: LevelUp Tutorials
• Wes: Wes Bos Tutorials

Tweet us your tasty treats

• Scott’s Instagram
• LevelUpTutorials Instagram
• Wes’ Instagram
• Wes’ Twitter
• Wes’ Facebook
• Scott’s Twitter
• Make sure to include @SyntaxFM in your tweets

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

• 00:25 Welcome
• 00:51 Sponsor: LogRocket
• 01:44 Sponsor: Prismic
• 03:17 Why Serverless and related databases?
• 07:45 Deploying on Deno
• Deno
• 08:44 Using a database with serverless functions
• Syntax 542 - Serverless Limitations
• 11:53 Using purpose built databases
• Planetscale
• Supabase
• Cloudflare D1
• Cloudflare Key Value Store
• AWS DynamoDB
• AWS Auroa
• FaunaDB
• Neon
• Railway
• MongoDB Serverless
• Redis
• Cassandra
• 15:01 The results of the test
• 17:35 Solutions

Tweet us your tasty treats

• Scott’s Instagram
• LevelUpTutorials Instagram
• Wes’ Instagram
• Wes’ Twitter
• Wes’ Facebook
• Scott’s Twitter
• Make sure to include @SyntaxFM in your tweets

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

• 00:36 Welcome
• 01:24 Who is Jonny Burger?
• Jonny.io
• Jonny on GitHub
• Jonny on Twitter
• 03:51 Why did you create Remotion?
• Remotion.dev
• 07:36 What types of videos are people making?
• 10:53 What is the tech stack?
• Puppeteer
• Lottie
• 18:31 What is Idempotence?
• 19:50 What is lottie?
• 22:56 Motion blur trail
• Motion blur trail demo
• 25:17 Sponsor: Gatsby
• 26:12 Chrome rendering
• 29:58 When would you choose JPG or PNG?
• 31:43 Are you using ffmpeg in the browser?
• ffmpeg
• 36:00 Sponsor: Tuple
• 37:43 What player do you use for playback?
• 39:54 How did you take this idea to a product?
• 44:05 Supper Club questions
• LG C9 TV
• iTerm
• 50:12 SIIIIICK ××× PIIIICKS ×××

××× SIIIIICK ××× PIIIICKS ×××

• Yoga with Adriene
• Cosmic Kids Yoga

Shameless Plugs

• Toopo.art

Tweet us your tasty treats

• Scott’s Instagram
• LevelUpTutorials Instagram
• Wes’ Instagram
• Wes’ Twitter
• Wes’ Facebook
• Scott’s Twitter
• Make sure to include @SyntaxFM in your tweets

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

• 00:11 Welcome
• 01:17 College football update
• 04:07 Web almanac for 2022
• JavaScript in the 2022 Web Almanac
• 06:25 Unused JavaScript
• 07:47 JavaScript requests per page
• 09:38 Bundlers
• 14:01 Pages using Babel
• 16:01 How JavaScript is requested
• 19:22 Sponsor: Sentry
• 20:56 Loading render blocking tags
• 22:48 Dynamic import, web workers, source maps
• 24:33 Libraries and frameworks
• Owl Carousel
• Lazy Sizes
• 29:30 Websites using web components
• 31:35 Websites with JavaScript security issues
• 32:43 Sponsor: Auth0
• 33:58 Jamstack
• 37:09 JavaScript used by Jamstack sites
• 38:03 Jamstack hosting
• 39:46 Popular Static site generators
• 44:49 Progressive web apps and service workers
• 50:29 jQuery inside WordPress themes
• WeCrashed
• 51:13 Project Fugu
• Project Fugu
• 52:51 Web push notifications
• 55:49 CMSs
• 00:45 Sponsor: Freshbooks
• 01:40 SIIIIICK ××× PIIIICKS ×××

××× SIIIIICK ××× PIIIICKS ×××

• Scott: White Lotus
• Wes: Ubiquiti

Shameless Plugs

• Scott: LevelUp Tutorials
• Wes: Wes Bos Tutorials

Tweet us your tasty treats

• Scott’s Instagram
• LevelUpTutorials Instagram
• Wes’ Instagram
• Wes’ Twitter
• Wes’ Facebook
• Scott’s Twitter
• Make sure to include @SyntaxFM in your tweets

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

• Scott’s Instagram
• LevelUpTutorials Instagram
• Wes’ Instagram
• Wes’ Twitter
• Wes’ Facebook
• Scott’s Twitter
• Make sure to include @SyntaxFM in your tweets

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

• 01:40 Who is Vu Le?
• 03:33 How did you learn to code?
• 04:57 How do you get a job at Disney?
• 09:01 Internal CMS development at Disney
• 10:19 What types of languages do you use internally?
• 15:22 Do you have a design system?
• 19:52 How do you handle versions and updates?
• 22:42 Sponsor: Tuple
• 23:37 Do you get involved in testing?
• Vitest
• 25:06 What are you using for GraphQL?
• GraphQL
• 25:34 How are you handling CSS?
• Theme UI
• 31:43 Does Disney do remote work?
• 34:38 Perks of working at Disney
• 38:16 Supper Club questions
• GMMK Pro Keyboard
• Santa Cruz bicycles
• JetBrains Mono
• 45:13 SIIIIICK ××× PIIIICKS ×××

××× SIIIIICK ××× PIIIICKS ×××

• Garden hose connectors

Tweet us your tasty treats

• Scott’s Instagram
• LevelUpTutorials Instagram
• Wes’ Instagram
• Wes’ Twitter
• Wes’ Facebook
• Scott’s Twitter
• Make sure to include @SyntaxFM in your tweets

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

• Scott: Video Archives Podcast
• Wes: Ubiquiti Wifi

Shameless Plugs

• Scott: LevelUp Tutorials
• Wes: Wes Bos Tutorials

Tweet us your tasty treats

• Scott’s Instagram
• LevelUpTutorials Instagram
• Wes’ Instagram
• Wes’ Twitter
• Wes’ Facebook
• Scott’s Twitter
• Make sure to include @SyntaxFM in your tweets

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

• 00:23 Welcome
• 01:49 Responsive web design update
• 03:12 Let’s go
• 05:32 Sponsor: Linode
• 06:01 Sponsor: LogRocket
• 07:23 GitHub Next
• GitHub Next
• 08:17 GitHub Copilot for the CLI
• 11:52 Synthesizing results
• Syntax 540 - Responsive Design Techniques
• 13:31 Hey GitHub
• Syntax 481 - Supper Club Voice Coding with Pokey Rule
• 16:55 GitHub Blocks
• 18:58 GitHub Code search
• 21:36 GitHub Collaborative workspaces
• 23:43 GitHub Copilot for your own codebase
• 25:10 GitHub Copilot Radar
• 29:15 GitHub AI Pull Requests

Tweet us your tasty treats

• Scott’s Instagram
• LevelUpTutorials Instagram
• Wes’ Instagram
• Wes’ Twitter
• Wes’ Facebook
• Scott’s Twitter
• Make sure to include @SyntaxFM in your tweets

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

• 00:37 Welcome
• 01:44 Who is Jared Sumner?
• Jarred Sumner on Twitter
• Bun
• Bun Discord
• Bun on GitHub
• 02:31 Why did you make Bun?
• 09:43 Using web API vs Node modules?
• 13:25 Do we still use npm?
• 15:42 Support for HTML Rewriter
• 16:46 Where do you see Bun being used?
• 19:25 Do you think someone will write a type checker?
• 21:18 Sponsor: Tuple
• 22:07 What is Zig?
• 24:57 Did you have a history of learning languages?
• 28:16 Have you ever thought of putting Bun on hardware?
• 29:59 Is there a package.json file in Bun projects?
• 31:34 What can’t Node just get faster?
• 32:16 What is the future of Bun?
• 36:27 Thoughts on types in JavaScript?
• 41:16 Why did you build an SQLite client into Bun?
• 42:54 Supper Club questions
• Starship
• Warp
• 48:52 SIIIIICK ××× PIIIICKS ×××

××× SIIIIICK ××× PIIIICKS ×××

• Bun meme

Tweet us your tasty treats

• Scott’s Instagram
• LevelUpTutorials Instagram
• Wes’ Instagram
• Wes’ Twitter
• Wes’ Facebook
• Scott’s Twitter
• Make sure to include @SyntaxFM in your tweets

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

• 00:10 Welcome
• 01:53 TikTok update
• 02:46 What strategies do you use to find the good stuff?
• Tweetdeck
• 11:17 What is the clear distinction b/w how the CRUD Ops & the Real time chat protocols (XMPP, Websockets, etc) differ?
• 15:56 Should we use TypeScript for a new blog?
• 20:45 Sponsor: Sanity
• 21:45 Is there any reason to still use string concatenation over template literals?
• 26:13 What should React devs use to get initial scaffolding in place?
• Create React App
• Vite
• Turbo Pack
• 29:38 What’s the deal with Playwright?
• Playwright
• 34:28 Sponsor: LogRocket
• 35:19 What separates a “scripting” language from a “programming” language?
• 39:37:14 Sponsor: Prismic
• 40:23:02 Do you have any tips on how to change a defeated programmer mindset?
• Partydown
• 47:34:07 How has your use of and work in the browser changed with Arc?
• Arc Browser
• Syntax 514 - Supper Club × Arc Browser with Hursh Agrawal
• 49:18:15 Why would I attach an event listener with the useCapture argument as true?
• 51:33:24 SIIIIICK ××× PIIIICKS ×××

××× SIIIIICK ××× PIIIICKS ×××

• Scott: Screwless plates / 4 pack of screwless plates
• Wes: Shoe Boxes for Cords

Shameless Plugs

• Scott: LevelUp TikTok
• Wes: Wes Bos TikTok

Tweet us your tasty treats

• Scott’s Instagram
• LevelUpTutorials Instagram
• Wes’ Instagram
• Wes’ Twitter
• Wes’ Facebook
• Scott’s Twitter
• Make sure to include @SyntaxFM in your tweets

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

• 00:23 Welcome
• 01:08 Sponsor: Sentry
• 01:59 Sponsor: MagicBell
• 03:11 Topic introduction
• 04:44 Function limit
• Puppeteer
• 08:51 Node support
• 10:00 Cron jobs
• 11:12 Local development
• Miniflare
• 11:45 Database access
• SQLite
• 12:42 Sharing code
• 13:07 Environmental variables
• Netlify environmental variables
• 14:37 Timeouts
• 15:47 Sass is expensive
• 17:26 Infastructure as code
• 19:02 Search
• Algolia

Shameless Plugs

• Scott: LevelUp Tutorials
• Wes: Wes Bos Tutorials

Tweet us your tasty treats

• Scott’s Instagram
• LevelUpTutorials Instagram
• Wes’ Instagram
• Wes’ Twitter
• Wes’ Facebook
• Scott’s Twitter
• Make sure to include @SyntaxFM in your tweets

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

• 00:37:11 Welcome
• 03:18:10 Saskatchewan and Saskatoon Berries
• Saskatoon Berry Barn
• 05:02:14 TV shows we’re watching
• Amazing Race Canada
• America’s Dance Crew
• Lakefront Luxury
• 12:49:12 New house vibe
• 18:29:06 Sponsor: Kontent
• 19:13:20 Sauna thoughts
• 22:58:24 Home gym thoughts
• Woodupp
• Tonal
• 40:22:16 Sponsor: Tuple
• 41:17:11 3D printer
• 44:11:09 How many things can you take on?
• 48:23:11 BBQ talk
• Amazing Ribs
• 55:26:11 Electric car update
• Ioniq 5
• 57:45:07 Supper Club questions
• Level Up Tutorials VS Code Theme
• Quokka VS Code Extension
• Quokkajs
• Console-Ninja

Tweet us your tasty treats

• Scott’s Instagram
• LevelUpTutorials Instagram
• Wes’ Instagram
• Wes’ Twitter
• Wes’ Facebook
• Scott’s Twitter
• Make sure to include @SyntaxFM in your tweets

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

• 00:47 Clean Talk
• 03:55 The menu of responsive design
• Syntax 154 with Sara Soueidan
• 06:52 Responsive design basics
• 11:54 What should you build for first in 2022?
• 16:15 Shrink and grow until it looks bad
• 21:36 Menus in responsive
• 23:43 Sponsor: Linode
• 24:13 Grid systems
• 28:08 Grid and Flexbox
• CSS Grid Course
• Flexbox Course
• Can I Use
• 35:02 Sponsor: LogRocket
• 36:00 Container queries
• 45:56 FitText
• 49:12 How do you test these types of things?
• 51:15 Future techniques coming
• 53:28 Sponsor: Freshbooks
• 53:56 SIIIIICK ××× PIIIICKS ×××

××× SIIIIICK ××× PIIIICKS ×××

• Scott: Lutron Light switches
• Wes: Sunco Lighting BR30

Shameless Plugs

• Scott: LevelUp Tutorials
• Wes: Wes Bos Tutorials

Tweet us your tasty treats

• Scott’s Instagram
• LevelUpTutorials Instagram
• Wes’ Instagram
• Wes’ Twitter
• Wes’ Facebook
• Scott’s Twitter
• Make sure to include @SyntaxFM in your tweets

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

• 00:13 Welcome
• 01:39 Sponsor: Sentry
• 02:41 Auth0
• 03:57 A bit more auth
• 05:24 New RFC
• RFC: First class support for promises and async/await
• 08:30 What are the basics of this proposal?
• 10:12 Scott gets a little Svelte-y
• 11:44 Why is this being proposed?
• 17:14 Infinite loop possibility
• 18:44 Why is Svelte API better in this use case?
• Tanstack
• Smooshgate

Tweet us your tasty treats

• Scott’s Instagram
• LevelUpTutorials Instagram
• Wes’ Instagram
• Wes’ Twitter
• Wes’ Facebook
• Scott’s Twitter
• Make sure to include @SyntaxFM in your tweets

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

• 00:36 Welcome
• Tinyclouds.org
• Ry on GitHub
• Deno
• Deno Discord
• 01:18 The introduction of Node
• 02:51 Why are you still betting on JavaScript for the web?
• 05:34 Why did you make Deno?
• 09:04 How does TypeScript fit into the landscape?
• 11:40 How is Deno so much faster?
• 13:28 Sponsor: Sanity
• 14:17 What is Deno written in?
• 15:56 Should developers be learning Rust?
• 18:27 Will libraries that work on npm eventually work in Deno?
• 21:52 Are we going to use Node API’s or web spec?
• 24:31 Sponsor: Sentry
• 25:31 What is tooling like for Deno?
• WinterCG
• Deno VS Code Extension
• 29:27 What is Deno deploy?
• Deno Deploy
• 34:01 Deno’s framework Fresh
• 38:56 Client side vs server side rendering
• 41:27 Sponsor: Gatsby
• 42:28 What’s the future of Deno?
• 43:39 Supper club questions
• 53:30 SIIIIICK ××× PIIIICKS ×××

Tweet us your tasty treats

• Scott’s Instagram
• LevelUpTutorials Instagram
• Wes’ Instagram
• Wes’ Twitter
• Wes’ Facebook
• Scott’s Twitter
• Make sure to include @SyntaxFM in your tweets

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

• 00:06 Welcome
• Syntax 525 - 2022 CSS Trends and Usage Web Almanac Part 1
• 01:22 Smart home updates
• 04:05 Box sizing: border box
• 06:57 CSS Columns
• 09:20 Aspect Ratio
• Can I Use CSS Properties Rotate
• 09:53 Transitions and animations
• 13:36 Transition time
• 17:05 Steps as a timing function
• 19:01 Sponsor: Prismic
• 19:43 Blend modes
• 23:57 Responsive web design
• 26:31 Prefers Color Scheme
• 27:48 Popular breakpoints
• 30:57 Sponsor: LogRocket
• 32:06 Feature queries and @ supports
• 34:59 Logical and physical properties
• 37:59 css-in-js
• Sam Magura - Why We’re Breaking Up with CSS-in-JS
• Brad Frost - Why We’re Breaking Up with CSS in JS
• 42:28 Sass
• 43:20 Print styles
• 45:38 Sponsor: Sanity
• 46:38 Longhand properities
• 48:21 Non-existant properties
• 52:06 SIIIIICK ××× PIIIICKS ×××

××× SIIIIICK ××× PIIIICKS ×××

• Scott: Front Bumper Drillless Plate Holder
• Wes: 1U Server Rack

Shameless Plugs

• Scott: LevelUp Tutorials
• Wes: Wes Bos Tutorials

Tweet us your tasty treats

• Scott’s Instagram
• LevelUpTutorials Instagram
• Wes’ Instagram
• Wes’ Twitter
• Wes’ Facebook
• Scott’s Twitter
• Make sure to include @SyntaxFM in your tweets

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

• 00:23 Welcome
• 01:39 Sponsor: Sentry
• 02:40 Sponsor: Freshbooks
• 04:05 Short form content intro
• WesBos.com/tips
• Wes on TikTok
• LevelUp Tutorials on TikTok
• Scott Stolinski on TikTok
• 07:16 The good and the bad of short form content
• 17:13 Repurposing content
• 18:36 Content that works
• 21:12 Tips for making short form content
• 24:19 Limitations of short form content
• 31:49 Tools for editing
• Screenflow
• Descript
• Detail.co

Tweet us your tasty treats

• Scott’s Instagram
• LevelUpTutorials Instagram
• Wes’ Instagram
• Wes’ Twitter
• Wes’ Facebook
• Scott’s Twitter
• Make sure to include @SyntaxFM in your tweets

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

• 00:30 Welcome
• 01:49 Safari aspect ratio bug
• 04:17 Thoughts on Vercel announcements?
• NextJS Conf
• 10:07 Gideon Riverside CTO
• Riverside.fm Careers
• 14:44 Do JS devs need to branch out?
• 16:52 Wasm
• Web Assembly (WASM)
• Rustlings
• 19:46 Sponsor: Auth0
• 21:03 Which company will Vercel aquire next?
• Guillermo Rauch
• Akamai Acquires Linode
• 27:12 Svelte Kit and Vercel
• 30:20 Why don’t you terminate your own ethernet cables?
• 30:58 How does Fly.io compare to Vercel?
• Fly.io
• 31:36 Did Wes learn Vue?
• 32:10 Brad jumping on the Remix train
• Remix
• 34:18 Layout shift caused by images in Markdown
• 38:30 Maintaining home networking
• Ubiquiti
• 44:44 Taking a course lead to a job with Microsoft
• Soumya’s YouTube - Geekysrm / website / Twitter
• 47:38 Sponsor: Appwrite
• 48:39 Are you still using your Synology NAS?
• Synology
• 53:53 Is Svelte ready for smaller team projects?
• Svelte Kit
• Wyze
• 56:03 HTMX
• htmx
• Alpine.js
• 01:49 Docker Wasm preview
• Introducing the Docker+Wasm Technical Preview
• WebAssembly System Interface

Tweet us your tasty treats

• Scott’s Instagram
• LevelUpTutorials Instagram
• Wes’ Instagram
• Wes’ Twitter
• Wes’ Facebook
• Scott’s Twitter
• Make sure to include @SyntaxFM in your tweets

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

• Scott: Air Compressor
• Wes: Blue Flush Cutter Mini Diagonal Cutting Pliers Side Cutter Nippers Wire Cutter

Shameless Plugs

• Scott: LevelUp Tutorials
• Wes: Wes Bos Tutorials

Tweet us your tasty treats

• Scott’s Instagram
• LevelUpTutorials Instagram
• Wes’ Instagram
• Wes’ Twitter
• Wes’ Facebook
• Scott’s Twitter
• Make sure to include @SyntaxFM in your tweets

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

• 00:24 Welcome
• 01:48 Sponsor: LogRocket
• 02:54 Sponsor: Linode
• 04:07 Minecraft thoughts
• Minecraft
• 06:25 Scratch
• Scratch
• 07:19 What is Zod?
• Zod
• Zod comparison
• 10:05 Features of Zod
• 13:24 How we’re using Zod
• 14:40 How Zod works with MongoDB
• 15:51 3rd party plugins
• 19:35 Zod ecosystem
• Zod Ecosystem
• 22:22 Asynchronous validation

Tweet us your tasty treats

• Scott’s Instagram
• LevelUpTutorials Instagram
• Wes’ Instagram
• Wes’ Twitter
• Wes’ Facebook
• Scott’s Twitter
• Make sure to include @SyntaxFM in your tweets

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

• 00:36 Welcome
• 02:11 Guest introduction
• 03:00 Do I have ADHD?
• CHADD
• 09:12 What is the threshold for diagnosis?
• 11:43 Are there other issues for computer workers?
• Arc Browser
• Syntax 513 - The Productivity Episode
• 15:27 Avoiding difficult or boring things
• 17:04 Structuring your day
• 18:41 Sponsor: LogRocket
• 20:12 Any tips for working in a distracting environment?
• MyNoise.net
• Headspace
• 23:40 Can I learn to deal with things?
• 27:28 How can I support a team member with ADHD?
• Missive
• 31:51 Sponsor: Appwrite
• 32:47 Any lifestyle changes to help with ADHD?
• 38:26 How do you find medical help?
• 42:39 How do you tell the difference between discipline vs ADHD?
• 47:05 Anxiety vs ADHD?
• 48:36 Dyslexia and ADHD
• 53:31 Inheritable or genetic
• 54:50 Don’t rely on self-diagnoses
• Psychology Today
• 55:48 SIIIIICK ××× PIIIICKS ×××

××× SIIIIICK ××× PIIIICKS ×××

• Taking Charge of Adult ADHD
• Bird feeder

Tweet us your tasty treats

• Scott’s Instagram
• LevelUpTutorials Instagram
• Wes’ Instagram
• Wes’ Twitter
• Wes’ Facebook
• Scott’s Twitter
• Make sure to include @SyntaxFM in your tweets

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

• 00:12 Weeeeeelcome
• 02:11 Slipsum mistake
• Slipsum
• 03:40 Brotli scaling explosion
• When JavaScript Bytes
• 05:14 Email loop
• Breaking Production with 56,000 emails
• 05:36 DevOops Magento store
• Example.com
• 08:26 Scary animal stories
• 11:09 Naming something Skynet
• 11:58 2003 Blackout
• 13:16 ExtJS error binding
• 17:09 Sponsor: Linode
• 17:55 Lead gen forms and captcha
• Issue Renaming upper-case ‘Sirupsen’ to ‘sirupsen’
• Follow up
• 19:51 Scarlet Letter
• 21:51 MongoDB achievement story
• Adam Coster
• 26:14 Sponsor: Auth0
• 28:11 Drupal and mysql database fun
• 30:10 Nervous Twitch
• 34:03 FTP access story
• 37:24 Sponsor: LogRocket
• 38:53 SIIIIICK ××× PIIIICKS ×××

××× SIIIIICK ××× PIIIICKS ×××

• Scott: Ear foam tips
• Wes: Stepped drill bit / Aliexpress link

Shameless Plugs

• Scott: LevelUp Tutorials
• Wes: Wes Bos Tutorials

Tweet us your tasty treats

• Scott’s Instagram
• LevelUpTutorials Instagram
• Wes’ Instagram
• Wes’ Twitter
• Wes’ Facebook
• Scott’s Twitter
• Make sure to include @SyntaxFM in your tweets

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

• 00:21 Welcome
• 01:17 Sponsor: Appwrite
• 03:16 Sponsor: Sanity
• 04:08 Schema
• Zod
• Apollo GraphQL
• 07:25 Promises
• 08:47 Async, Sync, Parallel and Concurrent
• 13:15 Dom vs Shadow Dom VS Page HTML
• 16:21 Methods vs Functions
• 18:18 Props
• 20:27 HTTP Requests are Stateless

Tweet us your tasty treats

• Scott’s Instagram
• LevelUpTutorials Instagram
• Wes’ Instagram
• Wes’ Twitter
• Wes’ Facebook
• Scott’s Twitter
• Make sure to include @SyntaxFM in your tweets

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

• 00:36 Welcome
• 02:15 Guest introduction
• fbritoferreira.com
• @SkyShowtime
• Peacock
• 04:13 What do the systems look like inside of Sky?
• GraphQL
• Redis
• Apollo GraphQL
• 06:26 Do you use federation?
• 07:50 How do you handle caching?
• 11:24 What’s the tech stack for the front end?
• 13:30 Do you cache on client side?
• 15:27 How long has Sky been serverless?
• 16:55 Sponsor: Gatsby
• 18:05 How was Sky’s Apple TV app built?
• 21:17 Where did you host media?
• AWS Streaming
• Mux
• 24:37 Supporting live events
• 28:03 Sponsor: Storyblok
• 30:05 What language are you writing the GraphQL layer?
• The Guild
• 32:22 How do you define your types?
• 36:40 Supper Club questions
• Apple Magic Keyboard with Touch ID
• Magic Keyboard with Touch ID and Numeric Keypad
• 44:28 Sponsor: ReTool
• 45:22 AppWrite
• AppWrite
• 48:42 SIIIIICK ××× PIIIICKS ×××

××× SIIIIICK ××× PIIIICKS ×××

• Anker 733 Power Bank (GaNPrime PowerCore 65W)

Tweet us your tasty treats

• Scott’s Instagram
• LevelUpTutorials Instagram
• Wes’ Instagram
• Wes’ Twitter
• Wes’ Facebook
• Scott’s Twitter
• Make sure to include @SyntaxFM in your tweets

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

• 00:15 Welcome
• 03:00 Spooky Render Times
• React Virtualized
• React Window
• 09:19 Push Notification Hell
• 13:11 Dark Friday
• 14:19 Tiny Ints with Big Problems
• 16:57 A/B Testing
• 18:47 Confirm Purchase button mistake
• 21:21 Sponsor: Sentry
• 22:34 Dike Leak
• 25:14 A Steep Grade
• 32:41 Falkland Islands mixup
• 33:40 Conference mixup
• 36:34 Sponsor: Prismic
• 37:58 Doctor Who Ipsum
• 43:55 Marketplace payouts
• 46:38 Sponsor: Freshbooks
• 47:42 SIIIIICK ××× PIIIICKS ×××

××× SIIIIICK ××× PIIIICKS ×××

• Scott: PopSocket Wallet
• Wes: Water flosser

Shameless Plugs

• Scott: LevelUp Tutorials
• Wes: Wes Bos Tutorials

Tweet us your tasty treats

• Scott’s Instagram
• LevelUpTutorials Instagram
• Wes’ Instagram
• Wes’ Twitter
• Wes’ Facebook
• Scott’s Twitter
• Make sure to include @SyntaxFM in your tweets

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

• 00:18 Welcome
• 01:25 Sponsor: Sentry
• 02:47 Sponsor: Sanity
• 04:50 What is Qwik?
• Qwik
• 08:05 What is SSR?
• 09:25 Working with hydration
• 15:31 Lazy loading, reduced rendering, and Qwik optimizer
• 17:30 Edge first
• 18:55 Data loading or data actions issues
• 20:49 Qwik City
• Qwik City

Tweet us your tasty treats

• Scott’s Instagram
• LevelUpTutorials Instagram
• Wes’ Instagram
• Wes’ Twitter
• Wes’ Facebook
• Scott’s Twitter
• Make sure to include @SyntaxFM in your tweets

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

• 00:37 Welcome
• 01:56 Guest introduction
• @Alexdotjs on Twitter
• Alex on GitHub
• Katt.dev
• tRPC.io
• 02:47 What is tRPC?
• 06:56 How does type safety work?
• 10:38 Sponsor: Polypane
• 13:20 What is Zod?
• 17:39 How does tRPC relate to GraphQL?
• 23:47 Sponsor: FireHydrant
• 25:25 What about a data loader?
• 29:04 React or NextJS adapters
• 30:41 How does it feel when people start building off your project?
• 33:58 Sponsor: Kontent by Kentico
• 37:34 What’s next for tRPC?
• 42:42 How is error handling done?
• 48:43 Supper Club questions
• 54:42 SIIIIICK ××× PIIIICKS ×××

××× SIIIIICK ××× PIIIICKS ×××

• Kysely

Tweet us your tasty treats

• Scott’s Instagram
• LevelUpTutorials Instagram
• Wes’ Instagram
• Wes’ Twitter
• Wes’ Facebook
• Scott’s Twitter
• Make sure to include @SyntaxFM in your tweets

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

• 00:10 Welcome
• 02:15 Cleaning Sick Pick
• Bar Keepers Friend
• 04:40 Web Almanac
• Web Almanac
• 08:23 CSS stylesheets size grow
• 09:49 Popular CSS Class names
• 15:29 How many websites use !important?
• 18:11 Popular pseudo classes
• 20:27 Sponsor: Prismic
• 21:38 CSS Attribute Selectors
• 27:03 Most popular units
• 32:23 calc properties
• 33:13 Sponsor: LogRocket
• 35:15 Top operators when using calc
• 36:21 Custom Property Names
• 37:39 Property Value types
• 38:00 Functions
• 39:27 Color names
• 42:02 Format of color
• 43:50 Most popular gardient on the web
• 47:27 Sponsor: Freshbooks
• 47:57 We don’t know the web
• 50:39 SIIIIICK ××× PIIIICKS ×××

××× SIIIIICK ××× PIIIICKS ×××

• Scott: Dawn
• Wes: Flat speaker wire

Shameless Plugs

• Scott: LevelUp Tutorials
• Wes: Wes Bos Tutorials

Tweet us your tasty treats

• Scott’s Instagram
• LevelUpTutorials Instagram
• Wes’ Instagram
• Wes’ Twitter
• Wes’ Facebook
• Scott’s Twitter
• Make sure to include @SyntaxFM in your tweets

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

• 00:25 Welcome
• 02:02 What are bookmarklets?
• Matt Busche’s fav bookmarklets Gist
• Bookmarklet Maker
• CSS Tricks - Web Development Bookmarklets
• 04:49 Using an Immediately invoked function expression
• 09:22 Greasemonkey
• Greasemonkey

Tweet us your tasty treats

• Scott’s Instagram
• LevelUpTutorials Instagram
• Wes’ Instagram
• Wes’ Twitter
• Wes’ Facebook
• Scott’s Twitter
• Make sure to include @SyntaxFM in your tweets

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

• 00:36 Welcome
• 01:13 Guest introduction
• Teej_dv on Twitter
• TJ Devries
• Teej_DV on Twitch
• TJ on YouTube
• Telescope on GitHub
• Neovim on GitHub
• Syntax 508 with The Primeagan
• 03:15 The difference between Vim and Neovim
• 06:14 Why did you choose to write in Lua?
• Lua
• Luajit
• 13:26 What is adapative UI in Neovim?
• 17:38 Lunarvim and alternatives
• Fvim
• LunarVim
• 20:24 Personalized development environment PDE
• PDE
• Firenvim
• 22:40 Sponsor: FireHydrant
• 23:21 Benefits of RPC
• 30:34 Is working on Neovim your job?
• Sponsor Neovim
• Sourcegraph
• 31:30 What is your approach to streaming?
• 34:11 Did you go to school for computer science?
• 39:12 Sponsor: Gatsby
• 39:46 Supper Club questions
• System76
• Pop
• Dactyl Manuform Keyboard Kit
• Jetbrains Mono
• 49:52 Sponsor: Hasura
• 50:47 SIIIIICK ××× PIIIICKS ×××

Tweet us your tasty treats

• Scott’s Instagram
• LevelUpTutorials Instagram
• Wes’ Instagram
• Wes’ Twitter
• Wes’ Facebook
• Scott’s Twitter
• Make sure to include @SyntaxFM in your tweets

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

• 00:11 Welcome
• 01:15 Fogging the boats
• 04:25 Use the platform
• 06:32 URLSearchParams
• 10:04 Pushstate and History API
• Pushstate
• 13:46 Internationalization API
• Internationalization API
• Syntax episode 153
• 16:03 FormData API
• MDN Docs
• Clipboard API tutorial
• 20:31 Sponsor: Prismic
• 21:23 All of the DOM API
• 24:12 Vanilla JS
• 26:06 Localstorage and IndexDB
• 29:18 Web Animations API
• 31:10 Sponsor: LogRocket
• 32:39 Endless other browser apis
• 38:22 Shadow DOM and Web Components
• Web Components for beginners
• 42:57 CSS variables
• 46:05 HTML
• 47:27 Sponsor: Sanity
• 49:19 More HTML
• 54:12 SIIIIICK ××× PIIIICKS ×××

××× SIIIIICK ××× PIIIICKS ×××

• Scott: Cable sleeve
• Wes: Kindling splitter

Shameless Plugs

• Scott: LevelUp Tutorials
• Wes: Wes Bos Tutorials

Tweet us your tasty treats

• Scott’s Instagram
• LevelUpTutorials Instagram
• Wes’ Instagram
• Wes’ Twitter
• Wes’ Facebook
• Scott’s Twitter
• Make sure to include @SyntaxFM in your tweets

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

• Scott’s Instagram
• LevelUpTutorials Instagram
• Wes’ Instagram
• Wes’ Twitter
• Wes’ Facebook
• Scott’s Twitter
• Make sure to include @SyntaxFM in your tweets

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

• 00:35 Welcome
• 01:30 Guest intro
• @NikolasBurk on Twitter
• 04:56 How has Prisma evolved?
• Prisma
• Keystone
• GraphQL
• 10:44 What was Prisma V1?
• 17:04 Is there any GraphQL specific functions in Prismic?
• 21:26 Sponsor: Hasura
• 22:26 What role does an ORM play in a tech stack?
• 29:54 What is Planetscale?
• Planetscale
• The T3 Stack
• 32:22 Where does TRPC fit?
• tRPC
• 33:46 Sponsor: Storyblok
• 35:28 What is an ORM?
• Prisma VS Code plugin
• 42:00 How do migrations work with Prisma?
• 45:58 Query your data with Prisma client
• 49:43 Have you looked into alternative JavaScript environments?
• 55:16 Sponsor: FireHydrant
• 57:05 Supper Club questions
• 58:50 SIIIIICK ××× PIIIICKS ×××

××× SIIIIICK ××× PIIIICKS ×××

• Lichess

Shameless Plugs

• Prisma blog

Tweet us your tasty treats

• Scott’s Instagram
• LevelUpTutorials Instagram
• Wes’ Instagram
• Wes’ Twitter
• Wes’ Facebook
• Scott’s Twitter
• Make sure to include @SyntaxFM in your tweets

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

• Scott: The Thorn Razor, Rockwell Blade Bank
• Wes: Milwaukee 48-22-1902 Fastback II

Shameless Plugs

• Scott: LevelUp Tutorials
• Wes: Wes Bos Tutorials / Beginner JavaScript

Tweet us your tasty treats

• Scott’s Instagram
• LevelUpTutorials Instagram
• Wes’ Instagram
• Wes’ Twitter
• Wes’ Facebook
• Scott’s Twitter
• Make sure to include @SyntaxFM in your tweets

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

• 00:26 Welcome
• 02:05 Sponsor: Linode
• 02:59 Sponsor: LogRocket
• 03:48 The last 10 percent
• 05:25 Break those things into Tasks
• 08:11 Just do it
• 09:10 Rewards
• 11:25 Be ok with good enough
• 14:21 Keep the end in sight
• 15:00 Do it “Quick a minute”

Tweet us your tasty treats

• Scott’s Instagram
• LevelUpTutorials Instagram
• Wes’ Instagram
• Wes’ Twitter
• Wes’ Facebook
• Scott’s Twitter
• Make sure to include @SyntaxFM in your tweets

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

• 00:36 Welcome
• 01:52 Guest introduction
• OpenSauced.pizza
• @Bdougieyo on TikTok
• bdougie on Twitch
• Open Sauced on YouTube
• bdougie on YouTube
• Jamstack
• Netlify
• 03:36 What was the inspiration for Open Sauced?
• 08:23 GitHub GraphQL API
• 13:22 What are your thoughts on GraphQL?
• GraphQL
• 14:36 What is the T3 stack?
• 16:30 Sponsor: Hasura
• 17:53 What is the goal for Open Sauced?
• Open Sauced Beta for Hacktoberfest
• 20:08 What is your focus with live streaming?
• T3 Stack
• Vite
• The Primeagan on Syntax Episode 508
• Octoverse
• Hot Open Sauced Pizza
• 21:39 What hardware and software do you live stream with?
• Rode Procaster
• Wave XLR
• GoXLR
• OBS
• 25:26 Should adults be on TikTok?
• 30:31 How do you build an algorithm?
• 32:44 Sponsor: Storyblok
• 34:01 Supper club questions
• Keychron K2
• Warp
• Ghostwriter from Replit
• A first look at GitHub Copilot
• Stable Diffusion
• Fig
• 43:17 Sponsor: FireHydrant
• 44:36 Interviews with open source maintainers
• 45:55 How should maintainers get paid?
• Patreon
• GitHub Sponsors
• Neovim
• Vim Adventures
• Lunar Vim
• 47:47 SIIIIICK ××× PIIIICKS ×××
• 51:34 Shameless Plugs