Categories
React Native

React Native: How to configure reactnavigation?

React Navigation is one of the most well-known navigation libraries available for React Native. In this article, I will discuse how to get started using React Navigation in a React Native application.

React Native Navigation

Installation ReactNavigation

Install the required packages vai (npm or yarn) in your React Native project:

Install Stack Navigator

Installing dependencies into a bare React Native project

React Native navigation example:
Now create new “screens” directory in application root directory.
Then you need to create some screen files like HomeScreen.js and LoginScreen.js in screens directory. Or If you have already some screens than skip new screen creation

HomeScreen.js.

LoginScreen.js

Now, open App.tsx file form React Native application directory and you need to wrap the whole app in NavigationContainer.

Done, now run your app using following command:

Your app is ready with two screens and move between screen by click button (Go to Login and Go to Home). More details Stack Navigator click here.

Thank you for carefully read my article If you have any query please Leave your query on following comment section or contact with us. Hope it will help you.

Related Articles