Syntax - Tasty Web Development Treats - podcast cover

Syntax - Tasty Web Development Treats

Wes Bos & Scott Tolinski - Full Stack JavaScript Web Developerssyntax.fm
Full Stack Developers Wes Bos and Scott Tolinski dive deep into web development topics, explaining how they work and talking about their own experiences. They cover from JavaScript frameworks like React, to the latest advancements in CSS to simplifying web tooling.

Episodes

794: Prettier JavaScript with Vjeux

Scott and Wes sit down with Vjeux from Meta to dive deep into the origins and evolution of Prettier, the widely-used code formatter. They discuss the challenges faced, the decision-making process behind its features, and what the future holds for this indispensable tool in the developer’s toolkit. Show Notes 00:00 Welcome to Syntax! 01:45 Brought to you by Sentry.io . 02:19 New swag ! 03:25 Who is Vjeux? 06:56 Is management the key to successful projects? 08:50 The genesis of Prettier. 12:08 Why...

Jul 12, 202455 min

793: The Local First Landscape

Scott and Wes dive into the local first landscape, exploring the benefits and possibilities of local first apps. They highlight some of their favorite tools and discuss why local first is gaining traction among developers. Show Notes 00:00 Welcome to Syntax! 00:27 Behind the Code : Brought to you by Sentry.io . 01:06 Catch up with Wes and Scott. 03:00 The local first space. Scott’s Blog: The Spectrum of Local First Libraries . Syntax 739: The Lofi Movement . 04:27 Some local first apps we love. ...

Jul 10, 202453 min

792: Perfect Sitemaps for SEO

Scott and Wes break down the importance of sitemaps for SEO. They dive into the different file formats, essential fields, and common pitfalls to avoid when creating and submitting your sitemap to search engines. Show Notes 00:00 Welcome to Syntax! New Swag Coming Soon . Tolin.ski . 02:09 Brought to you by Sentry.io . 02:39 Sitemaps. 04:36 Why do you need a sitemap? 06:34 Sitemap file formats. 08:31 Choosing a file format. 09:17 Site map file size limits. 10:32 Fully-qualified URLs. 10:50 Fields ...

Jul 08, 202424 min

791: LLRT The Serverless Runtime w/ Richard Davison

Scott and Wes chat with Richard Davison from AWS about LLRT, a new runtime tailored specifically for Lambda. They dive into the benefits of using LLRT, challenges with JavaScript in serverless, and why Rust was chosen for its development. Show Notes 00:00 Welcome to Syntax! 01:07 Who is Richard Davison? 05:11 What is LLRT and what’s the motivation for building it? 08:25 AWS Lambda example. 11:20 What makes LLRT specifically tailored to Lambda? 14:55 Brought to you by Sentry.io . 15:22 Node.js in...

Jul 05, 202457 min

790: State of JS 2023 Reactions

Scott and Wes dive into the 2023 State of JavaScript survey, breaking down the latest trends and pain points in front-end frameworks, build tools, and JavaScript runtimes. Tune in for their hot takes and insights on what’s shaping the JavaScript landscape this year! Show Notes 00:00 Welcome to Syntax! State of JS 2023 . 03:04 Brought to you by Sentry.io . 03:43 New Syntax Swag! Syntax Swag Store . 04:42 Front end frameworks. 08:30 Front end framework pain-points. 12:17 Metaframeworks. 17:45 Meta...

Jul 03, 202457 min

789: Do More With AI - LLMs With Big Token Counts

Join Scott and CJ as they dive into the fascinating world of AI, exploring topics from LLM token sizes and context windows to understanding input length. They discuss practical use cases and share insights on how web developers can leverage larger token counts to maximize the potential of AI and LLMs. Show Notes 00:00 Welcome to Syntax! 01:31 Brought to you by Sentry.io . 02:42 What is a token? Quizgecko GPT-4 Token Counter . 04:22 Context window sometimes called “max tokens”. OpenAI Platform Mo...

Jul 01, 202434 min

788: Supabase: Open Source Firebase for Fullstack JS Apps

Scott and CJ chat with Paul Copplestone, CEO and co-founder of Supabase, about the journey of building an open source alternative to Firebase. Learn about the tech stack, the story behind their excellent documentation, and how Supabase balances business goals with open-source values. Show Notes 00:00 Welcome to Syntax! 00:30 Who is Paul Copplestone? 01:17 Why ‘Supa’ and not ‘Super’? 02:26 How did Supabase start? 04:29 How long from inception to joining Y Combinator ? 05:10 Was it always intended...

