4 ms·

Can someone explain the appeal of Vue over React?

mmcnl 9y ago
Simple and easy to use. Official vue-router and vuex (centralized state management) libraries are excellent.
maxyme 9y ago
It's like if you took Angular 1 but made it more template based and gave it the performance of Angular 2 without having to compile your code. Also you can avoid using JSX (although it can be used if desired)
deleted 9y ago
[deleted]
Tade0 9y ago
Look how Vuex - which is an equivalent of Redux, but for Vue - is implemented. Comparing to Redux it's much simpler.
- regecks 9y ago
  I would suggest to visitors to Vue to not dive into using something like Vuex unless you really know need it - IMO it's not at all a 'by default' library to bring into a Vue project. Give a try using only props and events. You will save a lot of typing and brainpower avoiding actions, mutations etc. I work on a fairly large, at this point, Vue application, and I am pleasantly surprised how far we've gotten without global state stores. If you need a global event bus, you can just use vanilla Vue to get quite far as well - https://vuejs.org/v2/guide/components.html#Non-Parent-Child-Communication https://vuejs.org/v2/guide/components.html#Non-Parent-Child-...
  - orangecat 9y ago
    Agreed. I looked at Vuex and it seemed unnecessarily complex for most projects. We just have plain state objects that get passed to components that need them, and a convention that components call methods on the state rather than modify its properties directly.
jaxondu 9y ago
Simpler. Have standard router, Vuex store, so no need to choose which router to use, Redux or Mobx etc. Compatible with web components. Standard way of creating plugins/middleware and project templates. VueJS is more of a framework than React's view component. No 'concern' over the licensing. Use JSX or not is up to you. Smaller size. My bet is VueJS is likely to be the next JQuery. I switch from React and life is better.
erokar 9y ago
1. Template syntax instead of JSX, the latter being unfamiliar and initially off-putting to many. 2. Two-way data binding. Convenient, no need to write handler functions. 3. Comes off as a better version of Angular. Appealing if you're familiar with Angular. 4. Comes off as more curated than React with regards to e.g. routing and state management, less need to shop for libraries. 5. More performant in some situations. That said, I prefer React. I consider 1 and 2 drawbacks of Vue compared to React.
- KitDuncan 9y ago
  Two-way databinding is not supported by Vue 2 if I remember correctly. You can do it, but you'll get console logs, about how you should avoid doing it.
  - erokar 9y ago
    It seems to be supported in Vue 2.x to me: https://vuejs.org/v2/guide/forms.html https://vuejs.org/v2/guide/forms.html
  - regecks 9y ago
    Two-way binding does exist, just not in the same problematic way it existed in Vue 1. It was changed to just be syntactic sugar for the event handler approach - https://vuejs.org/v2/guide/forms.html https://vuejs.org/v2/guide/forms.html .
- roblabla 9y ago
  Just a nitpick, but you can use JSX in vuejs : https://vuejs.org/v2/guide/render-function.html#JSX https://vuejs.org/v2/guide/render-function.html#JSX
  - threatofrain 9y ago
    But how is the JSX story in Vue? Every time I ask this I kind of get crickets, because it seems just about everyone is using the default template syntax.
sametmax 9y ago
Vue doesn't force components or build tools on you. You can drop it as a 30ko script in an html tag and put the template in the html file for small projects, then go full webpack + components as it grows. Managing state is very natural on small projects, but you can use the official, well integrated store. The doc is stellar. The api is simple, with no surprises, and riddle with small helpers to make your life easier. As a result, reading the official tutorial feels like a friend is talking to you. Debugging and training are easy. I do mostly react for my clients, but when i can choose, i always go for vue.
- mgkimsal 9y ago
  > The api is simple, with no surprises There are surprises. Reactivity with child components, and how to deal with that - there's enough "this isn't what I was expecting" that I run in to a lot in the forums that it's certainly a "surprise" to many.
- fishtank 9y ago
  As someone who uses Vue every day at work I would not say that Vue has a simple API, though it has many conveniences. I think a fair comparison would be to look at React's component API: https://facebook.github.io/react/docs/react-component.html https://facebook.github.io/react/docs/react-component.html And compare it with the Options / Lifecycle Hooks and Instance Properties and Instance Methods sections of the Vue API docs: https://vuejs.org/v2/api/ https://vuejs.org/v2/api/ Vue may be simpler if you have passing familiarity with Angular 1, or if you are very familiar with Mustache-style templates. But I think it's wrong to say the API is simple, or has a small surface.
  - sametmax 9y ago
    The naming all life cycle methods, the grouping of things by categories in data, methods, all the things you don't need to learn to make jsx do what you want, the whole props/callback things that is vastly simpler, no set state shenanigan, no two ways with consequences of creating components, the use of standard html attribute names and not js dom api names, etc. That makes manipulating the api way simpler for me.
sandGorgon 9y ago
MIT licensing without weaponized patent clauses. https://medium.com/@raulk/if-youre-a-startup-you-should-not-use-react-reflecting-on-the-bsd-patents-license-b049d4a67dd2 https://medium.com/@raulk/if-youre-a-startup-you-should-not-...
JansjoFromIkea 9y ago
A small factor but a big one imo is that vue-cli is an infinitely tidier affair than create-react-app. It's very easy to get through your first few apps and tutorials with Vue because they're usually following the exact same base. Vue DevTools (with Vuex support) is a much more pleasant experience than React/Redux Dev Tools as far as Chrome integration goes too.

