Syntax - Tasty Web Development Treats

Scott and Wes serve up answers to community questions, from navigating Light DOM vs. Shadow DOM to diving into tools for data extraction. Plus, they dish out insights on Gatsby in 2024, utilizing JavaScript ‘wheel events’, and explore the possibilities of hosting a website at home. Show Notes 00:0000:51Sentry.io01:1703:43LinkeDOM on GitHub08:29LocalFirst.fm MeteorJS UI Updates15:05Goodhertz Audio Software16:34Runway.comGSAP Animate Anything CSS Scroll-Driven Animations23:15Episode 751Thinkmill.com27:44Frame Rate Testing Results on X32:31CJ and Self-Host 101Hetzner.com Cloudflare Docs Create a Tunnel36:52Episode 739Local-First Web Development Syntax Side Dish Explainer Playlist39:41OpenAI Speech to TextInsanely Fast WhisperDeepgram43:51 Sick Picks Hair PowderMini Grease Gun Hit us up on Socials! Syntax: X Instagram Tiktok LinkedIn Threads Wes: X Instagram Tiktok LinkedIn Threads Scott:X Instagram Tiktok LinkedIn Threads Randy: X Instagram YouTube Threads

Scott and Wes chomp through CSS Mixins and Functions, discussing the latest features making their way into CSS. From Tailwind-like classes to fluid typography, join us as we explore the possibilities and practical applications of these new tools. Show Notes 00:0001:24Sentry.io03:00CSS Mixins and Functions Explainer CSS Working Group Discussion06:1907:2609:1212:0215:5816:3117:5320:0821:13 Hit us up on Socials! Syntax: X Instagram Tiktok LinkedIn Threads Wes: X Instagram Tiktok LinkedIn Threads Scott:X Instagram Tiktok LinkedIn Threads Randy: X Instagram YouTube Threads

We were wrong, Manifest V3 is a big deal. Scott and Wes sit down with Oliver Dunk from Google to dive into the intricate world of Chrome Extensions development. From dissecting Manifest V3 to exploring the evolving landscape of browser security and extension reviews, this conversation covers the present and future of browser customization. Show Notes 00:0000:3202:00Sentry03:1708:5909:5610:5213:5615:1716:0619:06 Reddit Thread, The real threat of Manifest V320:3221:1823:3225:5828:33 SidePanel33:0935:5438:39YouTube Chrome for Developers40:3341:5744:0444:4545:2046:3847:1847:5151:47 Sick Picks Defunctland YouTubeLEMMiNO YouTube Shameless Plugs Chrome Extensions Getting StartedWebExtension Playground Hit us up on Socials! Syntax: X Instagram Tiktok LinkedIn Threads Wes: X Instagram Tiktok LinkedIn Threads Scott:X Instagram Tiktok LinkedIn Threads Randy: X Instagram YouTube Threads

Ready to level up your career in web development? Join Wes and Scott as they discuss techniques and best practices for advancing in the field. From mastering technical skills to navigating workplace dynamics, this episode offers actionable advice to help you thrive in your career. Show Notes 00:0000:1701:10Sentry01:30Snack Pack02:0202:2208:09Hot TipsCool Treats14:0717:35Ryan Carniato TweetEpisode 577Justin Fagnani TweetEpisode 59521:1226:5527:2729:1830:0131:4735:0437:4439:0139:3239:40Energy Vampire42:1644:2946:2346:3247:40Episode 74847:5748:2248:2649:1749:31Habit Path54:09 Sick Picks Zeiss Lens Care PackWoosh Screen Cleaner Hit us up on Socials! Syntax: X Instagram Tiktok LinkedIn Threads Wes: X Instagram Tiktok LinkedIn Threads Scott:X Instagram Tiktok LinkedIn Threads Randy: X Instagram YouTube Threads

Scott and Wes dive into the cache problem, tackling user-specific data and caching security. From marketing A/B testing to content negotiation, they explore various challenges and solutions, including different URL/query parameters, edge logic, and client-side caching. Show Notes 00:0001:22YouTube02:1603:3306:2706:2906:5506:5807:1107:4508:1708:26 Content negotiation08:5409:0411:1915:01NetlifyFastlyCloudflare18:1719:52 Hit us up on Socials! Syntax: X Instagram Tiktok LinkedIn Threads Wes: X Instagram Tiktok LinkedIn Threads Scott:X Instagram Tiktok LinkedIn Threads Randy: X Instagram YouTube Threads

