Syntax - Tasty Web Development Treats

Latest Episodes:

Potluck × JR Devs & Copilot × CSS Variable Limitations × SvelteKit May 24, 2023

Show notes

In this potluck episode of Syntax, Wes and Scott answer your questions about not becoming dependent on Copilot, CSS variable limitations, finding Sick Picks, lodash hate, and more!

Show Notes

00:11 Welcome
00:55 Ice, ice baby
02:01 Reactathon
Reactathon returns May 2-3, 2023
The edge cloud platform behind the best of the web | Fastly
04:49 Submit your question for our next potluck
05:24 How do you suggest adding form / database to Svelte?
Svelte • Cybernetically enhanced web apps
Astro
08:18 What can’t go into a CSS custom prop?
12:42 Are there any really good certifications for Javascript or general full stack development?
16:21 What is the most exciting thing about teaching programming for both of you?
19:37 What is the most challenging thing you have ever overcome in this field?
21:55 How can junior to mid-level devs make the most out of GitHub Copilot while avoiding getting dependent on it and hurting their abilities in the long run?
26:23 Any tips on driving a culture of code quality in a team?
30:28 How soon should Sentry be brought into a new project being built from scratch?
33:11 Is there a place where I can search through all the Sick Picks?
Syntax Sick Picks
34:40 Why is box-sizing: border-box; not the default?
37:51 Is using lodash in a NextJS web application a terrible idea nowadays?
40:42 What is the best practice for storing JWT token?
43:53 Any tips on converting ajax requests to use Fetch API?
patch-package - npm
45:11 Any suggestions for tips for updating a very dated React Native codebase?
50:56 SIIIIICK ××× PIIIICKS ×××

××× SIIIIICK ××× PIIIICKS ×××

Scott: Tales of Taboo podcast Spotify / Apple Podcasts
Wes: Rubber Flooring

Shameless Plugs

Scott: Sentry
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
Wes Bos on Bluesky
Scott on Bluesky
Syntax on Bluesky

Why Is node_modules So Big? May 22, 2023

Show notes

In this Hasty Treat, Scott and Wes talk about the reasons your node_modules folder gets so large, and what you can do to help keep the file size down.

Show Notes

00:24 Welcome
00:51 The punching bag of Javascript
DaisyDisk
02:03 Spoiler alert - it’s text
04:49 What actually increases the size?
07:29 Types
09:27 Polyfills
11:09 Raycast Snippets and BetterTouchTool
12:44 Babel
15:08 Markdown
15:52 Translations
18:23 What is the solution?
Raycast
Bundlephobia | Size of npm dependencies
Better Touch Tool
Fast, disk space efficient package manager | pnpm

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
Wes Bos on Bluesky
Scott on Bluesky
Syntax on Bluesky

Supper Club × Adam Argyle on What's New in CSS May 19, 2023

Show notes

In this supper club episode of Syntax, Wes and Scott talk with Adam Argyle about a ton of new CSS features that have arrived or are coming soon, as well as his new site Gradient.style.

Show Notes

00:34 Welcome
01:05 Guest introduction
Adam on Bluesky
Adam on Twitter
01:48 CSS buckets
New CSS Relative Units · January 6, 2023
03:16 rex rch ric rlh
08:06 Gradient.style
CSS HD Gradients
Open Props: sub-atomic styles
13:49 What are style queries vs container queries vs state queries?
una.im | Style Queries
Getting Started with Style Queries - Chrome Developers
CSS Container Style Queries | Can I use… Support tables for HTML5, CSS3, etc
18:09 Trig functions
Trigonometric functions in CSS
CSS Trigonometric Functions: cos() and sin(): dots on a circle
19:57 Live transitions
Understand Disney’s 12 principles of animation | Creative Bloq
25:08 View transitions
View Transitions Demo
View Transitions API - Web APIs | MDN
26:01 Text-wrap balance
CSS text-wrap: balance - Chrome Developers
26:45 Text-wrap pretty
27:44 What’s the future of the browser landscape?
31:44 nth-child(An+B [of S])
33:06 Cascade layers
34:40 CSS Nesting
38:03 Animate discrete properties
39:42 Linear function
Linear easing generator
41:33 Media query range syntax
42:04 Subgrid everywhere
44:41 Media query range and variables?
UI Elements - Basics, Best Practice, and Built Ins — Syntax Podcast 612
45:32 env variables
Hasty Treat - CSS Nesting 1 — Syntax Podcast 343
46:59 Animation composition
49:50 Select menu HTML element
52:16 SIIIIICK ××× PIIIICKS ×××

