React Native, v2

Navigation Intro

React Native, v2

Check out a free preview of the full React Native, v2 course

The "Navigation Intro" Lesson is part of the full, React Native, v2 course featured in this preview video. Here's what you'd learn in this lesson:

Kadi introduces the two main navigation libraries, the React Navigation library and the React Native Navigation.React Native Navigation used to be more performant, but now both libraries perform similarly.

Preview
Close

Transcript from the "Navigation Intro" Lesson

[00:00:00]
>> So in our app, the next thing we'd really want to do is add navigation to our app. And what we would like is, we'd like to have multiple color palettes that we can choose from. And we would like when you press on the color palette, we would like to open a new screen where we can display the details of the color palette.

[00:00:15]
That's basically what we want to get to. So in order to do that, we need to add navigation into our application. You might be surprised to learn that React Native actually has no navigation built in. You get nothing from default, you have to use a library. And this is actually because Facebook themselves have their own really customized navigation solutions that's highly coupled to how their application is built.

[00:00:42]
So this is why they didn't include it in React Native. There are two main libraries to choose from, they're called React Navigation and React Native Navigation. In terms of functionality, they're built by different people. But in terms of functionality, they're pretty similar, they both do the same thing.

[00:01:00]
I have used both of them. The API on how we use them is quite a bit different. React Native Navigation used to be more performant, cuz it was hooking into the actual, real native navigation, whereas React Navigation was more JavaScript magic over the top. Whereas recently, in the last two releases, I think, they are fully native as well.

[00:01:23]
So there's no performance benefits between them. For this workshop, we're going to be using React Navigation, and that is because this is what's built into Expo. Now this is where whether using Expo or not kind of comes in. So if you're using Expo, and you don't want to go out of your Expo safe space, you'll have to use React Navigation because React Native Navigation has native dependencies that you can't have by default.

[00:01:50]
So if you're using Expo and you want to do React Native Navigation, you'll have to eject from Expo. And there's a chapter later on that you can read more about it.

Learn Straight from the Experts Who Shape the Modern Web

  • In-depth Courses
  • Industry Leading Experts
  • Learning Paths
  • Live Interactive Workshops
Get Unlimited Access Now