This post for all those people who are working on React Native. It shows a list of 5 top React native components that you can use in React Native.

1.React native vector icons

Customizable Icons for React Native with support for NavBar/TabBar/ToolbarAndroid, image source and full styling.

Perfect for buttons, logos and nav/tab bars. Easy to extend, style and integrate into your project.

>>> Learn more: Here

2. React Native router flux

React Native Router based on new ReactNavigation.org API

Features:

  • Based on latest React Navigation API
  • Separate navigation logic from presentation. You may change now navigation state directly from your business logic code – stores/reducers/etc. navigationStore
  • Built-in state machine (v3 Switch replacement)
    • Each Scene can have onEnter/onExit/on handlers.
    • onEnter/on handler can be async.
    • For ‘truthy’ return of onEnter/onsuccess handler (if defined) will be executed
      • if success is a string then router will navigate to the Scene with that key
    • in case of handler’s failure, failure prop (if defined) will be run.
    • Combining onEnteronExitsuccess, and failure makes patterns like authentication, data validation, and conditional transitions simple and intuitive.
  • MobX-friendly: all scenes are wrapped with observer. You may subscribe to navigationStore (Actions in v3) and observe current navigation state. Not applicable to Redux.
  • Flexible nav bar customization not currently allowed by React Navigation: https://github.com/react-community/react-navigation/issues/779
  • Drawer support (provided by React Navigation)
  • Inheritance of scene attributes allow you to avoid any code/attribute duplications. Adding rightTitle to a scene will apply to all child scenes. See example app.
  • Access to your app navigations state as simple as Actions.state.
  • Use Actions.currentScene to get name of current scene.

>>> Learn more: Here

3. React Native Map

This MapView component is built so that features on the map (such as Markers, Polygons, etc.) are specified as children of the MapView itself. This provides an intuitive and react-like API for declaratively controlling features on the map.

MapView Events

Tracking Region / Location

>>> Learn more: Here

4. Lottie for React Native, iOS, and Android

Lottie component for React Native (iOS and Android)

Lottie is a mobile library for Android and iOS that parses Adobe After Effects animations exported as JSON with bodymovinand renders them natively on mobile!

For the first time, designers can create and ship beautiful animations without an engineer painstakingly recreating it by hand.

>>> Learn more: Here

5. Gifted Chat

The most complete chat UI for React Native (formerly known as Gifted Messenger).

Features

  • Fully customizable components
  • Composer actions (to attach photos, etc.)
  • Load earlier messages
  • Copy messages to clipboard
  • Touchable links using react-native-parsed-text
  • Avatar as user’s initials
  • Localized dates
  • Multiline TextInput
  • InputToolbar avoiding keyboard

>>> Learn more: Here

Compilation by Atom ID @Reactsharing.com