Which framework is best? Join Scott and Wes as they chat with Corbin Crutchley, author of the “Framework Field Guide”, diving into the world of frameworks, metaframeworks, and tips to stay up-to-date on the latest trends in web development. Show Notes 00:0000:4802:08Sentry.io02:3205:5707:2310:0011:02ng-conf11:4214:17PreactJS Signals17:5321:0223:1124:3726:4028:52TanStack Store30:3131:3532:4835:2836:2138:5239:58Framework Field GuideEduardo PrattiKevin Aguilar42:4245:4446:1748:2748:3349:5350:1953:3955:26 Sick Picks Shiki Syntax Highlighter Shameless Plugs Framework Field Guide Hit us up on Socials! Syntax: X Instagram Tiktok LinkedIn Threads Wes: X Instagram Tiktok LinkedIn Threads Scott:X Instagram Tiktok LinkedIn Threads Randy: X Instagram YouTube Threads

Scott and Wes explore UI Components, discussing functionality, styling, accessibility, and theming. From headless components to styled starters, they share valuable insights to elevate your UI game. Show Notes 00:0002:3903:1403:4604:1406:2006:3308:0909:2910:0510:1412:1013:21Svelte French Toast15:1116:1018:54React AriaBehaviorAccessibility Internationalization19:34Radix UI Primitives20:16Downshift JS21:29Tanstack Table and Forms26:0028:04Shoelace32:47React Aria Components33:00Headless UI33:04Radix UI37:12Base UI38:2340:22 React Aria Components StarterShadCNTailwind CatalystMeltUI47:5051:1053:06JS Nation55:41 Pigment CSSBase UIShoelaceBaseLayerJollyUIDraftUIRadix UIPenguinUITailwind CSSTailwindUIVerveUIDaisyUIChakraUIFlowbiteFloatingUIDownshift JSMantine59:02 Sick Picks Battery DaddyLazy SusanRechargeable BatteriesCharger Shameless Plugs Syntax on YouTube Hit us up on Socials! Syntax: X Instagram Tiktok LinkedIn Threads Wes: X Instagram Tiktok LinkedIn Threads Scott:X Instagram Tiktok LinkedIn Threads Randy: X Instagram YouTube Threads

Get stoked, jQuery 1.2 is here! Join Scott and Wes as they discuss jQuery Mobile, slicing PSD files, CSS rounded corners, CoffeeScript features, WordPress 2.3, and the rise of Skeuomorphism, shaping the landscape of web development this year. Show Notes 00:0001:16Sentry.io02:1707:3809:3410:25Slicy By MacRabbit12:3414:06CSS3Please15:1716:4818:44BatmanJS, your new favorite JavaScript superhero20:3521:15PHP 5.2.0 Release Announcement21:53 Hit us up on Socials! Syntax: X Instagram Tiktok LinkedIn Threads Wes: X Instagram Tiktok LinkedIn Threads Scott:X Instagram Tiktok LinkedIn Threads Randy: X Instagram YouTube Threads

Scott and Wes are joined by special guests Trudy MacNabb and Anne Thomas from Design Packs, diving into the nitty-gritty of Shopify design. Tune in as they dissect the pros and cons, challenges, and unveil their daily toolkit for crafting stunning Shopify websites. Show Notes 00:0000:5902:3004:0605:3407:5208:5809:2910:32Too Many Tabs11:3413:30Shopify Tools CLI15:1717:13Shopify Tools Theme Kit18:59Shopify Hydrogen20:0922:0223:5625:5629:1631:2631:5733:18‘Sherlocking’ Explained35:2136:3538:4039:1740:4642:0143:5445:1746:4747:38Syntax Episode 586 on Nomad Developing49:4851:3554:08 Sick Picks Bar of ShampooAlie Ward Ologies Podcast Shameless Plugs Design Packs Hit us up on Socials! Syntax: X Instagram Tiktok LinkedIn Threads Wes: X Instagram Tiktok LinkedIn Threads Scott:X Instagram Tiktok LinkedIn Threads Randy: X Instagram YouTube Threads

Level up your coding game -and your gains! Today, Scott and Wes weigh in on the importance of physical fitness for developers, covering motivation, diet, lifting basics, routines, and swole-inducing supplements. Show Notes 00:0001:14Sentry.io03:1003:3206:1909:1213:0613:1313:5816:4717:48StrongliftsStartingStrength25:47Rogue Stall Bar37:1440:53MacroFactorApp46:3747:42BulkSupplements.com Creatine51:23 Sick Picks Wikday Pull Up BandsBooty Bands Hit us up on Socials! Syntax: X Instagram Tiktok LinkedIn Threads Wes: X Instagram Tiktok LinkedIn Threads Scott:X Instagram Tiktok LinkedIn Threads Randy: X Instagram YouTube Threads

