Riaz Virani

Fun Fact: Riaz means "land with beautiful grass and flowers"

Ruby, Rails, React

What is React Native?

It's AWesome

• Write Mobile Apps Using React and JS
• Native App Performance (Essentially)
• Significant Community Support

But

Like

React...

NoT Included...

• Navigation / Routing 
• UI Library / Styling
• State Management
• Deployment
• Configuration Management
• Mapping
• Notifications
• ...

Navigation / Routing

NavigatorIOS

NavigatorExperimental

AirBNB Native Navigation

Wix React Native Navigation

ExNavigation

Navigator

React Navigation

React Native Router Flux

React Router

Ex-Navigator

React Navigation

• Used by Expo and Create React Native App
• Recommended by FaceBook
• Follows Native Conventions for Stack-Based Navigation
• All JS-Based

UI Components / Styling

Got CSS?

Contenders

• Nachos UI
• NativeBase
• ShoutEm
• React Native Elements
• React Native Material Design
• React Native Material Kit
• Teaset

React Native Elements

• Great Documentation and Ease of Use
• Continuously Updated
• Fewer Elements Compared To NativeBase

State Management

Redux

• Well...it's just like React...
• Use Redux, MobX, or just React State if you'd like

Deployment

ExPO

• Wraps React Native into a Custom Build, Test, Deploy Process
• Similar in some sense to Create React App
• Builds in the Cloud
• Mac Not Needed
• Only supports limited Native interactions

CodePush

• Allows Deploy Without App Store Approval
• Force Updates Without User Installation
• Only Works with JavaScript Changes
• Free Microsoft Service
  (It's OK. They're cool now.)

Configuration Management

React Native Config

• Allows sourcing of secrets from .env file
• Works in JS, iOS, and Android Layers
• It's amazing!

Mapping

React Native Maps

• Pretty much your only great option...
• Very well supported by AirBNB
• Works with both iOS and Google Maps

Notifications

React Native Onesignal

• Easiest integration for mobile notifications
• Completely free and unlimited

Cool Stuff

React Native Snap Carousel

• Just greatness...

React Native Bugsnag

• Captures errors in both the JavaScript and Native Layers
• Has a Free Tier
• Can also use Sentry

react Native Video

• Renders and plays videos from local filesystem or URL
• Well-supported
• Requires native linking

React Native Background Geolocation

• Handles ongoing geolocation (for a Google Maps type application)
• iOS is free but Android plugin is $300 one-time
• Very good customer support

Questions