Shaping up with React Native

INTRODUCTION

React Native is a framework for cross-platform mobile app development for iOS and Android. If you want to save time, money, and staff resources significantly, then React Native is the ideal business solution. This progressive technology provides traditional and modern methods of hybrid mobile app development.

BENEFITS

For several years of work, the framework was used in world-famous apps such as Skype, Instagram, Airbnb, Walmart, SoundCloud Pulse, UberEats, Tesla, Tencent QQ, Baidu Mobile, and many others.

Why such popularity? Let’s gets started with their benefits.

  • It  allows performing development faster and  Therefore, It costs less.
  • It Provides Cross-Platform. It means that it’s possible to get an app for two platforms at once — iOS and Android.
  • Focus on UI and Access to Native API out of the Box
  • Single Code Base for iOS and Android.It means that a single code base is deployed to
  • multiple mobile operating systems. Components are reused anytime at any level into existing code without you rewriting it and recompiling the app.
  • Compatibility of 3rd Party Plugins, Smoother Running, and Less Memory Needed

Starting with EXPO

  1. Install Node.JS
  2. Install expo cli
   npm install expo-cli --global
  1. Create your react native project
  expo init my-new-project

You will be asked to choose a template. Press Enter to choose Blank.

 Press Enter to choose Blank.

  Input your App Name

  1. Run your react native project
cd my-new-project
expo start

You should see something like with a QR code generated in the terminal.

Running your Application

This step will be divided into two: Android & iOS part.

  1. Android

Click here to download the Expo client app to your Android device.

Open Expo then click the “Scan QR Code” and Scan the QR code in our terminal.

As soon as the QR code got scanned, it’ll automatically load and bundle/compile your project to run it in your device.

  1. iOS — iPhone

Click here to download the latest Expo client app to your iOS device.

With iOS 11, there is now a scan feature added to the camera. We can use this to scan the QR code and open the Expo client app.

Open up your camera app, then scan the QR code in our terminal until a notification badge pops on top telling us that we can open it in Expo client. The QR Scan has been removed in Expo for iOS

However, if you’re not in iOS 11, there’s still an alternative way but not with scanning:

— Open your Expo client app and sign up/login.

— Open another new tab in your terminal and navigate to your react-native project directory and run.

cd my-new-project
expo send -s emailyou@usedinexpo.com

use the email that is logged in your expo app.

This will send an email to you with the link, clicking this link will open the app in expo. Then it’ll have your project up and running on your iPhone.

That’s it! you got your react-native running in Android/iOS devices. You can read about basic component and communication in my next blog.