meta_pixel
Tapesearch Logo
Log in
Syntax - Tasty Web Development Treats

What are Headless Components?

Syntax - Tasty Web Development Treats

Wes Bos

Tech News, News, Technology

4.91.2K Ratings

🗓️ 5 July 2023

⏱️ 48 minutes

🧾️ Download transcript

Summary

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

Transcript

Click on a timestamp to play from that location

0:00.0

You're listening to syntax the podcast with the tastiest web

0:04.7

development treats out there strap yourself in and get ready.

0:07.9

Here is Scott Tillinsky and West boss.

0:10.6

Welcome to syntax the podcast with the tastiest web

0:14.0

development treats. Stay we're talking about headless components

0:17.6

or headless UI. What is it? Why would you ever want

0:21.5

a headless component? My mind was blown. I was talking to

0:25.6

Tanner Linsley. I always goof up his last name.

0:29.8

I reacted on about a month ago and he was talking to me about his

0:34.9

react table or not even react table his table tan stack table

0:39.3

which is like an awesome component for rendering out tables and

0:44.5

sorting and searching and all that kind of stuff.

0:48.4

And he's like the whole thing is headless. I was like how do you build?

0:51.9

Mm-hmm. Like headless means that there's there's literally no markup.

0:55.4

I'm like how do you build a table without markup and then I was like oh yeah

0:59.5

like I understand I understood what it was but like I it blew my mind that

1:03.3

he was building a table as first time I had seen that. So we're going to go through today

1:07.2

and talk about what headless components are why they are awesome

1:11.4

for you the developer why they are awesome for accessibility

1:14.6

and all that good stuff. How are you doing today Scott?

1:17.0

Hey I'm doing good. I am just chilling out here. We had a crazy

1:21.1

hailstorm last night. I was just reading some article this morning about

...

Please login to see the full transcript.

Disclaimer: The podcast and artwork embedded on this page are from Wes Bos, and are the property of its owner and not affiliated with or endorsed by Tapesearch.

Generated transcripts are the property of Wes Bos and are distributed freely under the Fair Use doctrine. Transcripts generated by Tapesearch are not guaranteed to be accurate.

Copyright © Tapesearch 2026.