Jun 28, 202454 min

787: You Should Try Vue.js

Scott and CJ dive deep into the world of Vue.js, exploring what makes this frontend framework unique and why it stands out from React and Svelte. CJ gives a comprehensive tour, covering everything from getting started to advanced features like state management and Vue’s built-in styles. Show Notes 00:00 Welcome to Syntax! 00:46 Brought to you by Sentry.io . 02:24 What is Vue ? 04:13 Similar to Svelte, different from React. 05:35 How to get started with Vue. 05:43 Script tag. 06:01 CLI. 07:10 The...

Jun 26, 202454 min

786: What Open Source license should you use?

Scott and CJ dive into the world of open source, breaking down its meaning, benefits, and the various types of licenses you’ll encounter. From permissive licenses like MIT and Apache 2.0 to copy-left licenses such as GNU GPLv3, they’ll help you choose and apply the right license for your project. Show Notes 00:00 Welcome to Syntax! 00:54 Brought to you by Sentry.io . Sentry Open Source . Giving away $500,000 to open source projects . 01:56 What is open source? 03:19 This is not legal advice. 03:...

Jun 24, 202431 min

785: What’s Next for Next.js with Tim Neutkens

Scott and Wes dive into the world of Next.js with special guest Tim Neutkens from Vercel. They explore the latest updates, including the React Compiler and React Server Components, discussing their impact on developer workflows and the future of Next.js development. Show Notes 00:00 Welcome to Syntax! 00:30 What does the React Compiler do? 05:04 Will React Compiler help with managing Context? 06:39 What happens if you’re not using a React Compiler? react.dev Playground . 09:30 Will this work on ...

Jun 21, 20241 hr 3 min

784: Logging × Blogging × Testing × Freelancing

In this Potluck episode, Scott and Wes tackle listener questions on modern blogging, website environmental impact, and using LangChain with LLMs. They also cover CSS hyphens, unit vs. integration testing, and balancing web development with new parenthood. Show Notes 00:00 Welcome to Syntax! 00:13 How to submit a question for future episodes. Potluck Questions . 02:46 Brought to you by Sentry.io . 03:21 Logging from a site. 08:39 Blogging in 2024. 11:49 Sharing website environmental data. Green W...

Jun 19, 202456 min

783: How We Built a Netflix Style “Save for Offline” Feature Into Syntax

Scott and Wes dive into the world of browser caching for audio files, exploring the File System API and the Cache API. They discuss size restrictions across different browsers, how tools like Riverside.fm leverage IndexedDB, and walk through code examples for creating, retrieving, and managing cached audio data. Show Notes 00:00 Welcome to Syntax! 02:07 Brought to you by Sentry.io . 02:33 The file system API. 03:08 The Cache API. Mozilla Developer Cache API . Airhorner, a good example . 04:24 Si...

Jun 17, 202431 min

782: The Developer’s Guide To Fonts with Stephen Nixon

Scott and CJ are joined by Stephen Nixon of ArrowType to delve into the world of fonts and type for developers. They explore the intricacies of font creation, the utility of variable fonts, and offer tips for making visually appealing typography on the web. Show Notes 00:00 Welcome to Syntax! 00:57 Who is Stephen Nixon? Process Type Foundry . Mark Simonson Proxima Nova . 05:42 What is a type foundry exactly? ArrowType . 09:09 Font / type making. 09:15 How do you make a font? RoboFont . Glyphs . ...

Jun 14, 20241 hr 2 min

781: Potluck - The Value of TypeScript × Vue vs Svelte × Leetcode

In this potluck episode of Syntax, Scott and CJ serve up a variety of community questions, from the nuances of beginner vs. advanced TypeScript to the pros and cons of SvelteKit. They also discuss falling out of love with React, shipping private packages via NPM, and the eternal struggle of always starting but never finishing projects. Show Notes 00:00 Welcome to Syntax! 01:06 Brought to you by Sentry.io . 01:49 Today’s format. 02:23 Beginner vs advanced TypeScript. DHH Tweet . 09:23 Does Svelte...

Jun 12, 20241 hr 1 min

780: Cloud Storage: Bandwidth, Storage and BIG ZIPS

Today, Scott and Wes dive into cloud storage solutions—why you might need them, how they use them, and what you need to know about the big players, fees, and more. Show Notes 00:00 Welcome to Syntax! 01:14 Brought to you by Sentry.io . 02:05 Why you might need a cloud storage provider. 03:07 How we use cloud storage. Dropshare . 08:16 Why you may need larger storage. 09:49 The big players in this space. Amazon S3 . Cloudflare R2 . Backblaze B2 . Synology C2 . Google Cloud Storage . Microsoft Azu...

