Building Navigation in React Native with Expo Router

In this video, we will use Expo Router to implement navigation stacks, create routes and utilize different navigation components. Whether you're a beginner or an advanced developer, this video will take you through the process of building a navigation system with ease.
📚 Enroll NOW in The Full-Stack Mobile Developer course and don’t miss out on your chance to become a 6-figure dev! Check out what our successful students are saying about their experience:
academy.notjus...
This build includes a lot of tools & technologies, and it's a great opportunity to learn:
- What is Expo Router
- What are Navigation Stacks in Expo Router
- How to create navigation stacks using Expo Router
- How to use Expo Router in your Application
💬 Join the notJust Development gang and let's build together:
Twitter: / vadimnotjustdev
Instagram: / vadimnotjustdev
Facebook: / notjustdev
LinkedIn: / vadimsavin
Discord: / discord
Timecodes:
Disclaimer: This build is for educational purposes only!! All views, opinions, and technology choices expressed in this video are my own and do not represent the views, opinions, or technology choices of any entity whatsoever with which I have been, am now, or will be affiliated.
#notjustdev #expo #reactnative

[@v22uta]

ありがとうございます。わたしは初心者でドキュメントを見ても理解が難しかったのですが、このチュートリアルのおかげで見通しが持てました。

[@sohamnandi7526]

can you please make a tutorial on "how to implement protected routes/authentication using expo router?"

[@mohamethseck]

That's a good one. I need that topic as well

[@tabotcharlesbessong3756]

That will be great. Nice suggestion bro

[@davidhombe2313]

Great suggestion broh!

[@ThaddeausIorbeeofficialpage]

This is the only video that explained expo router in detail on the internet. Thanks for the video. Can you do a splash screen and onbording implementation using expo router?

[@TommyAMV]

That video was so incredibly informative, it got me unstuck with navigation in Expo! Thank you man!

[@tiagoamorim5265]

Thanks for sharing that knowledge! I've searched for days for a good tutorial for both web and app routing, finally found it here!

[@lscodeschool957]

Thanks @Vadim this was really helpful. Have thought of doing a real world project with this next expo-router features, maybe a remake of some of the old livestream projects for us to see the full usage of this updates on expo router. Once again thanks. I have gone over and over this video for days. More power to you.

[@joeokat]

I am a UI Designer but I am proud to call myself a UX Engineer | React Native Expo Developer with just this live stream because everything i thought of is here in this video. I am starting out on this path and I am looking forward to learn more from you with expo router. More simplified projects to solidify my skills in mobile development. Thanks once again.

[@verawat]

Thank you. I think this is awesome tutorial that i have not seen before.

[@notjustdev]

Glad you enjoyed it! 🙌

[@jonasgroendahl]

Thank you for going through some this! Was wondering about the nested stack inside tabs

[@victorzerefos6557]

Sr. your tuts are amazing thank you very much for your time! One thing that I've been trying but didn't get through was that how to pass the whole object through Links?

[@senoremc4628]

Hi there, I've been following many of your videos and really appreciate the content you share. I'm currently working on a cross-platform app using Expo Router SDK 49. During development, I've encountered some limitations with React Native Web, particularly with using certain web libraries. For instance, I couldn't find any libraries for Mapbox, which makes me consider if using Next.js with Expo might be a better option to leverage React libraries. Do you have any advice on how to integrate web libraries within a React Native project or if there's a more effective approach to this? Thank you for your videos and all the valuable insights you provide! Best regards,

[@subhajitadhikary155]

Thanks a lot Vadim, you have given to the point explanation without wasting any time. 😇😇

[@mathhack8647]

Very Good preparation . Well presented and too much easy to integrate and integrate within any project . Thanks

[@angelapatrinou5560]

Awesome work! 👏 Something about auth would also be a great follow up!

[@Kevin-jc1fx]

Hello and thanks for this good video. Is expo router production ready or should we stick to React navigation for now?

[@nexonsenpai1341]

Thank you so much, understood it very well

[@notjustdev]

Glad it helped!🙌

[@goodstuff2read]

The link to the source seems to be missing.

[@ArthurBurgan]

Thanks a lot for this intro! I'm building a chat app and would like to have Tabs navigation on the main screen, and want to hide Tabs when I enter one of the chats (go down the Stack). I'm wondering how I could do that.

[@draftermyself]

Simple but useful information 😌 GREAT!

[@ralexand56]

WTF! This expo router is incredible!

[@bestelectrocity]

Thank u Vadim and your team for such a helpful and useful video tutorial :)

[@notjustdev]

Our pleasure! Thanks for watching

[@sami25064]

can i get the source code?

[@qwertz3813]

Is it possible to somehow wrap app in a context, when there is nothing like an App.js/App.ts?

[@phuct2550]

Thank you and your team for such a helpful and useful video tutorial 😁

[@shedrachugochukwu6245]

Hi, notJust dev It's shedrach from Nigeria Thanks for the video, I really do appreciate it. I'm having a serious issue trying to pass parameters through the React native expo router form one screen to my detail screen. Can you please make a video or tutorial on that🙇‍♂🙇‍♂🙇‍♂

[@luckeyluc1]

Thanks for the tutorial. I'm trying to build a project with chat GPT and in react-native without any programming experience but i'd like to use expo for navigation. this really helps

[@aadilmallick911]

Bro jumped from 0 to 100 in difficulty

[@jhonnierandler]

The best video ever, thanks Vadim!!!

[@mohamethseck]

This is great. I'll have to learn how to do protected routes with firebase. I would think it's the same as in React though correct?

[@jimuelbaraero678]

