What is React?

What is React?

ReactJS is a component based library (not a framework!!)which is used to develop interactive UI’s interfaces specifically for single page applications. Currently, it is the most popular front-end JavaScript library. It deals with View in the MVC(Model - View -Controller). So, if you are dealing with the applications where data keeps on changing in real time, you should go for React. It’s used for handling view layer for web and mobile apps. React also allows us to create reusable UI components. React was first created by Jordan Walke, a software engineer working for Facebook. React first deployed on Facebook’s newsfeed in 2011 and on Instagram.com in 2012.It was open-sourced at JSConf US in May 2013

React allows developers to create large web applications which can change data, without reloading the page. The main purpose of React is to be fast, scalable, and simple. It works only on user interfaces in application. This corresponds to view in the MVC template. It can be used with a combination of other JavaScript libraries or frameworks, such as Angular JS in MVC.

Single Page Application vs Multi Page Application:

SPA (Single Page Application):

A single-page application is an app that works inside a browser and does not require page reloading during use. You are using this type of applications every day. These are, for instance: Gmail, Google Maps, Facebook or GitHub.
 SPAs are all about serving an outstanding UX by trying to imitate a “natural” environment in the browser — no page reloads, no extra wait time. It is just one web page that you visit which then loads all other content using JavaScript — which they heavily depend on.

MPA (Multi-Page Application):

Multiple-page applications work in a “traditional” way. Every change eg. display the data or submit data back to server requests rendering a new page from the server in the browser. These applications are large, bigger than SPAs because they need to be. Due to the amount of content, these applications have many levels of UI. Luckily, it’s not a problem anymore. Thanks to AJAX, we don’t have to worry that big and complex applications have to transfer a lot of data between server and browser. That solution improves and it allows to refresh only particular parts of the application. On the other hand, it adds more complexity and it is more difficult to develop than a single-page application.

Virtual DOM vs DOM:

DOM:

Just to get things straight - DOM stands for Document Object Model and is an abstraction of a structured text. For web developers, this text is an HTML code, and the DOM is simply called HTML DOM. Elements of HTML become nodes in the DOM.

Virtual DOM:

The virtual DOM (VDOM) is a programming concept where an ideal, or “virtual”, representation of a UI is kept in memory and synced with the “real” DOM by a library such as ReactDOM. This process is called reconciliation.

This approach enables the declarative API of React: You tell React what state you want the UI to be in, and it makes sure the DOM matches that state. This abstracts out the attribute manipulation, event handling, and manual DOM updating that you would otherwise have to use to build your app.

React vs Angular:

Angular is a full framework with all the tooling and best practices designed on top of it. Suits ones, hate the others. React on the other hand is just a small view library that you would need while making an app. This might be both good, and a bad thing and the article should help you to finally make the right choice.

Why choose Angular?

Angular is a JS framework for front-end development. It’s the second version of the product that is supported by Google. The first version known as AngularJS was accused of redundant complexity. So nearly all of its concepts (modules, controllers, scopes, directives, etc.) were replaced in the Angular 2, aka Angular. Angular received some new features, as well, such as native app support and server-side rendering.

Reasons for Angular popularity:

• It’s Google’s product which means a lot in terms of the trust;
• Developers can adapt to it without any troubles;
• The code looks really simple;
• Apps developed with Angular are highly customizable and interactive;
• Angular ensures advanced testing features and Model-View-Controller balance.

Why choose React?

React or ReactJS is a JS-based library with a JSX compiler, which is focused on reusable UI views components in user interfaces. Be careful with terms: React is not an MVC framework, it’s an open-source library for views rendering. UIs created with React are highly responsive and load smoothly.

Reasons for React popularity:

• The library is strongly supported by Facebook;
• Solutions based on React are SEO-friendly and perform well;
• React is a flexible library.

Library vs Framework:

The key difference between a library and a framework is “Inversion of Control”. When you call a method from a library, you are in control. But with a framework, the control is inverted: the framework calls you.

A library is just a collection of class definitions. The reason behind is simply code reuse, i.e. get the code that has already been written by other developers. The classes and methods normally define specific operations in a domain specific area.

In framework, all the control flow is already there, and there’s a bunch of predefined white spots that you should fill out with your code. A framework is normally more complex. It defines a skeleton where the application defines its own features to fill out the skeleton