First look: React Native NavigationExperimental Part 1

Nader Dabit
React Native Training
5 min readMay 9, 2016

--

NavigationExperimental is no longer the preferred method of Navigation in React Native, and will soon be deprecated. I would suggest checking out React Navigation with is the current standard and my preferred method of navigation.

For a closer look at NavigationExperimental, check out NavigationExperimental In Depth.

To see part two, an implementation with redux, click here.

To see part three, an implementation with tabs and redux, click here.

The React Native project is no longer maintaining the Navigator component, and is instead transitioning to Navigation Experimental. Here, we will look at how to build a basic app navigation using the new api.

The link to the final repo is here.

The link to the working example on RNPlay is here.

This tutorial uses version 0.28.0 or later. Earlier versions will not work.

To get started, let’s create a new project, and in that project we will create a couple of Components that we will be navigating to and from (Home, About, Contact) as examples:

react-native init RNExperimental

Once in the project, let’s open index.ios.js or index.android.js and set up our components. Notice we are only…

--

--

Nader Dabit
React Native Training

Full Stack Product Engineer, Author, Teacher, Director of Developer Relations at Avara