React's core philosophy is JS everywhere - there's no template, no HTML, no CSS; only JS. As much as possible, write JS, and if you can, pure JS.
It has its benefits - you can have code formatter to format your JSX, unit test any part of your code, or write integration tests with mount, or write snapshot tests. Extremely easy and natural to compose various components - because it's a function calling another function.
Vue is magic, and its own DSL rules will get in your way. For instance, inside the Vue templates you cannot use `this`. However, inside your methods and computed, you have to.
Coming from Angular 1, Vue JS would look feel like a breeze.
Never could make ESLint work on my Vue files, tried all plugins. Some parts of the code it lints, and some parts of the code it doesn't.
Inside your template, Vue.config can be undefined; so you've to assign it to something in mounted(), and then get it to work.
Vue artisans tell me Vue supports "this" or "that". I don't want something that supports A or B - I want something where A and B are inherently supported from the ground up.
It's not all bad. VueX is pretty cool, kinda like Redux without the drama. And I cannot stress this enough - it's insanely easy to go through a Vue codebase and pick up the business logic of your app.
It still takes me some time to get used to a new React codebase.
Overall, I felt Vue is really good to build MVP and get your product off the ground, but it starts to show why you need React's discipline in your codebase with growing requests from users to add new features and support more platforms.
Then again, I'm new to Vue JS; so ask me again in a year. Am keeping an open mind.
Except everyone seems to complain that "this" exists at all, but then it's confusing that "this" is implicit inside an objects own template?
The DSL is awesome, and what makes it even more awesome is that it's optional. Your options are HTML, Jade/Pug, JSX, and a literal vanilla function. After the compile process, the template ends up as a render function.
> Never could make ESLint work on my Vue files, tried all plugins. Some parts of the code it lints, and some parts of the code it doesn't.
I can't say for sure this was true a year or more ago (especially in that short time you couldn't tell which libraries supported Vue 1 or 2 or both), but today and for as long as I've remembered eslint has been working in my Vue component files and inside sublime linter. My biggest complaint is that I want reasonML.
Vue: <li v-for="i in items">{{i}}</li>
React: items.map((i) => <li>{i}</li>)
[1] https://github.com/vuejs/babel-plugin-transform-vue-jsx#usag...
With React, it was pretty clear which element / component would repeat.
I don't really understand's the author's point about GraphQL and Axios. But React Router, Redux and its ecosystem of supporting libraries are issues in React development
Having state management (axios), a built-in router, "the" styling solution built into Vue is a big win for us. Single File Components (SFC) are a joy to work with.
I actually like JSX (which you can use in Vue too), and was worried about "stringy code" ala directives, but in practice it hasn't been a big deal. We also switched from Typescript to plain ES6 which is a big win in simplifying our code. I'm actually a big fan of static typing, but at the end of the day Typescript's complicated type system, typing file incompatibilities, and general fiddling around with types wasn't worth it for us.
Redux was just a nightmare for us to work with. A library on top of Redux like DVA https://github.com/dvajs/dva would've helped, but there's a very small community there. We went to Mobx State Tree for a while, but there were a bunch of issues there too.
I'm keeping an eye on Blazor for some administrative apps in the future, but for now we're very happy with Vue.
Axios is a http client library, not state management library, you're thinking of Vuex. That being said, I don't know why the author associates Axios with React ecosystem, it's just a library you can use with any of the client frameworks.
I've found vuex much more pleasant to work with than straight redux. I wish Facebook would just come out with an "official stack" already and put something on top of plain Redux to make it more programmer ergonomic.
And it let me use LESS javascript. Less javascript is always good.
My one complaint is that Vue components place templating, code and styles in a single file and I'd prefer a directory with three (or more) separate files.
You can have that. You do need an index.vue file containing something like:
<template src="my-component.html" />
<script src="my-component.js" />
<style scoped lang="scss" src="my-component.scss" />
If you put that into a directory called my-component/ then you can just do: import MyComponent from 'my-component'
…and it will pull everything in.