Using react-navigation 3.0 in React Native apps

Source: One Trip at a Time

react-navigation is probably the only dependency I use in React Native apps. I’m happy with it so far, then version 3.0 came out with a few breaking changes. It’s not that big deal but may take us sometime upgrading if we don’t pay enough attention. Here is my exploration and how to overcome the upgrading pains.

React Navigation is born from the React Native community’s need for an extensible yet easy-to-use navigation solution written entirely in JavaScript (so you can read and understand all of the source), on top of powerful native primitives.

The thing I like about react-navigation is its thorough documentation, easy to customise APIs and very nifty to use. It solves almost all basic needs.

React Navigation

This is the first release where React Navigation depends on a native module outside of React Native core: it now depends on react-native-gesture-handler. This library provides an excellent set of primitives for leveraging the operating systems’ native gesture APIs and has enabled us to fix a variety of issues with stack and drawer navigators.

I like to read source code, and I was surprised to see that react-navigation is all pure Javascript code.

module.exports = {
  // Native
  get createAppContainer() {
    return…