××× SIIIIICK ××× PIIIICKS ××× Shameless Plugs

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
Wes Bos on Bluesky
Scott on Bluesky
Syntax on Bluesky

Where Should You Host Your App? Hosting Providers Compared May 17, 2023

Show notes

In this episode of Syntax, Wes and Scott talk about your options for hosting your app including some of the big players, but also others you may not have heard of.

Show Notes

00:11 Welcome
01:06 Explaining basic concepts in hosting providers
07:55 How is hosting priced?
10:09 The big names in hosting
Amazon Web Services
Google Cloud
Microsoft Azure
DigitalOcean | The Cloud for Builders
Sales Cloud
Flightcontrol — AWS Without Pain
Supper Club × Next.js on AWS + Serverless with Dax Raad — Syntax Podcast 589
16:29 Render
Render
23:50 Vercel
Vercel: Develop. Preview. Ship. For the best frontend teams
28:04 Heroku
Cloud Application Platform | Heroku
31:58 Digital Ocean
36:10 Linode
Create your account - Linode
38:34 Netlify
Develop and deploy websites and apps in record time | Netlify
The Deno Show — Syntax Podcast 322
Decap CMS | Open-Source Content Management System
46:30 Fly
Deploy app servers close to your users · Fly
Railway
54:19 Cloudflare
Cloudflare - The Web Performance & Security Company | Cloudflare
00:43 Deno deploy
Deno Deploy | Deno
03:04 SIIIIICK ××× PIIIICKS ×××

××× SIIIIICK ××× PIIIICKS ×××

Scott: Automators - Relay FM
Wes: Dropbox.com

Shameless Plugs

Scott: Sentry
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
Wes Bos on Bluesky
Scott on Bluesky
Syntax on Bluesky

WTF Are Signals And Why Is Everyone So Hot On Them All Of The Sudden? May 15, 2023

Show notes

In this Hasty Treat, Scott and Wes talk about Signals - what are signals and why is everyone talking about them suddenly?

Show Notes

00:25 Welcome
01:40 Chipping away at projects
03:20 WTF are signals?
Signals
Framework reimagined for the edge! - Qwik
SolidJS · Reactive Javascript Library
Zone
Vanilla
09:03 What are the boundaries on signals?
10:49 Why are signals so popular now?
15:57 When wouldn’t you use signals?

Tweet us your tasty treats

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

Supper Club × Dylan Jhaveri - Video for the Web and MUX May 12, 2023

Show notes

In this supper club episode of Syntax, Wes and Scott talk with Dylan Jhaveri about his work at Mux, how Mux ingests and spits out video, and where Mux fits in a tech stack for developers working with video and audio.

Show Notes

00:36 Welcome
01:27 Who is Dylan Jhaveri?
Dylan (@dylanjha)
The Internet’s video infrastructure | Mux
Mux Player
03:04 Why did you build Mux Player?
FFmpeg
FFmpeg WASM
06:19 How did you chose to go with web components?
CanIUse Mediasource
09:36 What is Mux?
15:20 Can you stitch or clip video via the API with Mux?
18:07 Do you think hls will be supported in Chromium or Firefox?
21:56 How does Mux process videos into 5 versions?
26:35 Is Web assembly in use for video?
27:55 Has Mux researched AI for video?
31:13 Building a podcast transcription video
36:49 Do you have to use MP4? What about webM?
39:36 Media Chrome video player
Elements for building media players
44:58 What’s Mux Data?
Mux Data
49:33 Slick Mux website
Mux.com
52:13 SIIIIICK ××× PIIIICKS ×××

