DEV Community

Cover image for React VS React Native : Basic Understanding
DSachin
DSachin

Posted on

React VS React Native : Basic Understanding

React Vs React Native

If you are working in the field of software development field, you must have heard the terms React and React Native. Most of the developer get confused at startup between them due to similar names. Some might even think React Native as new version of React with some new additional features. Lets get a clear on these two terms and their actual features and where it is used in the field of software development.

Everybody must have heard or know about Facebook. Facebook is the one who developed React and React Native. React and React Native have the relation like parent and child. React JS is a JavaScript library which is used for mostly on the single page website. Single Page web application contain only one single page and all the contents needed are included there. Whereas, the React Native is like a child of React JS means its an React JS based Framework. React Native is developed to design and develop native mobile apps. Both are being used widely in software development.

React

React JS is an open source JavaScript library used for the UI/UX design for the websites and made publicly available in 2013. WhatsApp, Facebook, Netflix are some of the popular sites which are build in React JS. React is popular in creation of dynamic UI.

React JS use virtual DOM ( Document Object Model ) features which makes sites performance faster. Virtual DOM is actual copy of our web site DOM. Whenever there is changes to implement, react does not re render all the codes, it simply render the DOM that has been changed. It just re use components and styles for faster performances. Unlike other web application development platform, React JS can design and develop the application with minimal use of code. Due to its one way binding features for data functionality, it creates minimal chances of errors. It support real time change while developing the app means we can view the changes in apps instant after the code change. We do not need to refresh the browser. React app consist of list of components. These components are reusable in other projects which saves development time.

React use JSX to built UI components. The browser cannot read the JSX codes directly. It requires the transpiller to convert the JSX code to JavaScript code. We use Babel compiler to transform the JSX to browser readable JavaScript tags.

React Native

React Native is open source React JS framework. It simply inherit the features of React JS. Like React, React Native is preferred to make UI component for mobile apps. It is used to design and develop native mobile applications for IOS, windows and Android devices. Before React native, developers needs to code separately for different device in their native language like Swift for IOS, Kotlin and JAVA for android. For different platforms, separate apps are developed in their native programming language. Now due the cross platform functionality of React Native, the app works on both IOS and android with same code. If there are some features that are platform specific then we can also do that which won’t affect on app performance. React Native have libraries and reusable component which reduce development time.

Without any knowledge of native languages like JAVA an Swift, we can easily build the app. But there are some features that require native code involvement in app for which library could not be found like integration of payment provider. For such condition we use the layer called bridge. This layer allows the interaction between the Native codes and JavaScript. In the React Native app we can find the platform specific directory. Through these directory we add platform specific native codes and the actual bridge process takes place.

Conclusion

Both React and React Native gives us robust, faster and dynamic UIs. Learning React JS library and its working mechanism will automatically helps in understanding React Native framework. Developers can easily shift from web to mobile app development and vice versa.

Top comments (0)