React.js architecture

In contrast to Angular, React.js implements the Flux pattern hollistically. Following is a router-centric view of a React application, where components/containers and providers are represented in a strict tree-like manner.

Figure 1.19: React.js architectural overview

In the initial releases of React, one had to laboriously pass values up/down the inheritance tree of every component for even the most basic functionality to work. Later, react-redux was introduced, so each component can read/write values directly to the store without traversing the tree.

This basic overview should give you a sense of the significant architectural differences between Angular and React. However, keep in mind that just like Angular, React’s community, patterns, and practices are continually evolving and getting better over time.

If you dig simplicity, check out Vue. It. Is. Simple. In a good way: https://vuejs.org.

You can learn more about React at https://reactjs.org.