Syntax - Tasty Web Development Treats

What are Headless Components?

Share this episode
Anyone with this link can open it.
Share Link
Start at 0:00

This episode isn’t summarized yet

Create a free account and summarize it. In a few minutes you’ll have the key takeaways and a section-by-section summary.

Show notes

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

Couldn't load the audio. A blocker may be stopping the show's tracking links. Open the file