React Native!!! Something that devs would love to have in their Quiver

React Native-Hybrid Application development

Hello readers,I am here with something new that might interest you.
So let's start with it.Android and iOS have completely different codebases and startups and businesses often struggle to hire - or afford - engineers for both. But with React Native, just one developer can write across different mobile operating systems.

Isn't it great?? So let's start with brief introduction to "What React Native is and How will it help"




React Native is an Open Source JavaScript library used for rendering mobile applications for android and iOS as well.It is introduced by Facebook to target mobile platform to provide ease in rendering UI components.React Native provides re-usability of code which induces faster development.React Native applications are written using a mixture of JavaScript and XML-esque markup, known as JSX.Before one starts with React Native,it is mandatory to have knowledge of Javascript and HTML(for mobile developers).

How to start?

To start with react native,we need following things ready with us:
1.NPM
2.Node JS
3.React Native

What is NPM?

npm(Node Package Manager) is a command-line tool for interacting with a huge repository of Node.js projects.NPM provides features of installing and managing different node programs and Javascript packages, such as Angular.js, Express.js, and many others. NPM has many different tools for maintaining your Node.js environment.

#Piece of Information

As part of npm’s core, it has the npm run-script command (npm run for short). This command dives into your package.json and pulls out the scripts Object. The first argument passed to npm run refers to a property in the scripts object - it will execute the property’s value as a command in the operating systems default shell

Execute following on terminal to install npm tool:

sudo apt-get install npm

Check version of npm,if you have already installed:

npm -v

What is Node JS & it's Role?

Node.js is an open-source server side runtime environment built on Chrome's V8 JavaScript engine. It provides an event driven, non-blocking (asynchronous) I/O and cross-platform runtime environment for building highly scalable server-side application using JavaScript.Node.js makes it possible to write applications in JavaScript on the server.
Node.js can be used to build different types of applications such as command line application, web application, real-time chat application, REST API server etc. However, it is mainly used to build network programs like web servers, similar to PHP, Java, or ASP.NET.
Run following on terminal to install Node JS:

React Native

React native provides a platform that can support multiplatform apps development with single codebase. React Native is like React, but it uses native components instead of web components as building blocks.Being a mobile developer,If you want to start with React Native,One should have in-depth understanding of Core DOM(document object model).This will help one to have a basic understanding to start with Javascript. Honestly,being an OOPs kid,it took vigorous effort to learn about DOM and Javascript.


Basic Structure for JSX understanding

React Native Tools

Facebook community has provided following tools to provide an ease to start with development.

1. Expo
2. Create React Native App

Expo is a collection of tools that make it easier to code React Native apps. In this tutorial, I'm going to show you how you can quickly create React Native apps using Expo.With Expo, developers can create React Native apps without all the frustrations that come with installing and configuring software dependencies such as Android Studio, Xcode, or all the other tools which are needed to develop and run a React Native app. 

 Expo on browser

Expo provides ,much more, than expected live preview of your code and editor to make changes.
To have a preview of your code:1.Open Expo Client on your device.
2.Use it to scan the QR code printed by exp start.

You may have to wait a minute while your project bundles and loads for the first time.


Create React Native App is the easiest way to start building a new React Native application. It allows you to start a project without installing or configuring any tools to build native code - no Xcode or Android Studio installation required.

Add following to your command line directed to your react workspace:

$ npm i -g create-react-native-app
$ create-react-native-app react-project
$ cd react-project
$ npm start

I hope this information helps someone and proves useful for the beginners with React Native.

What am I missing here? Let me know in the comments and I'll add it in!

Thanks for reading.