React Native - First React Native Project

What Is React Native? 

react Native is a cross-platform mobile development framework written in JavaScript. react Native is a JavaScript framework for writing real, natively rendering mobile applications for iOS and Android. It’s based on React, Facebook’s JavaScript library for building user interfaces, but instead of targeting the browser, it targets mobile platforms. In other words: web developers can now write mobile applications that look and feel truly “native,” all from the comfort of a JavaScript library that we already know and love. Plus, because most of the code you write can be shared between platforms, React Native makes it easy to simultaneously develop for both Android and iOS.

Advantages of React Native

1) Saves Time and Money. ...

2) Great Performance. ...

3) Increased Flexibility. ...

4) Moveable. ...

5) Immediately View Changes. ...

6) Publish Updates for Your Apps Faster. ...

7) Augmenting an Existing App.

The fact that React Native actually renders using its host platform’s standard rendering APIs enables it to stand out from most existing methods of cross-platform application development, like Cordova or Ionic. Existing methods of writing mobile applications using combinations of JavaScript, HTML, and CSS typically render using web views. While this approach can work, it also comes with drawbacks, especially around performance. Additionally, they do not usually have access to the host platform’s set of native UI elements. When these frameworks do try to mimic native UI elements, the results usually “feel” just a little off; reverse-engineering all the fine details of things like animations takes an enormous amount of effort, and they can quickly become out of date.

the Basics

React Native is like React, but it uses native components instead of web components as building blocks. So to understand the basic structure of a React Native app, you need to understand some of the basic React concepts, like JSX, components, state, and props. If you already know React, you still need to learn some React-Native-specific stuff, like the native components. This tutorial is aimed at all audiences, whether you have React experience or not.

First Project

Hello World

Example usage

import React from 'react';

import { Text, View } from 'react-native';

const HelloWorldApp = () => {

  return (

    <View

      style={{

        flex: 1,

        justifyContent: "center",

        alignItems: "center"

      }}>

      <Text>Hello, world!</Text>

    </View>

  )

}

export default HelloWorldApp;