Introducing Headless UI: A Vue Component Framework From Tailwind CSS

[@ChumX100]

Wow, I'm really excited for this! Sounds like a really good idea. Together with Tailwind, it'll make creating custom components a breeze.

[@ProgramWithErik]

Fingers crossed!I

[@ianmadrigalmonkey1979]

This is totally awesome! I prefer something that works (functionality) and just focus on the style that is need for the brand.

[@ProgramWithErik]

Totally agree!

[@shadeersadikeen1052]

headless ui not working with nuxt 3.can you help with that ?

[@matthewbeardsley7004]

Erik, have you done a comparison video on all the different UI Component Libraries, CSS Libraries etc. and perhaps give your 2c on some scenarios; where a beginner should start, what an enterprise application with a large team might look at or the goal of rapid prototyping. I've just started a project using Vuetify and previously used Buefy, but I've looked at Ant Design, Bootstrap, Element etc!! For Vuetify, my goal was speed.

[@ProgramWithErik]

I'll make a note! That's a good idea for a video

[@greghawthorne8949]

looking into the Composition API, has anyone tried using this in Nuxt?

[@abdulazeezolanrewaju843]

Thank you very much sir!... How do you see chakrauivue

[@ProgramWithErik]

I'll look into it~!

[@MatiasVerdier]

I think the majority of people in the comments are not understanding what a headless component is and what is the use case, this is not like Vuetensils, those components are just regular components without styles. The main difference of headless components with regular components is that the author of the library is not imposing a specific markup or classes in order for the components to work, it is just the behavior and you can choose how to compose the different parts, you can choose to mix other components or HTML elements and of course, add your own styles. I would recommend reading the post below from Adam Wathan to understand what this is all about. The article talks about renderless components, a concept that is used internally to develop this kind of library adamwathan.me/renderless-components-in-vuejs/

[@ProgramWithErik]

Thanks for clarifying it!

[@ravense8337]

Does anyone know what vscode theme that is?

[@joshdempsey7184]

Want to know this too. +Program With Erik

[@ProgramWithErik]

Synthwave 84!

[@joshdempsey7184]

@@ProgramWithErik thanks for the reply 😁

[@memesnotmine892]

Are threre any css framework like bootstrap-vue ready for vue 3?

[@ProgramWithErik]

Not that I know of

[@heroe1486]

@@ProgramWithErik Ant design of Vue has a beta compatible with vue3 2x.antdv.com/docs/vue/introduce/ Edit : just came across PrimeVue which also have support for vue3, gonna try it primefaces.org/primevue/showcase/#/

[@should_be_username]

Hi Eric I'm fresh in Vue. Your channel is helping me more explore Vuejs, thanks!

[@ProgramWithErik]

Great to hear!

[@Mac44598]

Erik which VS code theme you're using?? it looks smooth and clean :)

[@ProgramWithErik]

Synthwave 84

[@dyunior]

Thanks Erik with "ch". :D will check this out.

[@ProgramWithErik]

Thanks!

[@bastachemilasciregis]

For small and fast project, I still prefer Buefy. I will look into these for more custom projects

[@ProgramWithErik]

I should do another video on buefy

[@pigeonnnn]

This is perfect for me

[@ProgramWithErik]

Nice

[@FaradayAcademy]

Seems like an alternative to Vuetensils.

[@ProgramWithErik]

I have not heard of that, but I should! Intersting...

[@heroe1486]

Is vuetensils yet compatible with vue3 ?

[@patlecat]

@Erik Can you pls do a review and tutorial of Tailwind UI?

[@ProgramWithErik]

That's a good idea!

[@shaa6765]

when a new video of Erik comes out I always like the video and only then watch it :)

[@ProgramWithErik]

Thanks!

[@skgupta563]

Sir can you do video on buefy? It's a non js CSS library

[@ProgramWithErik]

I think I did at one point...

[@surendrasawant9781]

Make a video on electron performance measures

[@ProgramWithErik]

Will do!

[@surendrasawant9781]

@@ProgramWithErik your channel is awesome keep it up dude

[@JohnSmith-rn3vl]

I turn off add blocker by "ctrl + shift + n" for a new private window to watch your videos. Nuff said I think.

[@dyunior]

try Brave browser

[@ProgramWithErik]

No problem!

[@maxdevgenius5469]

waouh cool tuto

[@ProgramWithErik]

Thanks

[@kaibe5241]

I get what they're doing here, and I decided to check it out, but... I don't think I'll ever use it, for one key reason - code size. The popover alone is like 700+ lines of code. And I totally understand why - they're building re-usable components for all use-cases. But I can write a purpose-built popover in less than 50 lines of code. So, it's not for me. That said, I think it'll be really useful for spiking out ideas/user experiences.

[@jeno427]

Vuetensils?

[@ProgramWithErik]

I need to check out Vuetensills

[@adityadimasptra]

More unit testing tutorial jest

[@ProgramWithErik]

I need to talk to someone about that

[@sperolarres7774]

Angular CDK is the same idea

[@ProgramWithErik]

Interesting,

[@emmyleke7049]

so this is like a car with the engine fitted and all. You can drive the car but it is ugly. It is up to you to decide what you want the car to loom like.

[@ProgramWithErik]

True

[@truthteachers]

Honestly Erik, your course start abruptly from nowhere. Its so hopeless to newbies.

[@PriyankBolia]

What? for just a menuitem, you created a video, please waste time on tried and tested things only. there are hundreds of technologies to learn.

[@PriyankBolia]

Can't understand why so many courses for programmers on tailwind, I can understand for designers its great, but its a complete time wastage for somebody who is a programmer, and deals with only functionality. I would personally stick with bootstrap class="dropdown-menu" and once the app is complete ask some designer to provide custom classes, may be tail wind, but would not start directly with styling UI, rather focus on the functionality only.

[@ProgramWithErik]

The library only has a Menu component right now. There is nothing else to show unfortuantely :(