Bottom Tab, Stack, Drawer, Top Tab Navigation | React Navigation 6 | React Native Tutorial & Project

Hello guys, My name is Rohit Kumar Thakur. In this video, I will show you, how to use Bottom Tab Navigation, Top Tab Navigation, Stack Navigation, and Drawer Navigation in React Native and Expo Applicastions. I also used vector icons in bottom tab navigation.
I am using React Navigation version 6 in this tutorial video.
React Native Expo is a cross-platform framework, which gonna helps you to build mobile apps for both Android & iOS devices.
The code part is not that much tough. You just have to follow the video to get the desired output. Happy Hacking

𝐁𝐨𝐨𝐤 ( 𝐅𝐫𝐨𝐦 𝐂𝐨𝐝𝐞 𝐓𝐨 𝐂𝐨𝐧𝐧𝐞𝐜𝐭𝐢𝐨𝐧𝐬: 𝐀 𝐃𝐞𝐯𝐞𝐥𝐨𝐩𝐞𝐫’𝐬 𝐠𝐮𝐢𝐝𝐞 𝐭𝐨 𝐛𝐮𝐢𝐥𝐝𝐢𝐧𝐠 𝐚 𝐬𝐨𝐜𝐢𝐚𝐥 𝐜𝐚𝐫𝐞𝐞𝐫 )

Chapters:
0:00 How to start a react native & expo apps
0:44 Basic and Default Installations for react navigation
1:10 Bottom Tab Navigation In React Native & Expo
7:33 Top Tab Navigation In React Native & Expo
9:51 Stack Navigation In React Native & Expo
13:01 Drawer Navigation In React Native & Expo

My social Links:

Music Source: NCS

Tags: react native, react native tutorial, react native app, react native project, react native tutorial for beginners, react native navigation, react native expo, react native full course, react native animation, react native crash course, react native app development, react native app tutorial, react native app project, react native android, react native ios, react native android app, react native CLI, react native crash course, create react native app, code step by step react native, react native design, deploy react native app, react native tutorial in Hindi, react native navigation, what is react native, react native projects, learn react native, react native setup, react native expo tutorial for beginners, react native UI, react native expo, expo react native, react native expo tutorial, small projects in react native, bottom tab navigation, top tab navigation, stack navigation, drawer navigation

#reactjs #javascript #reactnative #ios #android #react

[User-gjpb]

Great video, I'm just wondering how you would go about including all the navigators on all screens though? In this example you have the drawer navigator visible on some pages and tab navigator visible on some others, how would you include both all throughout the app?

[wofan]

Hello @Bugninza I am trying to make a top tab navigation. I followed the tutorial a few times starting from the beginning but I keep getting requireNativeComponent: RNCViewPager was not found in the UIManager. Did I forget to import or install something?

[elelyons]

Thanks for the video, it was really helplful, but what i find really difficult is making react-navigation buttom navigator to be visible on ios and Android, but not on web. On web i would love to have a drawer instead of the bottom tabs. I would be glad if i could get a clear and descriptive example that i could implement in my project

[TechForSkillsEarning]

Sir it's very helpful ❤ but when I'm using Drawer Navigation, it's show many errors. " App registry ..."😟

[TechForSkillsEarning]

Sir please build a demo app using all navigation in one app, because I'm facing many errors. When I'm using all navigation in on app.

[geoffrey]

You forgot to cover nesting navigators