CSS :has() is out in all browsers and Wes and Scott have got the top 10 reasons you should start using :has() now. Show Notes   00:25 Welcome  02:28 Syntax Brought to you by Sentry  03:02 Overview of :has  07:09 The anywhere selector  09:41 Previous element  12:59 Layout targetting  15:45 Form validation styling  17:51 All siblings  21:07 Quantity queries  24:19 Empty children  24:56 Nested dropdown navs  26:36 Attribute matching   Hit us up on Socials!  Syntax: X Instagram Tiktok LinkedIn Threads  Wes: X Instagram Tiktok LinkedIn Threads  Scott: X Instagram Tiktok LinkedIn Threads

714: CSS :has() in Every Browser! 10 Uses

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.

Technology

Tech News

Podcasting

Gadgets

Software How-To

News

Join Scott and Wes as they delve into the fascinating realm of Biome.JS alongside Emanuele Stoppa, the mastermind behind it all. Why is it written in Rust? Why are other tools so slow? Could Biome be the ultimate successor to ESLint or Prettier? Grab a seat at the table and find out! Show Notes   00:00 Welcome to Syntax!  00:10 Brought to you by Sentry.io.  01:49 Who is Emanuele Stoppa and what is Biome?  03:18 What happened to Rome?  05:49 Who’s paying for Biome to be developed?  07:28 How many people are working on Biome?  09:24 Why do we even need Biome?  11:38 Why are other tools so slow?  12:55 Cost of compute.  14:01 The cache management.  14:30 Why was the decision made to move to Rust?  16:35 The bigger the company, the pricier the compute.  19:49 How to get started with Biome.  23:08 Will Biome offer more features than Prettier?  24:12 Language support.  26:02 A language parser for every language?  27:45 Will plugins need to be written in Rust?  GritQL GitHub.  31:25 Ezno, TypeScript Compiler.  33:13 Will we ever see a new TypeScript type-checker?  35:38 What are your thoughts on the types proposal?  Proposal Type Annotations.  38:03 What does your average day look like?  41:10 What is your role at Astro?  41:46 What other languages do you know?  43:22 Biome VCS.  45:14 GitHub action setup.  47:04 Supper Club Questions.  47:09 What text editor, theme and font are you using?  48:26 What do you do to stay up to date?  48:54 Sick Picks & Shameless Plugs.   Sick Picks   Emanuele: Ripley IMDB, Netflix.   Shameless Plugs   Emanuele: Astro, BiomeJS.   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

764: Biome JS with Emanuele Stoppa

Web scraping 101! Dive into the world of web scraping with Scott and Wes as they explore everything from tooling setup and navigating protected routes to effective data management. In this Tasty Treat episode, you’ll gain invaluable insights and techniques to scrape (almost) any website with ease. Show Notes   00:00 Welcome to Syntax!  03:13 Brought to you by Sentry.io.  05:00 What is scraping?  Socialblade.  08:01 Examples of past scrapers.  Canadian Tire.  10:06 Cloud app downloader.  16:13 Other use cases.  16:58 Scraping 101.  17:28 Client Side.  19:08 Private API.  Proxyman.  22:40 Server rendered.  23:27 Initial state.  24:57 What format is the data in?  Google Puppeteer Extension.  27:08 Working with the DOM.  27:12 Linkedom npm package.  29:02  querySelector everything.  31:28 How to find the elements without classes.  34:08 Use XPath selectors for select by word.  34:53 Make them as flexible as you can. Classes change!  35:10 AI is good at this!  36:26 File downloading.  38:20 Working with protected routes.  Proxyman.  40:41 Programatically retrieve authentication keys because they are short-lived.  Fetch Cookie.  43:20 Deal-breakers.  Mechanical Turk.  44:58 What happened with Amazon?   Uniqlo Self-Checkout  46:42 Wes’ portable refrigerator utopia.  47:25 Sick Picks & Shameless Plugs.   Sick Picks   Scott: KeyboardCleanTool.  Wes: Yabai.   Shameless Plugs   Scott: 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

