Navigation (routing) - leotm/react-native-template-new-architecture GitHub Wiki

RN has no default Navigator like web

React Navigation

If you are getting started with navigation, you will probably want to use React Navigation. React Navigation provides a straightforward navigation solution, with the ability to present common stack navigation and tabbed navigation patterns on both Android and iOS.

react-native-router-flux: this library is based on React Navigation but provides you with a different API to interact with it.

The first declarative React Native router

react-native-navigation (Wix): uses the underlying native APIs on iOS and Android, similar to createNativeStackNavigator. This is a popular alternative to React Navigation and may be a better fit for you if you are trying to integrate React Native into an existing large native app.

If you're integrating React Native into an app that already manages navigation natively, or looking for an alternative to React Navigation, the following library provides native navigation on both platforms: react-native-navigation

React Navigation 6.x, freshly baked out the oven

  • Jan15 NavigatorIOS, native, smooth, limited styling
  • Mar15 (RN Android launch) Navigator, JS, customisable
  • Feb16 NavigationExperimental (fb), low level, customisable, hard
  • Mar16 React Native Navigation (Wix), screens separate registered upfront, JS + some native, not everything pos
  • Jun16 Ex-Navigation (Expo) JS, tabs/drawer/etc, customisable
  • Sep16 Native Navigation (airbnb) beta Easier brownfield integration, screens registered upfront
  • Jan17 React Navigation 4 (community/fb/expo) JS, customisable, screens static API
  • Feb20 React Navigation 5 (community/fb/expo) dynamic API, component-based, hard migration
  • 21 React Navigation 6, screen props, @react-navigation/elements for any app, easier transitions, easier headers, transparent modals, easier nav from outside components (redux), flat nav tree for less nesting (TS, perf, etc), Stack.Group (config, not fragments, good perf, no nesting), renders header by default, Native navigation - native primitives (perf), some default type checking, declare root type (declaration merging), Flipper - React Navigation (Redux Devtools not flexible) and not using Chrome Debugger, migration guide (breaking changes, deprecations, mix v5/v6 pkgs), GitHub Discussions

Example

React Router Native

Declarative routing for React

Quick Start

Navigation

Scene-Based Navigation for React and React Native

React Nonav

Experimental React Native declarative navigation