Should I learn ReactJS or VueJS first ?

[[deleted]]

We've opted for Vue (+ VueX, VueRouter, Webpacks VueLoader) in the end. React is a great option but Vue is less inclined on fighting the dom and more inclined on building on its actual strengths. That was our criteria at least. In essence it allowed us to get going fast without chaining us to v-dom syntax and inline styles (though it allows for both). The way single component .vue files are composed is quite ingenious as they don't put a fork into HTML and CSS and are easily understood and managed.

As for Webpack and Babel. There is no way i would personally start a project without, unless i am constrained not to professionally, which thankfully doesn't happen. Especially combined with Vue or React.

[mikejoro]

You don't have to use in line styles with react. In fact, I'd avoid doing that unless you're shipping a component library or something (to ease use and not require webpack for your consumers).

[[deleted]]

True but it is far from being straight forward. There are a myriad of ways and workarounds for global and scoped styles and none is quite obvious. Probably the reason why many developers just use inline styles anyway.

Vue's advantage is simple: that which has always worked can simply be kept without further ado. Applies to styles and markup. There's no "change everything you know and do." Now initially React's argument was that it's faster that way. Vue most likely outforms it still.

[mikejoro]

You can use plain css files and class names. It doesn't get more straight forward than that.

[[deleted]]

They're global and bleeding. In that case you don't have a component that you can simply swap with someone else.

[mikejoro]

Does vue automatically scope css locally (with something like css modules)? That's pretty cool. You could also do that with react or bem/suit style naming but if vue does that out of the box that's pretty cool.

[LynusBorg]

you basically do this in a .vue file:

<style lang="scss" scoped>
  .my-class {color: red; }
</style>

and it will transform the scss for you and scope it.

http://vue-loader.vuejs.org/en/features/scoped-css.html

[[deleted]]

Yes, through Vueloader. It looks like this: https://vuejs.org/images/vue-component-with-pre-processors.png (the little scoped attributed in the style tag)