The Best Material Design Vue Framework

»» Sign up for the next #DesignInTech briefing.

Wow there’s lots of options out there if you want to play with a Material-y world and Vue. I’ve been spending the last two days playing around with a bunch of them, and I even got a Tweet back from the creator of Vue (how cool!).

So far I’ve tried out:

1. Material Components Vue via Mats Pfeiffer
2. MDC Integration via Stasson
3. Vue Material via Marcos Moura
4. Vuetify via Veoci

They are listed above in order of increasing complexity and level of completeness. Easiest (=1) to hardest (=4). Which one is the best? Uuuuuh … I’ll have to use my favorite HR answer: it depends.

• Material Components Vue is one of the closest approach to the developer reference work by Google and it’s using the “simple approach” which I don’t think is really simple at all for anyone to do, so I’m glad that Mats did it for us. It has the smallest number of components to choose from as it’s a little behind the main MDC’s development velocity.
• MDC Integration is also close to the developer reference work being created by the actual Google team. It’s cooked a little differently so it’s likely slightly easier to stay in step with the latest coming out of Google’s team. It has a sufficient number of components to play around with and get a feel for the pieces.

On the other hand, if you want to take advantage of SSR (Server Side Rendering) you’re going to want to use Nuxt which is better integrated with the two more complex options.

• Vue Material’s got a lot of great documentation and a full array of components. I tried out most of the examples and it all worked the way I expected it to.
• Vuetify does everything you’d ever want to do — so as a result it does lots of things that you might never want to do. If you want to go all the way, it’s definitely the way to go.

Which one am I going to use? I dunno but I am thinking I might go down door number 2 to start. —JM