Movatterモバイル変換


[0]ホーム

URL:


Skip to content
DEV Community
Log in Create account

DEV Community

Cover image for Radix for Vue is finally available!
Michał Kuncio
Michał Kuncio

Posted on • Originally published atmichalkuncio.com

     

Radix for Vue is finally available!

What is Radix UI?

Radix UI is a headless and unstyled component library that gives us great flexibility and top-tier accessibility out of the box. Opinionated UI libraries are great and provide quick development but sometimes it's hard to restyle the components or tailor them to specific use cases. InRadix UI, you are building your components out of highly accessible primitives so you have full control over the implementation.

Why would I use it?

Someone can say:"So if I still have to build some higher order component on top of those primitives and style them, what's the benefit of it?"

Let's compare the advantages and disadvantages of building components from scratch vs using an opinionated UI library:

Building components from scratch

advantagesdisadvantages
full control over component logicaccessibility is hard
easier to apply fully custom stylesdevelopment takes longer
no external dependencyfor complex UI components you have to create good docs for other devs

Using an opinionated UI library

advantagesdisadvantages
fast developmentno full flexibility
accessibility out of the boxyou can hit the limitations of the package
docs are already thereharder to restyle
fewer bugs because it's maintained by many peopleexternal dependency

WhatRadix UI is trying to do is fit kind of in the middle of those scenarios. You have to build your own components, so you have to take care of styling and putting all the pieces together but because you are using those primitives, you don't have to worry about accessiblity and you have some basic component logic provided to you. Sadly,Radix UI was only available for React, but not anymore! 🥳

Now, theVue version is available!

Thanks to the outstanding work of contributors,Radix Vue is finally available! 🥳 It's one of the first beta releases, so don't let a small number of GitHub stars discourage you! It's not yet 100% finished but you can track the progress of portinghere.

Porting status

Summary

I'm really glad thatRadix UI is being ported from React ecosystem. It's a great way to build your custom components with a little help from Radix primitives. By doing that you don't have to fear some potential limitations or struggle with overriding the default styles. Huge kudos toRadix Vue team for great work!

Top comments(0)

Subscribe
pic
Create template

Templates let you quickly answer FAQs or store snippets for re-use.

Dismiss

Are you sure you want to hide this comment? It will become hidden in your post, but will still be visible via the comment'spermalink.

For further actions, you may consider blocking this person and/orreporting abuse

Senior frontend engineer, Vue.js enthusiast 💚 I'm writing about modern webdev at https://michalkuncio.com. You can also check my twitter account: https://twitter.com/michalkuncio
  • Joined

More fromMichał Kuncio

DEV Community

We're a place where coders share, stay up-to-date and grow their careers.

Log in Create account

[8]ページ先頭

©2009-2025 Movatter.jp