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

What are Headless Components?

Syntax - Tasty Web Development Treats