Join Wes and Scott for a hasty episode of Syntax as they unpack the power of middleware for developers, covering caching, authentication, A/B testing, error handling, and user redirection in a quick, punchy rundown to supercharge your backend skills! Show Notes 00:0000:41Syntax on YouTube01:2805:0405:1007:4408:2809:4110:0010:4611:5912:2313:0215:0818:0721:52 NextJS Middleware23:35Sveltekit Hooks24:31Fastify ExpressFastify Middle25:28 Hit us up on Socials! Syntax: X Instagram Tiktok LinkedIn Threads Wes: X Instagram Tiktok LinkedIn Threads Scott:X Instagram Tiktok LinkedIn Threads Randy: X Instagram YouTube Threads

Deploy your own tech stack: Wes and Scott are joined by Kubernetes expert David Flanagan to be schooled on how Kubernetes, Docker and even WASM containers work. Show Notes 00:0001:5504:5711:4912:2515:37etcd16:4318:4622:1124:06DockerContainerd25:28OCI Open Container Initiative26:43WASM WebAssembly29:3131:1132:1233:3636:5739:22Fermyon Spin39:5642:27 Turing Pi 2Daniel MangumUniversal Blue46:40Kubernetes.ioRawkode YouTubeKubesimplifyLearnk8s48:51CDK for TerraformGraalVM55:19 Sick Picks Golem.cloudRestate.dev Shameless Plugs Rawkode YouTube Hit us up on Socials! Syntax: X Instagram Tiktok LinkedIn Threads Wes: X Instagram Tiktok LinkedIn Threads Scott:X Instagram Tiktok LinkedIn Threads Randy: X Instagram YouTube Threads

Wes and Scott dive deep into the world of JavaScript toolchains, exploring everything from linters and compilers to transpilers and formatters. Tune in as they shed light on cutting-edge technologies like Biome, UnJS, and Ezno that are shaping the future for developers. Show Notes 00:0001:37YouTube02:0904:0206:1507:1607:2111:2913:3016:1816:4617:5920:2620:47Biome28:27Oxc33:01Deno34:13ESBuild34:37Rolldown38:34Ezno40:24UnJS41:45Lightning CSS42:3143:26 Sick Picks Shinobi-Geddon: The 1980s Ninja CrazeBachans Japanese Barbecue Sauce Shameless Plugs Syntax on YouTube Hit us up on Socials! Syntax: X Instagram Tiktok LinkedIn Threads Wes: X Instagram Tiktok LinkedIn Threads Scott:X Instagram Tiktok LinkedIn Threads Randy: X Instagram YouTube Threads

Join Scott and CJ on a rapid-fire journey through Docker. From unraveling containerization to practical advice on incorporating Docker into your workflow, this quick-paced episode has everything you need to navigate the world of container technology. Show Notes 00:0001:19Sentry.io02:2002:57ContainerizationOS-level Virtualization04:42PodmanContainerdBuildahLXD05:2608:19Download Docker DesktopStart With DocsDocker 10109:14Docker SentryDocker RegistryDocker Layers16:46SvelteKit Dockerfile Node.js / Express CLI Runner Twitchbot Development PHP / Mongodb Dockerfile21:37Docker Compose22:50 Coding Garden Example Hit us up on Socials! Syntax: X Instagram Tiktok LinkedIn Threads Wes: X Instagram Tiktok LinkedIn Threads Scott:X Instagram Tiktok LinkedIn Threads CJ: X Instagram Tiktok TwitchTV YouTube Randy: X Instagram YouTube Threads

Wes and Scott welcome Cameron McEfee, a seasoned creative director whose journey spans GitHub, Sentry.io, and the innovative realm of JavaScript plugins with his creation, GuideGuide. Cameron explores plugin building, iterating on the iconic Octocat for GitHub, and shedding light on the multifaceted roles of a creative director. Show Notes 00:0001:0603:0009:4712:3215:35GitHub Octodex17:1821:07Sentry.io25:0827:04GuideGuideMoo Tokenizer/Lexer33:1336:1040:4643:3744:44GoodHertz50:2252:44 Sick Picks Ember MugWaterparks SpotifyExecute Program Shameless Plugs GuideGuide 50% off Hit us up on Socials! Syntax: X Instagram Tiktok LinkedIn Threads Wes: X Instagram Tiktok LinkedIn Threads Scott:X Instagram Tiktok LinkedIn Threads Randy: X Instagram YouTube Threads

