React VS Vue: the ecosystem

React VS Vue: the ecosystem

·

3 min read

I've recently made the switch to Vue as my current favorite front-rendering framework.

Vue taking the first spot in my heart is mostly related to one thing: its ecosystem.

I mean both frameworks are doing their jobs at rendering pretty efficiently and both have a strong, productive community that keeps adding extra awesome resources to both Frameworks. They are also both evolving often, and are used in many production environments.

To me, the biggest difference between those 2 frameworks lies in what goes around them.

Let's talk React first

React is an awesome framework, no arguing that. Its biggest strength (beside its performance and its quick evolution cycle) is that you can quickly find any kind of resources (packages, documentation, examples ...) you may need for your projects.

React is a framework that got so popular that a million things got out of it.

But the thing that apparently wasn't a focus for the React team (and is also a side-effect of the way it is designed) is uniformity among the community. There are sure some general guidelines and official tutorials, but its an overall very loose environment in terms of consistence.

And by consistence I mean across documentation/development tools/internal packages. Let's review them.

Documentation

It may sound silly, but one of the biggest strength of Vue compared to React is the way it handles documentation.

In a similar fashion to Go, Rust or many other languages/frameworks handle their documentation, Vue has an official documentation system: VuePress.

Reading a documentation when it has been generated using the same page layout, navigation system and way of presenting its content is so much more efficient for my mind. I wish React has also produced such a tool internally.

Internal packages

This is where Vue really outpace React. Vue has directly thought to create internal "Fundamentals" packages that are required in most applications that will be developed with it.

Vue-router is a good example. The fact that React has no official router still surprises me. It is good to let your community create additional tools, but also having an official consistent vision is important.

Same goes for VueX, the official package of Vue for Flux-like data management. It is directly integrated and easy to add to any Vue project, and that is very pleasing !

But that doesn't end there. When you take into account the developments tools that have been directly designed to include those fundamentals packages, it becomes even more awesome.

Development tools

I simply love the VueJS Devtool. It is beautifully designed, and even more, it directly integrates the 2 packages I was talking previously, Vue-Router and VueX. Coming from a world where you need to have both Redux Devtools and React Devtools (with no tool for React-Router at all), this feels really smooth, as everything seems to be coming together.

Screenshot 2020-05-03 at 18.08.35.png

I really love this interface, mixing in the same place Vue's event system, its routing system and its state system. Simply awesome.

Closing note

Of course, all the things I've said above are also present in the React ecosystem (Redux, React-Router, and many other incredible frameworks). But the fact that the Vue community seems to be a bit more "unified" is appreciable to someone obsessed with consistency like me 🤭.