Note: It’s worth mentioning that it’s really hard to compare these two JS frameworks since Angular 2 is a rich framework while React is just a UI component library.
Let’s begin with the characteristics of each framework:
Angular 2 is all about components. Imagine you wanted a weather module in the corner of your page that always gave the current weather info. In Angular 2, this would be a Weather component made up of Decorators and a Controller Class. The pieces of our page components can talk to each other creating a complex web app with simple singular pieces. Angular development has versatile capabilities. It comes with everything you need to build an app, including form handling, a router, an HTTP client for syncing with back-end servers/databases, and tools for writing unit and performance tests. It follows a more traditional MVC flavored pattern where models and views talk to each other both ways. Flux uses its own unique approach of only allowing data between objects to flow in one direction. Google used Angular 1 for the YouTube app for PS3. Angular 2 is used on many websites such as PayPal and VEVO.
Documentation is a bit poor
Hard to find resources (very different from Angular 1)
Easy to test
Most popular framework
Framework approach (all in one)
React’s main purpose is to update views the user is seeing to reflect the current state of data stored in the application. It does this using a virtual DOM. React can be combined with Flux or Redux, which is a suggested data architecture pattern where communication between the parts of an application are one direction only. In this case, React handles your views and Flux manages the business logic. Facebook boasts that the advantages of this one-way approach are that it supports a simpler mental model that other developers who look at the code can understand, it is easier to track down bugs, and makes it easier to create meaningful unit tests. React alone is not a framework. It doesn’t provide support for routing or syncing to a back-end server. To do these things, you must combine React with another library or framework like using React with Backbone or React with jQuery AJAX. Facebook uses React+Flux in their Instagram website and in Facebook’s chat feature.
Flux architecture is not what people are used to
JSX (it’s not required but it is commonly used in React)
Library approach (pick what you need)
You can say that entry barrier depends on what you choose at the beginning of your adventure with both languages. In React development it’s about the libraries you choose and in Angular 2 — whether you pick TypeScript or not. Angular 2 may seem to be more demanding than React at first because the number of new concepts that you have to get good at will probably be higher, but it may be a huge advantage in the future to know this all-in-one tool that Angular 2 definitely is. React is a UI library that is built to do one thing only, but it does this pretty well. It can be combined with other libraries to become a complete Framework. Angular 2 already is a complete framework (all-in-one solution) for building front-end driven web apps.
When it comes to starting (saying hello) with Angular 2 it definitely takes a little longer, but it may be easier to have an idea of what we need to set up and how components are interacting. If you have some experience in Java or .NET it will be easier for you to build a happy relationship with TypeScript. The framework itself is rich in topics to learn, starting from modules, dependency injection, decorators, components, services, pipes, templates, directives, and more advanced like change detection, zones, AoT compilation, and Rx.js.
Check it before…
…you start working on a project and pick your JS framework. There are a few matters that are worth thinking through from a perspective of your project. These are:
• Size of the project
• Maintenance time
• Target platforms (web, mobile, desktop)
• Team size
• Developers experience
• Scoop of functionality definition
Depending on your final thoughts on each and every matter above, you should use what you already know about each framework and decide which one fits best. Both have some good and bad sides so it depends what kind of project you’re in and what are your coding habits and preferences. If you are looking for people’s opinions, remember to ask if they tried both frameworks. The view really changes after using both heavily for a while.
If you love the tech choices and you can live with the additional boilerplate overhead, pick Angular 2.
If you’re unhappy with Angular 2 tech choices, and you want something simpler, with more freedom and fewer things imposed — pick React.
What I’ve observed and learned while reading different opinions about these two frameworks is that at first many people think that Angular 2 is better because it will be easier to cover big projects. However, they admit that starting with React, where you have a simple app from the very begging of its tutorial is faster. Surprisingly, lots of people who talk about differences between these two never tried them both for a longer time. I noticed that people who use the two frameworks actively for some time were starting to appreciate React more. Still, never imagined deleting Angular 2 from their list. Having said that, my last advice is: try them both! Don’t blindly use the same approach every time. Once you have some experience in both, you’ll be able to choose when it’s necessary to use one or another.