Key Points

1. The main difference is that ReactJs is used to make websites, whereas React Native is used to make mobile applications. ReactJS is a tool you add to your website, whereas React Native is used to build your mobile apps from the ground up.

References

Key Concepts

React vs React Native

https://www.cognitiveclouds.com/insights/what-is-the-difference-between-react-js-and-react-native/

React

1. React or ReactJS is a JavaScript library responsible for building a hierarchy of UI components or in other words, responsible for the rendering of UI components. It provides support for both frontend and server-side in Web apps
2. rendering of your pages completely, from the server to the browser will improve the SEO of your web app.
3. You can reuse code components in React JS
4. React, it is easily readable.Many frameworks require you to learn an extensive list of concepts which are only useful within the framework. React strives to do the opposite

React Native

1. React Native is a framework for building native applications using JavaScript. React Native compiles to native app components, which makes it possible for you to build native mobile applications. In React JS, React is the base abstraction of React DOM for the web platform, while with React Native, React is still the base abstraction but of React Native. So the syntax and workflow remain similar, but the components are different.
2. React Native comes with Native Modules and Native components that improve performance. Unlike Cordova, PhoneGap, and other cross-platform frameworks that render code via WebView, React Native renders certain code components with native API’s.
3. React Native comes with all the advantages that React.js brought you. React.js focuses on a better UI, so those benefits remain.
4. You don’t have to build the same application for iOS and Android, separately as React Native allows your developers to reuse the common logic layer.
5. React Native’s component-based structure allows developers to build apps with a more agile, web-style approach to development than most hybrid frameworks, and without any web at all.
6. If you know JavaScript, React Native will be easy to pick-up, allowing most front-end web developer to be a mobile developer. All you need to know is JavaScript, platform APIs, some native UI elements, and any other platform-specific design patterns and you’re set.
7. React Native is all about bringing high speed, responsiveness, and agility of web app development

React Native is an entire platform allowing you to build native, cross-platform mobile apps, and React.js is a JavaScript library you use for constructing a high performing UI layer. React.js is the heart of React Native, and it embodies all React’s principles and syntax, so the learning curve is easy.

React is rendered through Virtual DOM while React Native uses Native API’s to render components on mobile. React uses HTML and with React Native, you need to familiarize yourself with React Native syntax. React Native doesn’t use CSS either.

Learning React vs React Native

https://www.quora.com/What-are-five-differences-between-React-js-and-React-Native

I think a better way to phrase this would be: “What is the difference between building web applications and mobile applications using React?”

Why do I say that? Because React Native is a consequence of React (the library). You are still writing React code, but the framework you are using (React Native) offers additional functionality to run your app on iOS or Android. If you know React, you already know most of React Native.

I am not an expert on either, but I will try to point out some core differences between writing code for web and mobile using React:

1. There is no HTML or CSS in React Native. You can’t use tags such as ‘div’ and ‘p’ to organize your content. You can’t include .css files.
   However, React Native provides alternate ways to do the same things. Components replace tags and you have to write your styles in JavaScript files. For example, ‘text’ replaces ‘p’ and ‘background-color’ becomes ‘backgroundColor’ to follow camel case convention we use in JavaScript.
2. Since there is no CSS, you can bid farewell to CSS animations. You can use React Native’s Animated API for animations.
3. Since you aren’t building on the web, there is no web inspector.
   You can’t test something in your browser before making changes to your code because there is no browser. You have to make changes to your code directly and React Native reloads the application for you.
4. Since you can’t test your app in the browser, you will need to have a emulator running. If you are building for both Android and iOS, you need Android Studio and XCode.
5. Instead of routing to different web pages, you are navigating between different scenes of your application when you use React Native. You will have to use Navigator (or NavigatorIOS for iOS) component provided by React Native for that.

And then there is all the typical stuff involved in getting your app published on respective stores that you don’t have to deal with while building for the web.

To sum it up, if you have been working with React for some time, say 6–8 months, you will have no trouble in picking up React Native. If you haven’t, I suggest you first try out React by building one or two medium sized apps.

These two are not fundamentally different, so your experience in writing a web application will count. Once you have mastered both, you can create apps which not only look nice in the browser, but behave just like native apps on mobiles with a little work.

Potential Value Opportunities

Potential Challenges

Candidate Solutions

Step-by-step guide for Example

sample code block

Recommended Next Steps

Related articles