Hacker News Reader

Comment by Xeoncross | Hacker News Reader

Looks like vue.js is doing great marketing (even if just word-of-mouth). Almost half the participants say: "I've HEARD of it, and WOULD like to learn it".

Meanwhile, react.js has over half the participants saying: "I've USED it before, and WOULD use it again".

View on HN

Recently chose Vue.js over React, and it's been great! React was a pain to learn imo and Vuejs really made everything smooth and easy. Just my 2 cents.

How is React a pain to learn? It's the most simple framework I've ever learned. I can count all the methods/concepts on my fingers: components, state, props, setState, render and 5 or 6 lifecycle methods you occasionally use (componentDidMount and so on). The rest is vanilla JS.

I coded with Angular 1 for 2 years and had to open the doc each time I wanted to use ngRepeat…

The v-* directives put me off from learning VueJS. Sticking control flow in dom tags is almost never a good idea - you already have Javascript, inventing your own syntax just means the developer now has to learn two ways to do the same thing, for not a lot of gain.

Absolutely! When I switched from Angular1 to Angular2 (alpha) it was such a pain trying to figure all their new directives.

I just wanted to render a list components or conditionally render something.

When I made the move to React - following the painful Angular2 beta update - I was so relieved to just use Javascript again.

We use a library call virtual-jade. Like react compiles jsx to JS, it compiles pug/jade to JS as h(node, attrs, children) calls. With with react, preact and snabdom.

It's been amazing writing templates that are just functions in a clean language like jade/pug. Jsx still has a lot of boiler plate.

https://github.com/tdumitrescu/virtual-jade

Also has a webpack loader https://github.com/tdumitrescu/virtual-jade-loader

Most of all I love this kind of libs that work well with other libs. It's like Lego programming. Choose bricks you like and stack them.

v-directives are just a bridge for old angular.js developers to jsx and render functions. Vue supports both.

Not saying that you're wrong, but the docs sure seem to imply that directives are the way to go: https://vuejs.org/v2/guide/index.html#Declarative-Rendering

Yeah, that was my own personal opinion prefacing the facts. Vue supports both, but the template system is generally used more in the Vue ecosystem than JSX is. Vue neatly fits between JSX and angular.js' clunky template language. Since the developer can quickly understand that Vue and React are both doing the same thing underneath, he can pick his preferred way to do it (template vs render func). I see in passing that more experienced devs I've worked with prefer the react way at a higher rate than those of less experience do. But mostly, you're right that v-directives are vastly more popular.

Every time I ask about people's JSX experiences in Vue I hear very little.

I came to vue liking JSX pretty well, but it does seem that culturally (or maybe just among newer developers like me) the single-file component with directives in the markup is more popular. Especially in tutorials. I haven’t really felt any pain with the default vue tenplating style that made me think switching to JSX again would be useful to me.

React is easy when you just do data -> rendering. But what about animations, modals and other forms of interactivity that doesn't fit squarely into this?

And while React is simple, you quickly have to add a router, some state management etc., so instead of a small simple library most React-projects I have seen end up being a custom framework.

None of these things come with Vue out of the box. The only difference is, React has often many solutions and massive community support to chip away at something until the very best stand-out solution emerges: redux, react-router, next, etc. React encourages this by staying out. Usually it then trickles down into other eco systems (vuex, vue-router, nuxt, element, ...). If something is very stable or close to perfect it's going to be made official, like modals:

Modals: https://reactjs.org/docs/portals.html

