In this episode of Syntax, Wes and Scott talk about what headless components are, the why and when to use headless components, and how to best implement them.

Show Notes

• 00:07 Welcome
• 02:33 Tailwind Connect
• Tailwind Connect 2023 | Tailwind CSS Live Event
• 04:37 Headless component overview
• Downshift
• Headless UI
• 06:57 A country dropdown component
• 12:52 Possibly like Svelte actions?
• 18:46 What do headless components provide?
• 19:13 Examples of headless component projects
• Microsoft Edge Demo
• 24:24 How does this compare to web components?
• Tanstack Table
• Tanstack Virtual
• 26:29 Checking out Shoelace
• Shoelace
• 28:42 Figma announcements
• What’s New in Figma
• 31:21 What does headless mean?
• 36:24 SIIIIICK ××× PIIIICKS ×××
• 41:20 AI Voices

××× SIIIIICK ××× PIIIICKS ×××

• Scott: Hacker News Recap /Hacker News Recap on Apple Podcasts
• Wes: Calipers

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