Angular 7 vs React

Angular is a fully-fledged MVC framework, while React is simply a JavaScript library. This post compares what each one gives you, what you need to learn, and when to choose which.

What you get out of the box

Angular provides

• Templates, based on an extended version of HTML
• XSS protection
• Dependency injection
• Ajax requests via @angular/http
• Routing via @angular/router
• Component CSS encapsulation
• Utilities for unit-testing components
• @angular/forms for building forms
• "Write once, run everywhere"

React provides

• JSX, an XML-like language, instead of classic templates
• JavaScript
• XSS protection
• No dependency injection
• fetch for Ajax requests
• Utilities for unit-testing components
• "Learn once, write anywhere"

Technical differences between Angular and React

Topic	Angular	React
DOM	Regular DOM	Virtual DOM
Templates	HTML	JSX
State management	No Redux needed	MobX or Redux
Data binding	Two-way	One-way
Language	TypeScript	JavaScript / Flow
Mobile solution	Ionic	React Native
Learning curve	Steeper	Gentler at first

Learning curve

A significant step in choosing a new technology is to examine its learning curve and decide whether it fits your previous experience.

In React, you need to know

• JSX
• How to write components
• How to manage internal state
• How to use props for configuration
• A routing library (React doesn't come with one)
• State management with Redux or MobX

In Angular, you need to know

• Directives
• Modules
• Decorators
• Components
• Services
• Dependency injection
• Pipes
• Templates
• Change detection
• Zones
• AoT compilation
• RxJS

Companies using them

Many.

Angular reduces complexity in large applications

TypeScript has been used in Angular from the start. It can now be used in ReactJS too, which helps reduce errors in React apps.

For example, to create a hello-world app with TypeScript, run one of the following commands:

npx create-react-app helloworld-app --template typescript
yarn create react-app helloworld-app --template typescript

The component file extension becomes .tsx, and there is a new concept, React.FC, which stands for React Function Component.

However, the bigger a ReactJS application grows, the more complex it becomes. So if you need to build a web UI where new features are added continuously, you should consider Angular 7 or above. For large-scale web applications, Angular helps keep that complexity under control.

References

• https://kruschecompany.com/blog/post/angular7_vs_react
• https://kruschecompany.com/reactjs_development