Syntax - Tasty Web Development Treats

Latest Episodes:

Rendering Methods Explained Dec 12, 2022

Show notes

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

Supper Club × Coding at Disney with Vu Le Dec 09, 2022

Show notes

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

Code Styles: Readable Rules and Petty Preferences Dec 07, 2022

Show notes

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

GitHub Next Projects Dec 05, 2022

Show notes

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

LogRocket - Sponsor

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

Supper Club × Bun with Jared Sumner Dec 02, 2022

Show notes

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

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

Potluck × Twitter Following × TypeScript × Playwright Nov 30, 2022

Show notes

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

LogRocket - Sponsor

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

Serverless Limitations Nov 28, 2022

Show notes

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

Sentry - Sponsor

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

Supper Club × Anything But Coding with Wes and Scott Nov 25, 2022

Show notes

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

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

Responsive Design Techniques Nov 23, 2022

Show notes

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

LogRocket - Sponsor

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

React use() hook and Async Server Components Proposal Nov 21, 2022

Show notes

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

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

Our TOPPODCAST Picks

Follow Us

Stay Connected

Syntax – Tasty Web Development Treats

Related Podcasts

Links

Stay Connected