Scott and CJ dive into a potluck of developer queries, from their favorite tech reads to essential web dev fundamentals. Tune in as they dish out expert advice on migrating React projects to TypeScript, crafting precise timers for countdown apps, and navigating the world of free-tier plans. Show Notes 00:0001:20Sentry.io02:16Whatever you think, think the oppositeIt’s not how good you are, it’s how good you want to beCrucial Conversations@benvinegar04:58Command Line Power User08:39 Chris Coyer’s Post11:5120:3825:1931:46CoolifySyntax 730: Own Your Own Paas35:59semver.orgnpmjs TypeScript on Semantic Versioning40:1447:59unjs.io52:12 Sick Picks Ellenos YogurtFlat Iron Pepper Shameless Plugs Syntax.fm YouTube Hit us up on Socials! Syntax: X Instagram Tiktok LinkedIn Threads Wes: X Instagram Tiktok LinkedIn Threads Scott:X Instagram Tiktok LinkedIn Threads Randy: X Instagram YouTube Threads

Wes and Scott tackle TypeScript trivia, from combining string literal types to unraveling the mystery of d.ts files. Join them as they challenge each other on conditional types, interfaces, triple-slash directives, and TypeScript records. Show Notes 00:00TypeScript01:05Sentry.io03:20 Template Literal Types06:34TypeScript Generics08:12 TypeScript Conditional Types09:58 Stricter Generators14:09 Module .d.ts16:25Types vs Interfaces19:15 Tripple-Slash Directives20:52Utility Types Hit us up on Socials! Syntax: X Instagram Tiktok LinkedIn Threads Wes: X Instagram Tiktok LinkedIn Threads Scott:X Instagram Tiktok LinkedIn Threads Randy: X Instagram YouTube Threads

Scott and Wes are joined by special guest Xenova to explore local AI models in JavaScript. From Hugging Face to Transformers.js and practical applications like real-time speech recognition and object detection, this episode dives deep into the world of machine learning. Show Notes 00:0000:41Sentry.io01:0502:0803:2906:16SponsorBlock09:0410:09Onnx.aiHugging Face Optimum14:1916:1517:3818:35Doodle Dash21:0924:4428:3234:2335:5538:5543:5444:3246:30 Semantic Image Search ClientReal-Time Object DetectionBackground Removal Tool48:3351:2652:0856:10Web LLM57:2259:3901:06:4301:09:3001:10:34Text Clustering01:13:4901:17:35 Sick Picks WebGPU Shameless Plugs Xenova on X Hit us up on Socials! Syntax: X Instagram Tiktok LinkedIn Threads Wes: X Instagram Tiktok LinkedIn Threads Scott:X Instagram Tiktok LinkedIn Threads Randy: X Instagram YouTube Threads

Join Wes and Scott as they explore LoFi (local first) web development, delving into CRDT, Websockets, IndexedDB, SQLite, and more. Discover when Local-First shines and when it’s better to steer clear in this episode packed with practical insights. Show Notes 00:0003:18Sentry.io04:08localfirst.dev05:0205:2906:4807:5608:5009:3509:3709:45Actual Budget Finance AppInk & Switch13:0114:0714:30Wikipedia Definition James Long dotJS 2019 dotconfrences17:4819:3620:1721:2322:1622:24Replicache24:48YJS25:06Electric SQL25:5131:2632:3435:19Habit Path by Scott Tolinski37:1838:2038:47Triplit Fullstack DatabaseElectric SQLEvolu40:46Local-First Web DevelopmentLocal-First Lo.fi YouTubeLocal-First Ink & SwitchLocal-First RedditSyntax GitHub Local-First43:30 Sick Picks Wes: Dresscode.dev Scott: Monarch Money Hit us up on Socials! Syntax: X Instagram Tiktok LinkedIn Threads Wes: X Instagram Tiktok LinkedIn Threads Scott:X Instagram Tiktok LinkedIn Threads Randy: X Instagram YouTube Threads

Process is important. This show is dedicated to examples of non-developer tasks that can be improved by coding scripts. Join Scott and Wes for a deep dive into automation magic. Show Notes 00:0002:11Sentry.io.03:02FFmpegFFprobe06:35 Syntax Markdown Validation09:21 Episode 456 Transcript12:1913:31YouTube Find & Replace - work in progress15:0316:1716:5417:4519:25Script Kit20:19ZXDax22:05 Hit us up on Socials! Syntax: X Instagram Tiktok LinkedIn Threads Wes: X Instagram Tiktok LinkedIn Threads Scott:X Instagram Tiktok LinkedIn Threads Randy: X Instagram YouTube Threads