Chapter 15. Navigating Between Screens

Routing is an essential part of any React web application. Without a router, the pages that correspond to URLs would be impossible to manage, making your application impossible to scale. React Native applications don't have URLs that map to pages, but you can implement navigation that's conceptually similar to routing URLs to pages.

We'll get started by thinking about how to divide a mobile application into screens and introduce the common terminology that's used with React Native navigation. Then we'll walk through several examples that demonstrate the navigational abilities of React Native.

Screen organization

Thinking in terms of screens is easy in web applications because you have a URL that points to each screen. Put differently, URLs make thinking about screen organization natural and easy. Take the URLs away and suddenly screen organization becomes more difficult.

Imagine trying to build screen transitions in a mobile application without the page abstraction that we take for granted in web interfaces. You would have to build your own abstraction that ensures that each component for each screen is rendered, and subsequently removed once the user moves away from the page. Not ideal.

But, you really want to work with some kind of page because that's what you're used to working with when building React applications for the web, right? In the following section, we'll cover the terminology used in React Native that helps make this happen. The real challenge is simply coming up with the correct screens. It's challenging because there aren't URLs in the traditional sense. However, just pretend that there are URLs; this will help you decompose your app content into the correct screens.

..................Content has been hidden....................

You can't read the all page of ebook, please click here login for view all page.
Reset
3.142.97.219