Working With React Native : Part#1

16 / Jun / 2016 by Shivang Goel 0 comments

Introduction

React is based on JavaScript created by a collaboration of Facebook and Instagram, It was introduced in 2013. Its main focus is to allow developers to create front-end interfaces easily and rapidly. React isn’t a complete framework. It does not offer various components you’ll find in projects based on Ember or Angular JS. Instead, many refers React as just the V in MVC.

React is based on JSX(JavaScript Syntax Extension) that looks similar to XML and that we can mix with normal JavaScript code. JSX is a statically-typed object-oriented programming language, that designed to run on modern web browsers. Being based on XML, it have the advantages of balanced open and closing tags. That can help to make large trees easier to read compared to  function calls or object literals.

React Native is extension of React. By which we can develop Native Applications. Native application development means writing apps for a specific operating system. React Native helps developers to reuse code across the web and on mobile. React Native currently supports both Android and IOS, and it has the potential to expand to future platforms as well, like Tizen TV.

React Native is different a bit from React because we don’t create DOM nodes but real native elements. Therefore, you do not build JavaScript objects that are transformed into divs or spans but native elements like Image, Text or View. Apart from this, they are based on the same principle and expose pretty much same features, which is why the team introduced the idea of “Learn once, and run everywhere”.

Why React Native?

React Native provides the facility to develop for both Android and iOS simultaneously. Instead of targeting the browser, it mainly targets mobile platforms. Similar to React for the Web, React Native applications are written using the combination of JavaScript and XML-esque markup, called JSX. React Native also defines JavaScript interfaces for platform APIs, so that you  can access platform features like the phone camera, or the user’s location in applications based on React Native.

We can easily use native views or components like Native Buttons, Native Activity Call, Dropdown or anything. We can also use the code written in native language. If something looks difficult or impossible to develope using react native, we can write that feature using native language and using some interfaces, we can easily use that native code with react native. This functionality can remove limitations of cross platforms to develop application.

intro-to-react-native-10-638

intro-to-react-native-11-638

Advantages

React Native is based on javascript and JSX and it does not use webview to render UI, like other available cross application development frameworks are using (Like Cordova or Ionic). Those platforms are using combinations of JavaScript, HTML, and CSS. And render application using webview.

Other Cross application development framework comes with drawbacks, especially for performance. Also, they do not have access to the host platform’s native user interface elements. When these frameworks try to imitate native UI elements, the results usually not like native experience. While react native comes with performance and gives native experience to application user interface.

React Native usually translates your markup to real native UI elements, rendering views on whatever platform you are working with. Additionally, It works separately, from the main UI thread, Therefore our application can maintain high performance without sacrificing capability. Life cycle of React Native is same as in React: when props or state change, React Native re-renders the views.

Issues

React Native is not have any IDE for developer till now and debugging is a major concern to work with react native. Debugging with react native is still a horrible task for mobile application development, especially for Android application development.

The biggest issue is probably React Native’s maturity, as the project is still relatively young. It’s still in beta version. Support for IOS was released in March 2015, and Support for Android was released in Sept 2015. The documentation of react native certainly need for improvement.

Some features on iOS and Android still aren’t supported, and the community is discovering the best practices. The good news is that in the vast majority of cases, we can implement support for missing APIs yourself.

Summary

React Native is a framework that enables developers to create robust and quality mobile applications using their existing knowledge of javascript. It offers faster mobile app development with more efficient code sharing across iOS, Android, and the Web, without dropping the end user’s experience or application quality. For more details you can check out official documentation.

FOUND THIS USEFUL? SHARE IT

Leave a comment -