Tailwind vs MUI vs Quasar vs Vuetify - My Choice For My Next Project?

Поделиться
HTML-код
  • Опубликовано: 8 сен 2024

Комментарии • 89

  • @ProgramWithErik
    @ProgramWithErik  Год назад +8

    Do you use component frameworks?

    • @johnnydriesen7575
      @johnnydriesen7575 Год назад +3

      Yes, Erik, I use component frameworks. Mainly Quasar & Vuetify ...

    • @yuvoria.official
      @yuvoria.official Год назад +5

      Quasar

    • @cwinter90
      @cwinter90 Год назад +1

      We use Vuetify where I work. Kinda rough with Vuetify's v3 lacking features but hey, at least it is out now lol. Some day we may be able to upgrade to Vue 3 lol.I use Quasar and Vue 3 on my personal projects.
      I've looked at and tried tailwind in the past and... My god the class names look like a mess. You can make prebuilt combinations of their classes to ease that a bit but their documentation actually said (at the time, no idea if it still does) you shouldn't do that... As devs we spend far more time reading & maintaining code rather than writing it. I personally don't like it at all. I know some love it though.

    • @couts87
      @couts87 Год назад +1

      Quasar!

    • @dickson710
      @dickson710 Год назад +3

      yes, quasar for 4 enterprise projects

  • @danieldilly
    @danieldilly Год назад +12

    Quasar is great. I highly recommend it. I used Vuetify before that but I prefer Quasar after having used both for over a year each.

  • @takundahwaire2539
    @takundahwaire2539 Год назад +16

    Quasar is the best Vue Component Library out there !

  • @thegingerpenguin
    @thegingerpenguin Год назад +24

    Why aren't more people talking about primevue? I'm interested in using it for my next project but there isn't much hype about it and I'm not sure why. I have done projects with vuetify and quasar, and have had great experiences with both, but especially quasar 😊

  • @dev-am1303
    @dev-am1303 Год назад +6

    after learning react js, I'm back at Nuxt3 js and I'm 100% going to use vuetify version 3 for my 2 projects.
    I'm so thrilled cause of it.
    thank you erik for making such great contents around vuejs.
    I have learned a ton so far. so thank you again for being a great mentor.

    • @ProgramWithErik
      @ProgramWithErik  Год назад +2

      You are welcome!

    • @armanamini1450
      @armanamini1450 Год назад +2

      Vuetify 3 is ASS. Even the second version was nowhere near MUI but they really dropped the ball with v3. It's been months it's out and still not all the components are transferred from v2. Plus the docs are horribly unfinished. You just have to guess what each prop is supposed to do. Not to mention the final rendered DOM is a huge mess. I'd say explore framework agnostic component libraries and mix them with whatever CSS framework you're comfortable with.

    • @teippiviritykset
      @teippiviritykset Год назад

      better just jump straight to the full packet: Quasar

  • @chambaderaphael8946
    @chambaderaphael8946 Год назад +5

    I went from vuetify to quasar, and for now it's no regrets, lighter, more responsive. may be a little less aesthetic, but for management applications it is not the most important

  • @mon_codes
    @mon_codes Год назад +11

    Quasar is the best vue framework I've ever used.

  • @ifithegr8
    @ifithegr8 Год назад +5

    After working with React MUI, Vuetify, Blazor, MudBlazor and eversince I worked in Quasar I never went with anything else.

  • @erics2133
    @erics2133 Год назад +1

    The accessibility is my main reason for using component libraries, with best practices being in second place. These are two things that I'm either not good at or haven't worked on. I know for a fact that I don't think the same way most other people do.

  • @JohnDoe4321
    @JohnDoe4321 Год назад +18

    With a component framework...
    Good news: Your app will have a well designed consistent UI.
    Bad news: Your app will look just like a thousand other apps.
    If you do all your own CSS and components...
    Good news: Your app will have exactly the UI that *you* want.
    Bad news: Everybody else will think your app is weird and fugly.

  • @AdarshMadrecha
    @AdarshMadrecha Год назад +2

    We use Quasar. (About 50,000 monthly active users, of the web app)

    • @cristiandrift
      @cristiandrift 9 месяцев назад

      Do you still use quasar, and is it still good?

  • @leftblank5315
    @leftblank5315 Год назад +5

    tailwind + vite/vue or tailwind + nuxt for bigger projects. Have 2 apps in prod running vuetify 2; will be refactoring to remove the dependency on vuetify. Not only it's the crappy material ui, but their release of v3 took forever.

    • @Kingside88
      @Kingside88 Год назад

      Vuetify 2 was great but as of today I would stop using it. The reason you mentioned: The development is to slow. Instead of tailwind, you could take a look on UnoCSS. Its the same as Tailwind but faster

  • @johnnydriesen7575
    @johnnydriesen7575 Год назад +1

    Thanks for this vid !
    Gonna be a great help for a lot of devs, even "seniors" ...

  • @Bloboxo
    @Bloboxo Год назад

    Vuetify also has a treeshaking functionnality, which can be activated automatically. So this an argument to remove from being opposite with Qasar. About integration with mobile, it is also possible with vuetify, you only need to install the dependancy Cordova or Capacitor, which is not a hassle by itself. I am not sponsored in any way by Vuetify, I am here just to illustrate that some 'major differences' between frameworks might not be as huge as some web articles might say (probably sponsored by the way). Your video is great by the way. Thanks Erik!

  • @hanes2
    @hanes2 Год назад +6

    My pick was PrimeFaces. (PrimeVue)

  • @kwarnkham3836
    @kwarnkham3836 Год назад +1

    Quasar is my favorite.
    Work for most cases.
    Quick to deliver a product.

  • @davidludlow934
    @davidludlow934 Год назад +1

    I am surprized you didn't mention how much component libraries can complicate the build process. They can make build times much slower (or alternatively make page loads slower, depending on how you ingest your component library). I have a couple projects that my team refuses to update, because we used an old component library and it would be too much effort to figure out how to update the build chain in a way to use newer component libraries, without sacrificing page load times. (we have one project using Vuetify 2 and one using an ancient version of Bootstrap)

  • @AllAroundFlight
    @AllAroundFlight Год назад +2

    I understand that this clarifies a lot about the pros and cons. I am fairly new to programming and Vue at the moment, and I am having a hard time deciding what to use. I have just finished a basic Vue tutorial and now feel overwhelmed by the wide range of possibilities. My main goal is to create an application that works on both tablets and PCs. It will be for a sports team where I can create profiles and keep track of their performance. I would like to display the records in a dashboard-style format.
    Initially, I was almost convinced that I should use Vitesse (which uses UnoCSS, similar to Tailwind, I believe), as you mentioned in another video. However, I am now considering whether Quasar or Vuetify would be better options.
    Any help you can provide would be greatly appreciated.

    • @ProgramWithErik
      @ProgramWithErik  Год назад +1

      If you don't have a time constraint, you might just want to use something simple like just plain old CSS. You'll learn a lot on how to use VUe.

    • @AllAroundFlight
      @AllAroundFlight Год назад

      @@ProgramWithErik I guess I will try that starter template then. Seems like you dont have to use unocss there and can just write plain css with the option later to try that

  • @036hoshino
    @036hoshino Год назад

    I had to use it differently depending on the trends of the development project and the technical type of the members.
    I personally like the customizability of Primevue.
    However, in projects with a small number of front engineers, the coding speed is significantly reduced.
    So in such cases, vuetify or quasar are the best candidates.
    Unfortunately, vuetify3 is not yet fully compatible with Vue3, so I am in two minds about updating my Vue2 project.

  • @MrQhuin
    @MrQhuin 27 дней назад

    Vuetify is hard to customize as it is made for vue itself, after 2 years of working with vue and vuetify I can tell if the project is made by it by just seing the UI.

  • @ch4.hayabusa
    @ch4.hayabusa Год назад +17

    PrimeVue should not be left out ... They've made great improvements in the last 2 months. Through 2021-2022 they were a much better choice for Vue 3 than Vuetify. Quasars tooling has been loaded with bugs and poor quality legacy Node code and a very bad culture that shunned ESM up to 2022, last time I checked.

    • @b0otable
      @b0otable Год назад +1

      What type of bugs are you getting with Quasar tooling?

  • @nested9301
    @nested9301 2 месяца назад

    Unpopular opinion : ithink each app should have it's own design system

  • @shaun9209
    @shaun9209 Год назад

    So ultimately which one would you go with? Of the ones you mentioned it seemed like quasar was the safest choice given maturity.

    • @ProgramWithErik
      @ProgramWithErik  Год назад

      I really like Amplify UI framework, Quasar and Vuetify

    • @Tarabass
      @Tarabass Год назад +1

      ​@@ProgramWithErikpolitics 😅

  • @jebrengl
    @jebrengl 3 месяца назад

    primevue + tailwind?

  • @dejikuye
    @dejikuye Год назад +1

    Amplify doesn't have UI components for Vue except Authenticator

    • @ProgramWithErik
      @ProgramWithErik  Год назад

      True! I wanted to add it to the video so everyone knows more about it. And I'm sure plenty of non Vue developers watch this channel

  • @adrielyozan7203
    @adrielyozan7203 Год назад +3

    Quasar + Vite + UnoCSS = ❤

    • @ProgramWithErik
      @ProgramWithErik  Год назад +2

      I need to try out this UnoCSS

    • @ch4.hayabusa
      @ch4.hayabusa Год назад

      Vite is a very pure stamdards focused JavaScript project that runs EVERYWHERE. Quasar breaks if you look at it wrong... Try running it in StackBlitz, Cloudflare Workers, in ESM mode without legacy compatibility hacks, with the latest version of TS sub path export patterns, Bun.js, even on Replit it'll have issues with E2E. It's not a robust framework made by a diverse visionary team like Vite.

    • @AdarshMadrecha
      @AdarshMadrecha Год назад

      I have to plan migration from windicss to uno

  • @cagataycivici
    @cagataycivici Год назад +1

    Forgot PrimeVue again 🤦🏻‍♂️

  • @Hlautameki
    @Hlautameki 8 месяцев назад

    The title is misleading. This video is an advertisement of Amplify UI.

  • @pepinogdev
    @pepinogdev 7 месяцев назад

    great video!

  • @bootstraply
    @bootstraply Год назад

    Vuetify for me, the data tables are awesome and necessary for me

    • @ProgramWithErik
      @ProgramWithErik  Год назад

      How do you like it?

    • @AngelHdzMultimedia
      @AngelHdzMultimedia Год назад +1

      I'm confused. Quasar has data table and its way better than Vuetify's.

    • @bootstraply
      @bootstraply Год назад

      @@AngelHdzMultimedia because i am already using Nuxt, Quasar and Nuxt don’t play well together, yet

  • @rahman9418
    @rahman9418 Год назад

    what do you think about unocss? made by antfu

  • @RobertWildling
    @RobertWildling Год назад +1

    ..so this is actually a video about AmplifyUI...

  • @namaefumei
    @namaefumei Год назад

    Last time I tried Vuetify the docs were so horrible that even though I spent 4 days building my site with it, I decided to rewrite everything.

  • @Farbfilmstudio
    @Farbfilmstudio Год назад +3

    hear me out: Tailwind + Quasar = ♥

    • @ProgramWithErik
      @ProgramWithErik  Год назад

      Is there a framework for this?

    • @AdarshMadrecha
      @AdarshMadrecha Год назад +3

      No need for another framework.. Quasar works really well with Tailwind

    • @AngelHdzMultimedia
      @AngelHdzMultimedia Год назад

      Can you explain why? Quasar works with sass variables, and it has many CSS utility classes like Tailwind.
      I would only need TW if i need a specific class that Quasar doesn't have.
      Unless you are talking about the Tailwind's pseudo selectors!? 🔥🤯🤩
      Ok I agree with you now.

  • @Meixger
    @Meixger Год назад

    UnoCss + daisyUI

  • @mememorice-ve9sx
    @mememorice-ve9sx Год назад

    tailwind all the way

  • @deecee2204
    @deecee2204 Год назад +2

    quasar ftw. lost all hope to vuetify

    • @Tarabass
      @Tarabass Год назад

      Why? I'm in the position to make a decision about which tools/framework we are going to use for a new crud application..

    • @deecee2204
      @deecee2204 Год назад

      @@Tarabass pretty stable. helped me a lot when we ventured into PWAs.
      But vuetify has been keeping up with the updates on v3.
      But look at the components ready for Quasar. Pretty fascinating. Out of the box you get, Notify, Confirm Dialogs, Date Pickers and File Uploaders.

  • @user-hk3te3ql5p
    @user-hk3te3ql5p Год назад

    PrimeVue