Getting started with react-native

What is react native

If you are just getting started with React I suggest reading those blogs in Addis Software website Getting started with react.js and also hooks

---

React native is a new way of putting your ideas to people’s hands in a short time. chances are If you are a developer, you already are familiar with javascript or could be an expert with it.

well, mobile development wasn’t easy for everyone. we use to struggle even to set up the environment rather than finishing the application in a given time. All that struggle looks to bear fruit, peoples irritation seems to build the greatest pain killer in mobile application development history, here it goes, drum roll please, ‘REACT-NATIVE‘.

React native has shifted the way we used to look at mobile application development. It has shifted our focus from learning the language to building an awesome experience for our users with the most known or famous language on the planet Javascript.

yes you heard it right Javascript is the most known and famous language on the planet according to StackOverflow, sorry if I crashed your python or c++ or PHP or java fantasies.

Here it is important to know that react-native apps are not browser-based like PhoneGap or Cordova. instead, these apps are written in javascript and rendered in native UI but still, the logic of the app is running in javascript. That means you have good performance but you have less than native performance. which is what we want for most apps. But here its good to note you have to choose frameworks according to its pros and cons according to your app you are building. If you want a very performant app its better to choose other frameworks like Flutter or native codes.

Your very first React Native App

setting up the development environment for React Naive might be a little bit of a hassle for some people. I suggest strictly following the docs at the Official react-native website

with that being said let’s go ahead and start our react native app

$ npx react-native init OurFirstAwesomeApp
//this will start the app template for you

With the code above react-native, CLI will give you the basic boilerplate for your app.

after that what you want to do is change the app.js to reflect your changes in your new app

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

function App() {
   return (<View>
           <Text> hello world from react-native </Text>
          </View>);
}

export default App;

As you can see from the above code, we have written a very similar code with react.js. in the above example the only difference being we have used View and Text instead of HTML tags.

As we have discussed before in React-native the UI is converted to Native UI, which is a great thing because it gives you the native speed and also enables you to give instant feedback.