××× SIIIIICK ××× PIIIICKS ×××

Cruise

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

UI Elements - Basics, Best Practice, and Built Ins May 10, 2023

Show notes

In this episode of Syntax, Wes and Scott talk about UI elements and best practices with UI elements, as well as UI elements that exist in browsers.

Show Notes

00:10 Welcome
01:10 Making demos for fun
02:47 Why we’re talking UI elements
03:48 Bad UI elements in the browser
Syntax 602: Modals, Popups, Popovers, Lightboxes
Progress
10:47 Decent UI elements in browser
19:49 Enter Open UI
Open UI
34:39 Accordion hunks
38:15 Pop overs
42:15 Focus group
46:10 SIIIIICK ××× PIIIICKS ×××

××× SIIIIICK ××× PIIIICKS ×××

Scott: Fishskyn
Wes: Flavacol & Butter Flavoured Coconut Oil

Shameless Plugs

Scott: Sentry replays
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

Bluesky + AT Protocol May 08, 2023

Show notes

In this episode of Syntax, Wes and Scott talk all things Bluesky, the AT Protocol it’s built in, the terminology of Bluesky, and how the API currently works.

Show Notes

00:07 Welcome
00:53 Welcome to the Bluesky
Wes Bos on Bluesky
Scott on Bluesky
Syntax on Bluesky
03:14 What could the new Twitter be?
07:56 What is Bluesky?
Nostr
Bluesky
Twitter Blue
Bluesky Staging
Bluesky FAQ
10:25 Why is social media important?
14:01 What is AT Protocol?
22:06 Lexicon for Bluesky
28:10 Small group of devs building Bluesky
Cravings by Chrissy Teigen | Fun Recipes & Cookware
29:54 Blocking issues
31:53 Bluesky API
Samy on Darknet Diaries ep61

Shameless Plugs

Scott: Sentry)
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

Supper Club × Zach Lloyd from Warp May 05, 2023

Show notes

In this supper club episode of Syntax, Wes and Scott talk with Zach Lloyd about how Google Sheets works, why Zach wanted to build Warp, why did they use Rust to write Warp in, is Warp going to come to Windows, and more!

Show Notes

00:20 Welcome
01:12 Who is Zach Lloyd?
Zack on Twitter
Zack on LinkedIn
Warp Terminal × Next Gen Terminals — Syntax Podcast 579
Warp: The terminal for the 21st century
03:41 How does Google Sheets work?
GWT
13:38 What is Warp and why did you build it?
Introducing Warp
16:50 Why did you build Warp in Rust?
Rust Programming Language
Harfbuzz
Adventures in Text Rendering: Kerning and Glyph Atlases
23:20 How would you move Warp to Windows?
26:02 How would you run Warp on the web?
31:24 How are the blocks done inside Warp?
36:23 Would Warp ever add a shell?
40:04 Is better completion support coming to Warp?
44:42 Warp AI features
52:08 Supper Club questions
56:52 SIIIIICK ××× PIIIICKS ×××
Oh My Zsh - a delightful & open source framework for Zsh

××× SIIIIICK ××× PIIIICKS ×××

Tonal | The World’s Smartest Home Gym Machine For Strength & Fitness

Shameless Plugs

Join Us | Warp

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

The Syntax Giveaway Site - Codes, Bots, Tech Stack and More! May 03, 2023

Show notes

In this episode of Syntax, Wes and Scott talk about the tech stack they used to create the Syntax giveaway site for the Sentry + Syntax announcement week. What were the features of the site, how’d they generate proper codes, and how’d they stop developers from hacking the system?

Show Notes