Or animations (in react-native at least, but if you click the link you'll see it works for the web just as well): https://www.webpackbin.com/bins/-KfKys3S2mgEH9UsE8GL

In Vue you're pretty much in the rain. The community isn't encouraged to explore due to half-baked-in solutions, and baked in stuff in general is browser-complacent and thereby very limited. So you get css class animation groups (=react-animation-group), state is a one trick pony tied to the lib, theming isn't considered. There are so many open gaps and holes in the eco system at large, i'm scratching my head over how this would possibly be a plus or easier to the developer. It is often not.

React has perfectly fine state management out of the box, and a "router" is about 20 lines of code for most people's use cases.

If needing more libs for projects is your issue with React you should try Mithril. Routing is included. There's nothing really magical about state management; plain old JS objects work for 90% of state management, and Mithril streams fill in the rest.

Re. animations, etc., those aren't too hard with lifecycle methods, which, if I understand correctly, Mithril copied from React.

> It's the most simple framework I've ever learned.

Not a framework, but library.

I've been using Vue.js on large scale projects for a while, but for a greenfield project I'm choosing React instead. React has better support for SSR which is still really important for public facing websites, JSX feels much more natural to me than the v-* directives, not to mention React's incredibly large ecosystem. That being said, I really like the way Vue handles CSS in single file components, and the simplicity of Vuex compared to Redux. I'm still struggling to find a styling solution for React that I'm completely happy with. As with everything, it's about choosing the right tool for the job.

> React has better support for SSR…

Mind elaborating on this? I'm about to start a project that will use SSR, and I'm really interested where Vue (which would otherwise be my preference) might limit me.

https://ssr.vuejs.org/en/

https://nuxtjs.org/ is a front end framework with first class support for SSR for VueJS that is almost about to release their 1.0. SSR compatibility was one of the major pillars of VueJS's 2.0 release.

I’ve heard this so many times, and don’t get me wrong I really like Vue, but I’m so surprised people find it easy to learn compared to the others. It wasn’t an uphill battle but I found getting started with vue to be about the same, if not little more overhead, than react, ember, or angular 1, all of which I’ve played with a little.

As someone who knows react very well, is there still a reason to learn Vue? Or is the primary benefit that it's easier to learn?

Maybe for VueJS's smaller size. As for React or Vue, VueJS is simpler, easier to learn, compatible with web components, comes with default router and Vuex redux style store from the core team. So this avoid lots of learning time by new user as to which router to choose, should I learn redux or mobx etc. Typical React/Redux app is full of biolerplate, where VueX is hiding them. VueX also specify a default way of dealing with async, where's in Redux you have many options that could be confusing to new user. There is also bulitin html animation/transition support. Also web dev tools for Chrome and Firefox are from core team.

There are some other benefits like styled components / scoped css available by default and officially supported libraries for routing and global state management.

The one major thing I like about Vue is that I can use it to build widgets in an otherwise serverside app without having a JavaScript build step. All I do is link Vue directly and server-side include files containing the template and code for each component.

It is possible, but not a good option, to also use React without a build step by either skipping JSX (ugly and cumbersome to use) or by using the Babel runtime (large, not really meant for production).

vue feels more like something from dev to dev rather than react which feels big corp large problem great solution.

I love Vue for its flexibility. You can write functional components with explicit dependencies, scoped CSS, and no state. OR you can just drop a CDN file on your webpage and have a bunch of global components.

To me, it's one of the easiest frameworks to teach and maintain.

While I believe React is technically a more correct way to write applications, it can be very heavy-handed. Vue is a great compromise for mixed front-end / full-stack teams.

I agree. In a perfect world React is probably a better choice. But the world is not perfect. I don't have time to investigate a gazillion third-party libraries and educate myself on best practices. Vue is a nice complete package with great documentation and excellent first-party libraries (vuex and vue-router). It's basically a one-stop shop into modern day Javascript. Ideal for smaller teams or teams without JS experts.

I love vue.js because it has made front-end development bearable for someone who has hated web front-end since 1995.

A bit of apples and oranges comparison but writing Vue felt just like first time I wrote Python many years ago: FUN

I write a lot of embedded Javascript (based on Spidermonkey) so I was happy to find that vue seems to make the same decisions I often make in my own code.

I am sure React is great for full time webdev of heavy SPAs but learning curve feels longer, plus the whole framework feels heavier.

I'm using vue, I found while the learning curve is higher than react it was a better choice than react if only because they don't introduce breaking changes into vue so what you write today will not suddenly be painfully out of sync in 12 months. With react while I found it easier to learn its very much a moving target, I found it easier to learn last year. Vue's not breaking changes do make for a larger surface area to learn in terms of the framework, but I have found vuex easier to use than redux.

Which breaking changes? The React team just rewrote the entire core of the library and kept the same API; that’s pretty impressive.

Reply on news.ycombinator.com