Vue.js UI rewrite

I sent a Github issue, but thought this place might be better to reach the Volumio devs, so it is a repost from here : github.com/volumio/Volumio2-UI/issues/256

Hi all,

First, I would like to say that Volumio UI looks absolutely gorgeous ! And among the few options available out there, this was definetely what made me choose Volumio for my audio player so thanks for the great work.

So I thought I could contribute in some way and cloned the different repos. My proposal is a bit raw so sorry about that : would you be interested in a complete rewrite in Vue.js ?

Let me give you some background for those of you who don’t know this framework, and please keep an open mind to have a healthy constructive discussion :

  • Component based (just as Angular 2) : much easier to maintain and test
  • Hot reloading out-of-the-box : great dev experience (my best so far)
  • Core is very light, and a few libraries go around it to get a few necessary features (Vuex, vue-router, vue-resource to name the most important ones)
  • Very gentle learning curve : my colleagues (who know Javascript already) started coding on an app and got productive incredibly fast

On the other side, AngularJS is a bit old and will deprecate someday. I tried Angular (2) but :

  • Component based, which is nice, but the code is a bit messy
  • Typescript needed
  • Harsh learning curve

Si if you ever thought about upgrading to Angular, please consider this option as I am willing to offer my help to prepare the boilerplate and be there to help with any issue we would encounter.

Now that I think about it there is something else : themes could implement specific features thanks to the component behavior. I am not sure about this one but I would be happy to give it a try. A theme could for instance change the way playlists look, or even the menu items order, well I haven’t thought of something precisely but it could be more than just changing the HTML.

Thanks for your feedback on this idea !

I heard good things about Vue.js, Vuex and even adding Redux (flux) to the picture. People that used it said it’s better than Angular.js and more advanced than plain React.js.