Jun 10, 202429 min

779: Why SQLite is Taking Over with Brian Holt & Marco Bambini

Scott and CJ dive into the world of SQLite Cloud with special guests Brian Holt and Marco Bambini. They explore why SQLite is gaining traction, its unique features, and the misconceptions surrounding its use—let’s get into it! Show Notes 00:00 Welcome to Syntax! 01:20 Who is Brian Holt? 02:26 Who is Marco Bambini? 05:12 Why are people starting to talk so much about SQLite now? 08:47 What makes SQLite special or interesting? 09:46 What is a big misconception about SQLite? 11:13 Installed by defau...

Jun 07, 202451 min

778: 11 Habits of Highly Effective Developers

Today, Scott and Wes dive into the 11 habits of effective web developers, from understanding stakeholder goals to maintaining a work-life balance. We’ll explore the importance of continuous learning, having a problem-solver mentality, and being empathetic towards coworkers and users—let’s get into it! Show Notes 00:00 Welcome to Syntax! Previous Episode: 754 . 00:50 Brought to you by Sentry.io . 01:24 Denver weather is something else. 02:15 Habit #1: You understand stakeholder and business goals...

Jun 05, 202451 min

777: The Modern Dev CMS - Pocketbase

Today, Scott and Wes are diving into Pocketbase, a fantastic tool for web developers to quickly set up a CMS without breaking a sweat. We’ll cover everything from its Go-based architecture to its slick admin interface and how you can get started hosting it for free on Fly.io. Show Notes 00:00 Welcome to Syntax! 01:34 Brought to you by Sentry.io . 02:26 Overview of Pocketbase . 06:51 Written in Go, but no extending needed. Host for free on Fly.io . 07:37 Hooks. 08:05 Authentication + roles. 09:23...

Jun 03, 202425 min

776: How 1Password Uses WASM and Rust for Local First Dev With Andrew Burkhart

Today we’re serving up an episode on 1Password with Senior Rust Developer Andrew Burkhart, delving into how 1Password works, tackling conflict resolution and security challenges, and exploring the benefits of using Rust. Show Notes 00:00 Welcome to Syntax 00:57 Who is Andrew Burkhart? 01:36 How does 1Password work? 03:24 What’s the data flow on creating a new login? 05:40 The conflict resolution challenges of pull first, push second. 06:46 Merging strategies: How do you chose which device wins t...

May 31, 202458 min

775: Components We Need on Every Project

In today’s episode, Scott and Wes dive into the essential components they need on every web project, discussing whether to build them from scratch or leverage existing libraries—everything from navigation bars and modals to toast messages and icons. Show Notes 00:00 Welcome to Syntax! 01:48 Brought to you by Sentry.io . 02:53 Nav / Mobile Nav. 08:43 Header. 10:41 Toast message. Wes’ TikTok Demo . 18:51 Portal. 21:02 Drawer. 22:56 Auth forms. 28:49 Dialog / Modal. 31:30 Whats the difference betwe...

May 29, 202456 min

774: Promise Flow Control, Concurrency, Libraries, TypeScript and Deferreds - Part 3

In today’s episode, Scott and Wes dive into the final part of our JavaScript Promises series, covering deferred promises, fetch, flow control, concurrency with libraries like p-map and p-limit, and integrating TypeScript. Show Notes 00:00 Welcome to Syntax! 00:31 Brought to you by Sentry.io . 01:11 Deferred promises. Promise.withResolvers() . Wes’ TikTok . 06:10 Fetch. 09:04 Flow Control. 12:19 Concurrency, Throttling, Queuing. p-map . p-limit . 16:13 TypeScript and Promises. Hit us up on Social...

May 27, 202421 min

773: React Native with Robin Heinze

Scott and Wes dish out a feast with Robin Heinze from Infinite Red, diving into the world of React Native. They discuss how React Native differs from other webview platforms, highlight popular apps built with it, and serve up essential tools and libraries to spice up every React Native project. Show Notes 00:00 Welcome to Syntax! 01:13 Brought to you by Sentry.io . 01:30 React Native is different than Cordova or other webview platforms. 04:18 Is there a ‘write once deploy everywhere’ aspect? 05:...

May 24, 202457 min

772: React Server Components with PHP, Selling Accessibility, WTF is Cloudflare + more