763: Web Scraping + Reverse Engineering APIs

 Scott and Wes discuss the delicate balance of what’s acceptable to borrow or be inspired by in web development and what crosses into territory that’s off-limits. Tune in as they share personal experiences, discuss where to find ethical inspiration, and offer tips on how to effectively capture and utilize it. Show Notes   00:00 Welcome to Syntax!  01:57 Brought to you by Sentry.io.  02:26 What is okay to steal?   02:57 Color palettes.  03:14 Font stacks.  06:26 Type scales.   Warp’s CSS Gradient Border.  Sentry’s Date Picker.    08:52 General layout patterns.  10:39 General vibes.    11:20 What is NOT okay to steal?   11:26 Whole site designs.  13:32 Taking too many things from ‘what to steal’ list.  16:30 Text copy.   Wes’ Parity Purchasing Power.      18:48 What we’ve had stolen + how it feels.  21:45 Where to find inspiration.   21:56 Code inspiration.   CSS Scan Buttons.   CSS Scan Box Shadows.  Codrops.  CodePen    25:18 Design inspiration.   Bentro Grids.  Dribble.  Site Inspire.  SaaS Landing Pages.  One Page Love.  Type Wolf.  Mobbin.  Syntax Newsletter.  Hoverstat.es.  Internet Gems.    32:48 UX inspiration.   Good UI.  The Component Gallery.  Open UI.  Nicely Done.      35:25 How to capture inspiration.   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

762: What to Steal. Finding Inspiration in Web Development

 Scott and Wes dive into Cloudflare’s Analytics Engine and Workers with special guest Ben Vinegar, Syntax’s General Manager. Tune in as they explore Clickhouse, data tracking, infrastructure costs, and transitioning from software products to managing a podcast. Show Notes   00:00 Welcome to Syntax!  01:17 Who is Ben Vinegar?  Episode 434 with Ben.  02:21 Brought to you by Sentry.io.  04:00 Cloudflare analytics engine.  Counterscale.dev.  Episode 634 with Armin.  09:08 What is clickhouse?  11:01 Can Clickhouse be used for things outside of analytics tracking?  13:46 What kind of events are you able to track?  15:00 How do you assign values to track?   Counterscale Schema.  18:40 Data type limitations.  19:55 The troubles with sampling data.  23:57 Sample intervals.  24:24 Pricing for these services.  25:34 How it actually runs.  27:31 Infrastructure costs and pricing models.  30:19 Running production apps in Cloudflare.  31:49 Cloudflare and HonoJS.  32:47 One year with Sentry and Ben’s role with Syntax.  Episode 600 with David.  39:33 How does it feel going from a software project to a media project?  Syntax Team.  43:00 How do you sell Syntax to Sentry?  48:37 Sick Picks & Shameless Plugs   Sick Picks   Ben: Randy’s YouTube, Boom.   Shameless Plugs   Ben: Counterscale.dev   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

761: Cloudflare Analytics Engine, Workers + more with Ben Vinegar

Join Scott and Wes as they dish out the juiciest VSCode secrets for coding like a boss (or a Tolinski)! From speedy navigation to must-have extensions and the sickest themes, get ready to level up your coding game. Show Notes   00:00 Welcome to Syntax!  00:47 Brought to you by Sentry.io.  01:44 A recording bug.  03:18 VSCode versions.  05:59 Tabs or no tabs.  10:32 Navigation tips.  11:35 Mouse and trackpad input.  13:43 Move, select and expand by  19:07 Interface tips.  19:17 Sidebars.  24:23 Sticky headers.  26:21 Activity bar.  30:30 Show or hide?  31:35 Profiles.  32:43 Keyboard Shortcuts.  32:49 Renaming.  34:32 Extensions.   34:45  Text pastry.  36:43  Better comments.  39:03  Auto rename tag.  40:02  Change case.  40:25  Permute lines.  41:26  File utils.  43:20  Sort JSON objects.  43:50  SQLite viewer.  44:29  Spell checker.  45:42  APC.    49:19 Themes.   Syntax Theme  53:05 Final tricks.   Log Wrapper  57:44 What about the AI stuff?  01:00:10 Sick Picks & Shameless Plugs.   Sick Picks   Scott: Flicker Free Ultra Definition Phillips Bulbs.  Wes: Clear Shoe Box Organizers.   Shameless Plugs   Scott: Syntax Newsletter.   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

714: CSS :has() in Every Browser! 10 Uses

Download our free app to listen on your phone