Can someone explain why someone would choose Vue over React (or one of the clones)? When I looked at the docs for Vue it reminded me of my Backbone days.
Instead of Vue or React, you might choose Angular 2. Vue is sort of touted as "Angular done right". I did enjoy working with Vue (I actually enjoyed working with all of them), but I think Angular 2 may be "Angular done right". However, Vue seems to try to be more lightweight and less of a framework than Angular (1 or 2). It has this in common with React. I think both Vue and React would be easier to start introducing into an existing app incrementally. Angular 2 seems like it's more of a framework/holistic choice. It has this in common with Ember, although this is true of Ember to an even larger degree.
Those four functions are view (take a model and return some HTML, like a React top-level component's render method), update (take a model and a msg/action and return a new model, like a Redux reducer), init (an initial state) and subscriptions (a list of things to watch for changes and automatically create msgs/actions from, like mouse movement or websockets). When you run a program, it feeds the initial model into the view, and renders it. HTML elements can create messages (dispatch actions) based on DOM events, and subscribed things (like websockets) can also create messages. Every time a message is created, it gets fed into the update function with the existing state, and you branch on the message type to figure out what the new state should be. Then that new state is fed into the view function again and the result is diffed against the virtual DOM and the optimal update made.
The biggest differences between React and Elm are that you don't mess with lifecycle hooks and that you don't repeat this pattern for every sub-component. Instead, you just write lots of small functions that take a model and return some HTML, and you can call those from your top-level view function -- a bit like building everything out of React stateless components.
Writing any Elm code feels a lot like writing React, but with much less boilerplate, reduced complexity, excellent error-catching, and static typing.
I do not want to write a long story of composability and fancy types that haskellers want it and Elm doesn't have. But thoes are also big blockers
But if (like me) you were never quite able to figure out how to use React (especially all the build tooling that's suggested in every tutorial), then Vue is worth a look as it's incredibly simple to get started with and easier to learn.
I find it especially appeals to people coming from a place of familiarity with html and css (whereas react seems to appeal to people with more of a straight-up programming background). YMMV
I think this is problematic because people don't differentiate between React and the React ecosystem. Plain old React is just as easy (probably easier) than learning Vue. I always recommend the official React tutorial (https://facebook.github.io/react/tutorial/tutorial.html) before even thinking about Redux or Webpack or whatever.
But... that tutorial you say you like to show people utilizes jsx, which needs to be compiled with something (right? Or does react do the compilation automatically at runtime now and I missed that memo?).
And for people coming from a place where they are very comfortable and familiar with html and css, and maybe a light sprinkling of jquery on top, Vue is way more approachable than the tutorial you linked to.
(My understanding is that Vue templates also need to be compiled -- is that incorrect?)
I wrote the tutorial. Could you give any suggestions on how I could make it easier to get into?
The number one thing that you (and Facebook) could do to help people learn React, and combat the perception that it requires overly complex tooling, is write a tutorial that shows how to use React entirely in-browser without any build toolchain. A static HTML file, some <script> tags pointing at a CDN — done. No distractions, nothing to download, nothing to install, nothing to run, just a JavaScript library that makes it easier to write view templates.
It would make it even easier to get into if that tutorial were written entirely in ES5, but you could use babel-standalone if you felt that JSX and ES6 were important enough.
Maybe my use case is rarer, I don't know, but if I want to do things right, I want to understand what I'm setting up. Do I really need babel? If I use Typescript, do I still need it? etc...
I understand this doesn't have much to do with React per se but if these components are a definitive part of the ecosystem people work with, there is value in at least telling people where to find a high quality explanation for how they fit together.
I've since learned more about compiling and including other resources so could probably handle the React tooling and requirements now but back when I started it was a big stumbling block.
And to me using JSX is infinitely better than have to use opaque template directives like Angular and Vue.
I took a closer look at your tutorial. It's really very good! And I like that you link to a codepen which gets people up and running without having to even create their own html file.
Tutorials speak differently to different audiences -- I imagine people used to building more traditional "apps" get a lot out of this one.
But speaking from the perspective of someone who spent years making html+css pages that had data piped into them from the back-end (PHP, Rails, etc)... the scope of the tutorial is somewhat overwhelming to me :) It goes right into components, shared state, immutability, functional programming, history... to some people that is a lot of concepts at once. I think the appeal of Vue (to a certain slice of people) is that you can just add it as a "light touch" onto an existing html page. For example, show me one textbox who's value gets displayed in a div somewhere else on the page as I type, or one button that toggles the visibility of one image. Just super duper basic stuff, in very isolated and limited-scope chunks, and in the context of "easy dom manipulation" (as opposed to "building a game or app").
JSX can be used at runtime by including the babel browser compilation script. This is only recommended for development, not production. React can also just use plain javascript, although JSX is a much cleaner and easier to use with the rest of the framework.
I wish they came out with a storage/persistence system as simple conceptually as the renderer.
Maybe that's a lot to ask for though.
React by itself gives me blue balls.
I started to write this tutorial, an example based guide, https://github.com/thewhitetulip/intro-to-vuejs
I feel its very straightforward way to build applications and most parts of it are handled by browser API's. It seems like a perfect middle ground between react/angular 2/vue - and you can still throw in redux or uniflow-polymer if you want.
It seems polymer 2 will support yarn. but until then, it is a no go.
Not all packages are on npm, i use mix of npm and bower without issues. When the JS community comes up with better npm will people stop using packages on npm?
That's like saying just use Javascript for everything. Good grief.
I love that React makes developers more productive with JSX but there should be a way of outputting HTML for large template like React components. Browser are much happier dealing with HTML.