on android the modal is not dragable to close, is there a way to make it on android??

[@aprfocus7501]

Can you explain about local-authentication in react native cli

[@JimmyCheng]

can you do protected route with this? Like an authentication token for login page => home page.

[@Vorenus875]

As a React Native developer which do you like working with more? React-navigation or this new Expo library?

[@Доджи-м6щ]

Vadim ? Please don’t ignore)

[@justiceessiel6123]

I like the tutorial and I would to know if you can help me with this .. first I have been trying to get the documentation of expo router and I cant. Secondly if we are doing file based routing then how do we create a folder to create components only .. because if I create a folder called components I am creating a nested route

[@idrisisholaagboola8676]

Thank you for this amazing tutorial. I will like if you can make a tutorial on TopTab in expo-router

[@tabaicanking3701]

is it possible to prevent back button using expo router ?

[@christianelyong.s8696]

Hello Thank u for ur tutorial,..! Is any reason react native app being lag if we reset the stack navigation for multiple time ?

[@KaranKamdar1MW]

When deep linking, The Back button doesn't show when I navigate via a deep link to a Stack Screen of a profile of a user in my app. This profile screen is housed under a tab in the app and I want the back button to show so that user can navigate to the main tab, otherwise it just stays stuck there on the profile screen with no way to navigate other parts of the tab like the root index screen of that tab.

[@devavratsingh4910]

Can you make tutorial on speech to text conversion using react native expo cli

[@JuneBeforeJuly]

would it be possible to show us a little more in depth on how to create layouts and shows different variations of doing it? i didnt really grasp how to do it. i tried creating my own but was unsuccessful. i was going for bottom tabs and drawer, as well as material top tabs inside of one of the bottom tabs but couldnt really figure out how to get it done.

[@emporteme]

Hello I have the same troubles with tabs and layout. Did you found any good resource?

[@NestorSantiagoFuhr]

hi, having problems with displaying icons in IOS. Android and web woks well. Any idea what would be the cause?

[@sahul6688]

what is the shortcut key to align a single line long codes into multiple lines code in vs codes. ctrl + Alt + F is not working

[@LoneDWispOfficial]

someone knows if it's possible (and how) to the layout to pass children components, so i can be able for example to set a background image, so it can be displayed on every other component?

[@algosexy813]

compile an .aab the same as with a project created with create-expo-app from the expo server?

[@Mikhail.tortik001]

Unfortunately here weren't something about auth((((( Can you record an additional, short video 5-10 min?

[@mahtotmkonn3254]

u have so amazing energy!

[@mahbubmorshed9527]

modal slide is not working in android. how we solve this issue ?

[@GeorgeFlorian12]

Why isn't the source code available ? I would love to see how the project was set up.

[@dericbytes]

Packed with content and very helpful. Thanks

[@notjustdev]

Thank you for your kind comment! I'm glad to hear that the content was helpful to you

[@PraveenKumar-vz4dy]

is this will work in cli as well anyonr replay.....

[@igwanwan_dagoat1523]

Can I use your code for business purposes?

[@YomiTosh]

Thanks for the tutorial!

[@tomshabalin9775]

do you have the link to the source code?

[@greenshaheen6716]

no android and ios folders?

[@saravanans3779]

can we use drawer with this expo router

[@danielikpe1881]

is seem openDrawer is not working for now from useNavigation

[@algorithmprime]

Great how do i use this template with typescript

[@esbix_official]

Anyone having the same re-render problems when using nested navigation? As soon as I create a _layout nested, useEffect is called twice.... Anyone got a solution? Haven't found anything :(

[@potofwisdomquotes]

Hey man, have you tried to build the expo router app with EAS BUILD. kindly reply this so i know whether this works. because i have tried and never works. if i cant build app apk or eas build then what is the use. thanks.

[@tanupamsaha3053]

Have tried and it works.

[@MohamedElsayed-oz2kz]

what is your vs code theme ?

[@tonykharioki6913]

thanks alot. this will help me build better apps

[@mitsuha5177]

tnx

[@raybelmo]

Well, tried to use this with Typescript, but it was not possible.

[@SohelIslamImran]

Thank you 💕

[@pyakz6474]

how do i change the order?

[@sathusan2008]

Excellent explanation of a poorly documented feature. Can you please upload the code to a repo and link it in the description?

[@safytoyota7938]

Expo react native project with firebase and expo router please

[@FaysalBDev]

nice job, you have some great tutorials and video you just need to prepare better examples, and for gods sake enable the autocomplete where you put the . and you get the suggestions :). Amazing work tho thank you

[@Thigha]

That was great

[@caio508]

Tabs on 57:35

[@prouddev1638]

Can it be used in a non-expo project?

[@alexandrodisla6285]

don't think so

[@remziogultum6697]

you are amazing

[@m__link6499]

How do we subscribe to your premium course?😊

[@notjustdev]

The course is available on: academy.notjust.dev/

[@theabs24creations45]

TimeStamps would be nice bro

[@RIO-uo7uu]

options={{ presentation: "modal" }} not working on my android phone

[@Kevin-jc1fx]

Same issue here.

[@mustafadabah7377]

presentation: 'modal' is not made any animation with me is there anyone faces this issue ??

[@Kevin-jc1fx]

I have the same issue.

[@gouravnainwaya5669]

Upload source code

[@Intellectualmind4]

Payment app tutorial please.

[@aprfocus7501]

HI

[@yohanndiravino]

Merci !

[@1998goodboy]

who doesnt using TS in 2023?

[@phasematerialsresearch9319]

downvote because no time-stamps.

[@theboringscientist7226]

how can i use it with typescript?