Vue, Vuex, and Vue-router official document are good enough. Many concepts in Vue are similar or quite simple compared to what you have to know in React. However, I find that Vuex is a little bit more verbose than Redux. You might it troublesome at first but will be better after you are familiar with it.
Agree with other comments that Vue and its companion libraries have much larger API surfaces and have a lot of magic while React's advance techniques can be built upon few basic fundamentals so you need more time to remember those.
But I feel that most of APIs are practical solutions to problems you need to fix by yourself in React.
Ahahaha! I mainly do PHP though, so it probably wouldn't be a good fit. I mainly just fill the gaps in frontend tasks occasionally when needed (but used to do a lot more frontend at my previous job).
In essence, many things you take for granted do become harder because Vue is modelled after older templating frameworks like Angular, so you're jumping right into DI again and scope separation. It makes it less flexible and simple compared to React. My biggest gripe with it was that for many problems the basic knowledge you have isn't enough, you need Vue-specific solutions (remember the "Angular-way"?). After a while it gets easier.
No resources, but I do have some advice: Don't do it (if it can be helped). I made the switch and jumped into a Vue project at work, and I'm hating every second of it.
Vue is for noobs and back-end developers that don't know any better. There's no reason whatsoever to use it after you're familiar with React. Don't buy into the hype. There's lots of things that are intuitive or easy to learn in React, and have to be researched and memorised in Vue. Being a 'Vue' dev is a constant exercise in rote memorisation and remembering how things behave in certain edge cases.
Let me throw out an example I ran into 2 hours ago. I could do this basically any day of the past 6 months and give you a different example.
Say you need to render a component dynamically based on some data. Maybe you have the name of the component in a string (i.e it's come from a back-end etc) and know the scope it lies in, or maybe you're passed a component as a prop (you see this pattern all the time in higher order components in React, i.e '(Component) => <Component />')
In React, you can simply do the above. If you've been programming in React for a while you probably intuitively know that you can just do (Component) => <Component />, why? Because the JSX transform is trivial, and you can do it in your head.
When you render a component in React, you know that the '<Foo />' transpiles down to React.createElement(Foo). It doesn't matter how Foo enters the scope, whether it's imported at the top of the file (and therefore closured into your function) or comes in as a prop, it'll just work. As long as you're familiar with the Javascript language, you'll know this just works.
In Vue, it's not that simple. Because Vue components are all in this complex templating language, you need to look up how to do even slightly advanced things like this. There's always a 'Vue' way to do it, rather than a 'Javascript' way to do it. Or, as in this case, there's a "refactor your entire component to be a render function" way to do it, almost like an 'escape' to using actual JS, because the Vue templating language just isn't good enough to handle what you want it to do.
And god help you when you need to try and figure out the Vue way of doing something via Google instead of having an expert mentor on your team to help. Forget the official docs, they're garbage. And Vue (as well as React, to be fair) has the same problem PHP had 15 years ago, squillions of noobs have just flooded into the ecosystem and resources like Stack Overflow, chat rooms etc are swarming with "slightly experienced noobs" trying to help people a little bit newer than themselves. The quality of online resources is shockingly low. Even if you're an experienced front-end dev and know all the terminology and how to phrase your questions and search queries, there's no guarantee everyone else does, so you'll have to wade through 50 nonsensical answers to every problem you might run into. It's infuriating, inefficient, and soul sucking.
And, you know what, just in general I'd never recommend anyone switch front-end libraries unless you have literally nothing else to do. As far as your personal learning and career progression goes, it's always best to learn how to do something new. Failing that, it's sometimes good to learn a different way of doing something. But the absolute worst thing you can do is learn a different representation of the same way of doing the same thing. Vue and React are the exact same shit. You're better off learning the inner workings of one of them (try building your own, it's fun!) so you can bring that knowledge to the next trendy crap that comes along, rather than trying to learn all the trendy crap.
I really try to convince myself that this is not a troll comment.
But I can't.
[edit]
Since somebody downvoted my previous form of comment (probably because of lack of constructive opinion) I'll fix it now:
Calling other programmers noobs doesn't make you a better person by any means.
On one side you're saying that Vue.js is that easy to learn so there's lots of noobs using it, but on the other side you're saying that you need constantly google/look into to docs for help.
Vue documentation is the best introduction to the tool I've ever encountered. Same for the rest of the docs for the Vue's ecosystem - they're written in consistent form, so you can just simply 'jump in' and learn progressively. Even templating language looks like already familiar good old HTML. I was prepared to build production-ready application after a week of messing around with Vue & its documentation.
I can't tell same much good words about React, since after spending a month with it I couldn't figure out how to solve some basic edge-cases (like finding proper way to style components - are you kidding me, React is like 3+ years old, used by thousands of developers and people are still arguing about proper way of styling its components? In Vue you just put it into `<style>` block of Single File Component, or serve generic ones in the global stylesheet file and that's it, simple as that.)
But I think it's just a matter of personal preferences - Vue just suit me better, while React doesn't. I don't like react personally - but I do respect the people who created it and these who uses it on daily basis. Period.
Every developer can choose hers/his tools that suits best, but calling someone because of that a noob is... just unprofessional.
You style components in React like you always did before. That's the whole thing about it, it never changes what you know. ... Unless you decide using a more modern approach like styled-components et al.
Your complaint is that in order to understand how to do something, you need to learn that thing first? As an experienced React dev, of course you know "intuitively" how to do things in React. As a Vue dev, your examples do not make sense to me.
FWIW I have found the Vue documentation excellent, and there are plenty of resources online to learn as well.
Both React and Vue are great solutions, the approach is just a bit different. This high and mighty attitude of "my thing is great, the other thing sucks" is a detriment to everyone.
You've totally misunderstood the example then. The point is that lots of more advanced concepts in React can be intuitively constructed from the basics. Of course you have to learn something, every tool has an API. That doesn't mean all standardisation and abstraction in the history of computing is pointless because we could all be memorising x86 assembly programming patterns ad nauseum...
And you know what attitude is a detriment to everyone? The attitude that every library in JS land is worthy of praise just for the sole reason of existing. Yeah sure writing libraries is hard, and takes effort, and getting over 9,000 GitHub stars or Twitter follows or whatever the fuck is a great accomplishment, but it's perfectly possible to harm the overall ecosystem by blindly spreading bad abstractions and inferior solutions.
I did not misunderstand it, I don't understand it at all. And I don't expect to. Because I don't know React (nor JSX). Nothing about this is "intuitive" to me (you keep mentioning this word, I don't think it means what you think it does).
There's really a few big choices for a JS framework now (and of course thousands of small ones). Calling fellow developers who use the second most popular JS framework "noobs" doesn't help your case at all.
I don't care about GitHub stars, nor Twitter follows. I do care about a tool which allows me to achieve what I need to achieve. And in the case of front-end development Vue definitely does this, in a simple to understand and performant way. Judging by its popularity many others agree.
And who gets to decide what is and isn't an "inferior solution"? Thankfully not people like you.
What the above poster is getting at is that React allows you to solve complex problems using a few basic principles. Vue has a much wider API "surface area", meaning there are a lot more special cases you need to learn to solve specific problems.
By intuitive he meant that React is mostly vanilla JavaScript, so if you know JavaScript then you know React. Basically when I code in React I never need to open the doc. Even building the most complicated view is straightforward.
With frameworks like Angular (I don't know about Vue), you always keep the doc open in background because you constantly need to look for a function signature, check what's the syntax for something or how this or that works…
As a new JS developer, I found React to be very intuitive as opposed to Vue.js. I remember trying to scour through some mastodon frontend code and it looked much more complicated.
Of course this is anecdata so take it as you will.
Totally agree with you. React is just an API which enhances vanilla JavaScript. In React it's possible to use all prior knowledge and practices from other languages, eg functions/objects composition, and decoration.
Vue is different. With it, you can't confidently use your previous programming experience.
I know you're being a smartass, but yes, actually. Given two tools that do the exact same thing where one requires more specialised knowledge to use than the other, you'd be an idiot to choose the more complex one without receiving any compensation.
It all depends where you come from, for instance if you've ever used Angular, you'll pick up Vue's syntax in one afternoon, it's super simple transition. Also to any backend programmers it will probably feel more familiar than JSX. And I also don't think it's more complex, once you learn to add those few special attributes to html. I work in React mostly but to me Vue's templates are way cleaner than JSX when it comes to writing boolean conditions, you have closing tags instead of ))})}})}} mess and any editor will know to highlight them for you, you don't have to use external libs like classnames to compose css classes elegantly, it's already built in, you can pack js and css in one component without any external libs and hacks. Of course, I'm not saying you're wrong for liking JSX better, it's simply a matter of personal taste and depends heavily on your background.
In fairness, you're comparing a situation where you already know the specialised knowledge to one where you do not. Higher order components are simple in React precisely because you know the framework inside out and you know what a JSX transform does, internally, sight unseen.
That's not particularly intuitive! It just feels that way because you know it well.
> There's always a 'Vue' way to do it, rather than a 'Javascript' way to do it.
I mean, come on. There's a 'React' way to do almost everything too. Want to create an element? No document.createElement for you, you'll be wanting to import ReactDOM, make a class that extends Component (or make a stateless component via a function. Also not intuitive!), then render that component into the DOM.
> No document.createElement for you, you'll be wanting to import ReactDOM, make a class that extends Component (or make a stateless component via a function. Also not intuitive!), then render that component into the DOM.
Yeah but you just described the entire framework. What he's driving at is that React had a very small API surface area, Vue has a much larger one.