Simple and easy to use. Official vue-router and vuex (centralized state management) libraries are excellent.

It's like if you took Angular 1 but made it more template based and gave it the performance of Angular 2 without having to compile your code. Also you can avoid using JSX (although it can be used if desired)

deleted 9y ago

[deleted]

Tade0 9y ago

Look how Vuex - which is an equivalent of Redux, but for Vue - is implemented. Comparing to Redux it's much simpler.

regecks 9y ago
I would suggest to visitors to Vue to not dive into using something like Vuex unless you really know need it - IMO it's not at all a 'by default' library to bring into a Vue project. Give a try using only props and events. You will save a lot of typing and brainpower avoiding actions, mutations etc. I work on a fairly large, at this point, Vue application, and I am pleasantly surprised how far we've gotten without global state stores. If you need a global event bus, you can just use vanilla Vue to get quite far as well - https://vuejs.org/v2/guide/components.html#Non-Parent-Child-Communication https://vuejs.org/v2/guide/components.html#Non-Parent-Child-...
- orangecat 9y ago
  Agreed. I looked at Vuex and it seemed unnecessarily complex for most projects. We just have plain state objects that get passed to components that need them, and a convention that components call methods on the state rather than modify its properties directly.

jaxondu 9y ago

Simpler. Have standard router, Vuex store, so no need to choose which router to use, Redux or Mobx etc. Compatible with web components. Standard way of creating plugins/middleware and project templates. VueJS is more of a framework than React's view component. No 'concern' over the licensing. Use JSX or not is up to you. Smaller size. My bet is VueJS is likely to be the next JQuery. I switch from React and life is better.

erokar 9y ago

1. Template syntax instead of JSX, the latter being unfamiliar and initially off-putting to many. 2. Two-way data binding. Convenient, no need to write handler functions. 3. Comes off as a better version of Angular. Appealing if you're familiar with Angular. 4. Comes off as more curated than React with regards to e.g. routing and state management, less need to shop for libraries. 5. More performant in some situations. That said, I prefer React. I consider 1 and 2 drawbacks of Vue compared to React.

KitDuncan 9y ago
Two-way databinding is not supported by Vue 2 if I remember correctly. You can do it, but you'll get console logs, about how you should avoid doing it.
- erokar 9y ago
  It seems to be supported in Vue 2.x to me: https://vuejs.org/v2/guide/forms.html https://vuejs.org/v2/guide/forms.html
- regecks 9y ago
  Two-way binding does exist, just not in the same problematic way it existed in Vue 1. It was changed to just be syntactic sugar for the event handler approach - https://vuejs.org/v2/guide/forms.html https://vuejs.org/v2/guide/forms.html .
roblabla 9y ago
Just a nitpick, but you can use JSX in vuejs : https://vuejs.org/v2/guide/render-function.html#JSX https://vuejs.org/v2/guide/render-function.html#JSX
- threatofrain 9y ago
  But how is the JSX story in Vue? Every time I ask this I kind of get crickets, because it seems just about everyone is using the default template syntax.

sametmax 9y ago

Vue doesn't force components or build tools on you. You can drop it as a 30ko script in an html tag and put the template in the html file for small projects, then go full webpack + components as it grows. Managing state is very natural on small projects, but you can use the official, well integrated store. The doc is stellar. The api is simple, with no surprises, and riddle with small helpers to make your life easier. As a result, reading the official tutorial feels like a friend is talking to you. Debugging and training are easy. I do mostly react for my clients, but when i can choose, i always go for vue.

mgkimsal 9y ago
> The api is simple, with no surprises There are surprises. Reactivity with child components, and how to deal with that - there's enough "this isn't what I was expecting" that I run in to a lot in the forums that it's certainly a "surprise" to many.
fishtank 9y ago
As someone who uses Vue every day at work I would not say that Vue has a simple API, though it has many conveniences. I think a fair comparison would be to look at React's component API: https://facebook.github.io/react/docs/react-component.html https://facebook.github.io/react/docs/react-component.html And compare it with the Options / Lifecycle Hooks and Instance Properties and Instance Methods sections of the Vue API docs: https://vuejs.org/v2/api/ https://vuejs.org/v2/api/ Vue may be simpler if you have passing familiarity with Angular 1, or if you are very familiar with Mustache-style templates. But I think it's wrong to say the API is simple, or has a small surface.
- sametmax 9y ago
  The naming all life cycle methods, the grouping of things by categories in data, methods, all the things you don't need to learn to make jsx do what you want, the whole props/callback things that is vastly simpler, no set state shenanigan, no two ways with consequences of creating components, the use of standard html attribute names and not js dom api names, etc. That makes manipulating the api way simpler for me.

sandGorgon 9y ago

MIT licensing without weaponized patent clauses. https://medium.com/@raulk/if-youre-a-startup-you-should-not-use-react-reflecting-on-the-bsd-patents-license-b049d4a67dd2 https://medium.com/@raulk/if-youre-a-startup-you-should-not-...

JansjoFromIkea 9y ago

A small factor but a big one imo is that vue-cli is an infinitely tidier affair than create-react-app. It's very easy to get through your first few apps and tutorials with Vue because they're usually following the exact same base. Vue DevTools (with Vuex support) is a much more pleasant experience than React/Redux Dev Tools as far as Chrome integration goes too.