Navigation Drawer In React Native

Updated 6 March 2021


React-Native Navigation-Drawer

We are going to create a navigation drawer in the react-native app which supports both iOS and Android apps.

Will cover this blog in simple terms with a minimal example. The navigation drawer is playing an important role when you have a menu list to show the app user.

Users can easily navigate menu items and take action on them.

If you have not created a project then please create a project by run this command –


if using existing then please make sure all updated javascript files downloaded in the node_module folder, If not then update by –


Before starting the Navigation drawer we have to install these dependencies.


After installing these dependencies run –


Check the below example code in App.js


Explanation -:


Run the app and check out the result.

For Android – 

For iOS – 

After success pod installed open ios folder in File Explorer and start workspace file which will be open in X-Code studio.

Output screens –


Navigation drawer
Navigation drawer Android


Nav-drawer ios
Navigation drawer iOS


Do you want to open a navigation drawer from the Right side?

Add this key – drawerPosition in Navigator.


See more of our exciting blogs –
Reference –

Happy coding … </ :)>

. . .

Leave a Comment

Your email address will not be published. Required fields are marked*

Be the first to comment.

Start a Project

    Message Sent!

    If you have more details or questions, you can reply to the received confirmation email.

    Back to Home