React Navigation Tutorial for Beginners - Complex Navigation Flows with React Native
HTML-код
- Опубликовано: 29 сен 2024
- Hey, what's up, guys? In this video, we're going to learn how to use React Navigation to incorporate complex navigation flows into our React Native apps.
🚀 React Native Course 👉🏼 codewithbeto.d...
👨🏻💻 For resources go to Code With Beto 👉🏼 codewithbeto.dev
👯 Join the Discord: / discord
👨🏻💻 ☕️ 🌟 Would you like to support me? Sponsor me on GitHub🌟 ☕️ 👨🏻💻
github.com/bet...
⭐️ If you want to learn more about me, check this links:
Twitter: / betomoedano
Instagram: / betomoedano. .
Github: github.com/bet...
Linkedin: / betomoedano
Discord: / discord
Code With Beto: codewithbeto.dev
Medium: / betomoedano01
Figma: www.figma.com/...
⭐️ My apps & projects:
► Code With Beto: codewithbeto.dev/
► Eco Studios:www.ecostudios...
⭐️ Contact: betomoedano@outlook.com
One of the best video on React Navigation
Thanks! You may be interested on checking the new version 7 video :) ruclips.net/video/XoumiwHbKDg/видео.html
You are really an awesome coach. I saw a lot of videos on navigation and none of them worked well enough until i saw your videos. Cant wait to see the remaining videos.
Awesome, thank you!
this is a really nice course, i think it will be nice if you add those things they add in videos these days so you can jump to certain sections. I think that will really be helpful. There are some people who already know some section of the course and its time consuming to keep fast forwarding and checking if you are at the place you want.
Noted!
yea timestamps are really good .
Dude the way you explain thing is so clean….. thank you🎉
I appreciate that!
Yay another awesome video by Beto. Muchas gracias!!🙏
Thank you!
so if i want to access details page from notifications or settings screen, then i need to put the details screen into notification's and setting's stack again?
Hi, please make some non-expo tutorials. I got 10 minutes into this one with you saying learn without expo first-then you said you're skipping some stuff because expo handles it 🤷♂
Thanks for this comment, saved me a ton of time lol
Expo is the recommended way of creating RN apps
@@codewithbetoit’s the opposite of the title of the video and it’s antithetical to your own advice in the beginning.
@@svenbjorn9700 What he said in the beginning was to use React Navigation instead of Expo Router. Expo Router is a library offered by Expo. But Expo is so much more.
So this is still an Expo-managed React Native app, which means that even though you use React Navigation directly instead of Expo Router (which wraps around React Navigation), some things are still handled by Expo!
absolute banger bruv!!
Hi bro... Nice tutorial.
But how did you remove that Route HomeStackGrop from the DrawerContent?
Great video for beginners!
all good, but when i go to notification tab I can still swipe to open the drawer, I want to only open the drawer from home tab not any other tab, how to do it ? would you please reply
Sir, I am using android ... , many plugin have different code for android and apple ... So please inform us whenever there is a different code for android.. like shadow and elevation... I think U got my point sir.. some of the animations are not working in android that is why I request ...Thank You Sir..
How do you get rid of the vulnerabilities?
super helpful
Hey, Do you have any idea why we are getting those 14 vulnerabilities and if they can be removed? Do they matter?
in react native?
Cuando lo harás en español otra pregunta en tu plataforma es un único pago de 20 dólares o es mensual?
El curso es $20 dolares un solo pago
Aqui esta en español: ruclips.net/video/_ld5B_ZvFWA/видео.html
Valeu.
How do I persist the state of B , when I come back to A from B. B gets unmounted
You likely need redux or useContext, would you be interested in a video?
what sound is that bro at 10:47, it scares me when i wear earphones
Haha I think is my keyboard
you're such a very underrated and great teacher brother! thank you so much for all your effort and time to create these awesome tutorials, will definitely recommend your channel to my classmates! :)
Thank you ❤️
Nice video Beto, out of curiosity why around min 41 why you use the useRoute and useNavigation hooks, as it's a screen can you not get it from the components props? Or are you doing it to demonstrate the hooks?
Excelente video amigo, tu contenido y tu explicación es muy buena.
Me surgió una duda con tantos cambios en las versiones de RN y la navegación, Me recomiendas alguna configuración de versiones en específico? o solo seguir ambas documentaciones en sus ultimas versiones? lo que pasa es que me da errores pero no se sea tema de versiones de RN y la navegación
Have anyone implemented call recording app for iOS or Android in React Native in 2023?
how about if notification tab have nested stack like home screen?
npx create-expo-app is now giving tsx and i can't no app.js ...bruh im not ready for typescript 😂
Haha if you are interested you should check my react with typescript course! It’ll get you ready!
Hi Beto how are you i have request plz make One Full stack app in react native with sanity or strapi choose any one but plz make atleast one
Got it!
@@codewithbeto what???
I will create a video with sanity or strapi
You should do a tutorial on linking. Configuring how navigators connect is the single most frustrating aspect to react navigation. This is a video version of you walking down the documentation (I mean, what tutorial isn't these days, right?).
You make great content and it can be much better if you tackle real challenges people face when they've moved beyond these essentials.
setting up reanimated plugin and Darkmode 10:39
drawer = 52:36
Thank you for the great content! One question: is the android top tab working for you? I didn’t see you switching the top tab in the video so I’m wondering if there’s a bug cuz my top tab indicator is not switching with the page..😢 really hope you could answer 😊
how to add drawer menu for setting and notification
This is with Expo..?
Wanted it..!
Great video! Really helping me create my first react native app! :)
Great to hear!
Is your React Native course updated?
Hi, I have problem with drawer. When I click on burgermenu its freeze, also when I use gesture to open side menu and click on link its freeze again and I need to reload app to unlock it. How can I fix in your opinion? Thanks 🙏
Hello Beto. Your video is so great. Thank you for it. But I have a small question. Suppose that the Payments Component is a StackNavigator with multiple screens (For example, PaymentsScreen and PaymentsDetailsScreen). When I click on a button in the PaymentsScreen to navigate to the PaymentsDetailsScreen, the Drawer Navigator is still there. How can I hide it in the PaymentsDetailsScreen (Still available in the PaymentsScreen)? Thank you so much!
SO MUCH LOVE FROM TANZANIA
Thank you 🙏🏼
How facebook mobile do navigation with scroll saved position ? Are they using stack navigation ?
How are you making your regular React Native components change theme with the React Navigation Components? i.e. text color
Mr. Beto, Thank You, ive got a clear idea of how navigation in complex apps actually works. and also i've the ways how to handle thank you man.
Thanks a lot Beto !!
How can we make the sidebar navigation scrollable, in case of when the screens will become more and more
Hey Can you assist me here. I am on timestamp 15:48 --- I am unable to get the import navigation down.... it continues to say I have errors with casing
import "react-native-gesture-handler";
import Navigation from "./navigation";
export default function App() {
return ;
}
this is my code. I created the JS file with both navigation.js and Navigation.JS but running into same problem and it will not let me move forward
Try changing your import adding the file extension (from “./navigation.js”)
nice thank you so much for amazing content, liked 👍 and subscribed to your channel
extremly awesome
really i got understand it perfectly thanks to god then you
many thanks to you
This is awesome, thank you. For anyone looking I recommend this
Please will you share with us which android and IOS emulator you are using?
Still waiting for your English react native course 😊
when I do a production build my app freezes at splash screen
Thanks for the video, really good content. I’m actually trying to hide the tabs when the stack is 3 levels deep and I’m not sure if the nesting approach is the best?
please give a solution about react native health connect and make a separate video
Can you share the files you copied and pasted in this project ?
This is a really great video. It explains all the navigations really well. Thank you Beto
What a great teaching ,please how can I get the source code so that I can follow along properly
very helpful, so damn good explicacion, gracias hermano
for me "SafeAreaView" from react-native does not work but the one from react-native-safe-area-context works just fine, anyone know why.
to me happened the exact opposite hahaha
Very good video excellent content congratulations.
Could you let me know what your vscode theme is, I really liked it 😄
Is the regular vscode dark theme 😄
Nice video, well done, thanks :)
really good content brother keep up the good work ! thank you so much and hope this chanel will grow futher... best of luck !!
Thank you so much 😀
Timestamp?
Dude, it’s still not possible to create an account on your website…user is not confirmed..and no confirmation code is sending …
Please send me your email at betomoedano@outlook.com
Thanks beto this is much help for me👏🏼
❤❤❤❤❤❤
presentation: 'modal' is not working on android. Is there any known bug?
Just works for iOS 😬
Thanks, i hope your channel to be ranked from the best channel in RUclips.
Thank you 😊
Beto! Thank you so much for the lesson!
How can I do the same in expo router?
Amazing video and desperatley needed when coming across to React Native from React.
Glad it was helpful!
thanks man ! that's exactly what's i've been looking for these past two days !
Thank you Beto, you explained everything so well.
Thank you 😊
Awesomeness 🎉
I learn a lot in 1hr
Thanks for this
Glad you liked it!
thank you verry much
Buen video bro.
really awesome turorial!
Great video Beto! Keep them coming. Thank you so much!
Thanks, will do!
this video Helped me a lot.Thanks
Glad to hear that
great video
❤