In this Potluck episode of Syntax, Scott and Wes tackle community questions on handling overwork, teaching programming to family, and React’s Server Components. They also discuss quantifying accessibility improvements, choosing course platforms, and navigating professional growth in challenging workplaces. Show Notes 00:00 Welcome to Syntax! Thanks to Codeium . Syntax Episode 728 with Codeium . 01:37 Brought to you by Sentry.io . 02:38 Rewarding hard work with more work. 07:14 April Fools Episod...

May 22, 20241 hr

771: Promises: Error Handling, Aborts, and Helper Methods - Part 2

We’re diving into part 2 of our 3-part series on Promises, focusing on error handling, aborts, and essential helper methods. We’ll explore how to manage errors effectively and improve performance with abort signals. Let’s get into it! Show Notes 00:00 Welcome to Syntax! 00:41 Brought to you by Sentry.io . 02:00 Cancelling promises. 05:16 Why would you reach for an abort signal? 06:26 Promise helpers. 07:04 Promise.all() vs Promise.allSettled(). 09:12 promiseInstance.finally() 09:26 Promise.any()...

May 20, 202421 min

770: Design Systems With Brad Frost (Rereleased)

In this revisited supper club episode, Wes and Scott talk with Brad Frost about how to implement design systems in small and large scale projects, best practices around naming things, keeping everything in sync across different codebases, and how design systems help projects. Show Notes 00:00 Welcome to Syntax! 00:49 Brought to you by Sentry.io . 01:14 Introducing Brad Frost. Brad Frost.com . Atomic Design by Brad Frost . Brad (@brad_frost) on Twitter . Brad on LinkedIn . Brad on Mastodon . Brad...

May 17, 202459 min

769: React Miami Live Show

Welcome to a special live edition of Syntax, recorded at React Miami! Join Scott and Wes as they dish out games galore, from Spot the Syntax Error to JS or NAYS, all while engaging with the audience in this lively session of coding camaraderie. Plus, who’s the better programmer? Stay tuned to find out! Show Notes 00:00 Welcome to Syntax! 00:54 Meet the Syntax team . 01:22 The plan for today. 02:38 .map() .filter() .reduce() 06:39 Syntax Error. 15:37 JS or NAYS. 21:08 Audience Stump’d. 24:51 Q + ...

May 15, 202434 min

768: React 19 is here!

Scott and Wes serve up all the deets on the latest React 19 update, exploring new features like actions, web components, use()API, and document metadata. Stay tuned as they discuss the ins and outs of upgrading to React 19 and what it means for your projects. Show Notes 00:00 Welcome to Syntax! 01:30 Brought to you by Sentry.io . 02:03 What’s in the update? React 19 Beta Release Notes . 03:03 Actions + server actions. Syntax Episode 766 . 04:54 Using server actions for a checkout. 06:11 Web comp...

May 13, 202427 min

767: Local First and TypeScript’s Missing Library with Johannes Schickling

In this episode, Scott and Wes dive into the world of local-first apps with Johannes Schickling, the mastermind behind Prisma. From databases, WASM for non-JS, to authentication challenges, they explore the ins and outs of crafting apps that prioritize local functionality. Show Notes 00:00 Welcome to Syntax! 01:10 Brought to you by Sentry.io . 01:28 What is Overtone ? 03:45 Can you explain the experience you’re trying to achieve? 06:43 What makes the best music app? Is it local first? 08:03 Is i...

May 10, 202456 min

766: React Server Components: Form Actions + Server Actions

Scott and Wes are here to guide you through the world of React Server Components, shedding light on the intricacies of Form Actions and Server Actions. Get ready to level up your React skills as they discuss the ins and outs of these powerful features and share their expert advice on optimizing your applications. Show Notes 00:00 Welcome to Syntax! Show 718 React Server Components . 02:04 Brought to you by Sentry.io . 03:04 What are form actions? GitHub Add React.useActionState PR 04:05 Almost e...

May 08, 202447 min

765: JS Promises Fundamentals - Part 1

In this 3-course series, Scott and Wes serve up some JavaScript Promises treats. In part 1, they unravel the concept of promises and delve into common examples of their usage, from creating and waiting on promises, to database queries and user permissions. Show Notes 00:00 Welcome to Syntax! 01:27 Brought to you by Sentry.io . 02:32 What is a promise? Promise mdn web docs . 03:27 Common examples of promises. 03:45 A fetch call to an API returns a promise. 05:54 A database query or Insert command...

May 06, 202422 min