I know there are already many answers to it but after reading all these I believe there is still room for explanation.

**React**

**React = Vaila JS + ES6 + HTML + CSS = JSX = Web Apps(Front end)** 

So let's talk about **react** first because **react-native** also based on **react** and the same concept of JS is been used there.

React is a **JS** library which is used to make **beautiful, flexible, performant** **single page web applications**, So now a question will appear in your mind what is **single page web app**.

**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.
SPA requests the markup and data independently and renders pages straight in the browser. We can do this thanks to advanced JavaScript frameworks like AngularJS, Ember.js, Meteor.js, Knockout.js, React.js, Vue.js.
Single-page sites help keep the user in one, comfortable web space where content is presented to the user in a simple, easy, and workable fashion.

**How it works**

Now you know what is SPA, So as you know it's a web app so it will use HTML elements for running into the browser and also used JS for handling all the functionality related to these elements.
It used **Virtual Dom** to render new changes in the components. 


**React-Native**

Now you have a bit of an idea about **react** so let's talk about **react-native**

**React-Native = React (Vaila JS + ES6 + Bridge between JS and Native code) + Native(IOS, Android) = Mobile Apps(Android, IOS, also supported web but have some limitations)**


React-Native used to make beautiful cross-platform mobile apps(Android, IOS) using React.

**How it works**

In React-Native there are two threads.

 1. JS Thread

 2. Native Thread

JS thread performs all of the calculations and passes data to native, How?

**React uses an Async Bridge to pass data to Native thread in JSON format is called react-native**

So we use Native components for making a presentational view in react-native and use that bridge to communicate between these two different worlds.

Let's talk about the common and differences between these two frameworks.


 |---------------------|------------------|---------------------|
 | Feature | React | React-Native |
 |---------------------|------------------|---------------------|
 | Platform | Web | Android, IOS, JS |
 |---------------------|------------------|---------------------|
 | Open Source | Yes | Yes |
 |---------------------|------------------|---------------------|
 | Presentational View | HTML + CSS | Native Components |
 |---------------------|------------------|---------------------|
 | Arichtecure | Virtual Dom | Virtual Dom + Bridge|
 |---------------------|------------------|---------------------|
 | Animations | CSS Animations | Native Animations | 
 |---------------------|------------------|---------------------|
 | Styling | CSS | JS Stylesheets |
 |---------------------|------------------|---------------------|
 | Developed By | Facebook | Facebook |
 |---------------------|------------------|---------------------|