Modify the color list application to allow users to navigate between components. In this video lesson, Alex Banks introduces the concepts of Navigation and routing in React Native.
- [Instructor] In the last couple of lessons,…we've actually broken our application down…into two separate views.…We have a colored list view that displays a list of colors,…and we have a color info view…that displays the details from one color.…In the index.ios.js file,…we are currently showing the information…for a single color, yellow.…So that's what we see on the screen,…the color info page.…Native platforms come with navigation objects…to help us control which views are mounted…and unmounted based upon user interactivity.…React Native comes with a navigation API…that we can use to incorporate routing…and navigation into our applications.…
In this next lesson,…we're going to add the navigation component…to the color list application.…Now I'm picking up right where I left off…in the last lesson,…I still have the application running in the simulator,…we still have live reload enabled,…and I have the index.ios.js file open in front of me.…So what we need to do is switch between…the color info and color list component…
- How React Native works
- Running an iOS app
- Debugging an app
- Working with components
- Creating style sheets
- Preparing a color list and color info
- Using the navigator
- Fetching data
Skill Level Intermediate
Q: This course was updated on 08/21/2017. What changed?
A: New videos were added that cover Android setup and running the Android emulator. In addition, the following topics were updated: building color info component, fetching data, and incorporating a WebView.