Should You Use Vue RENDERLESS COMPONENTS?

RESOURCES

Get early access to videos, exclusive content, interactive code challenges, and more.

follow me on twitter:

#vuejs #vue #javascript #webdev

00:00 Introduction
00:29 Creating a Renderless Component
00:52 Scoped Slots
02:21 Demo!
02:36 Thanks Storyblok!
03:14 Composables vs Renderless

[davidsekielyk]

I have the following criteria:
When only the logic of a component is reused in different places I transform it into a composable (for example adding a product to the cart can be used in the product cards and in the side cart).
When the same component has the same logic as several components but only the content varies in positions throughout the application I use renderless components (for example if you have html variations of the add to cart button in different ways of displaying the product card).

[ignatiusnevandefie]

To me, I use renderless components when I am using Vue with the script tag on a pure static site (or a site that does not support node runtime build tools). They make it easy to add logic directly in the UI without having to go back and forth in the JS files that is located elsewhere - a.k.a declarative template logic. Makes it much quicker to prototype new features as well.

[shareefhassan]

I really love the style of you videos, short, concise and informative .. can't wait to see more.
can you make a video about the render function?

[brainbarett]

You didn't show what refactoring the to-do to a composable looks like 💀

[Andrewsylar]

Can you do a video talking about typescript with vue and some good practices to follow with large scale applications?

[danielb]

Thank you for mentioning Headless UI, I had no idea it existed up until now!

[antifa_communist]

You can also put the v-for on the slot instead and it will work the same and pass your array as a prop

[alanoliveira]

really impressive!
can't wait to see more

[tobychidi]

Now we just need a Vue guru to build an amazing UI library for us. Like Mantine I think Vue can give better results

[ryahpalma]

Laravel Splade made renderless components your only way to use splade components with vue logic, but i liked it.

[ZyncInteractive]

Owwh no intro music. But great video none the less

[akgul]

excellent content every video 🚀

but this time, video too fast to understand. a little complicated concept. need to watch one more time.

[נתניאלסלם-לס]

It's not really that confusing it just looks like that, because of all the many buttons.

[ekzao]

tNice tutorialngs simple, straight to the point and well organized.