Awesome React Native Libraries

...For a Happy Life

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

Made with Slides.com