Build complex layouts with Expo Router v2 and Expo SDK 49 | File Based Routing | React Native

Hello everyone 👋, In this video you will learn about implementing any kind of layout with expo router v2 and using latest expo sdk 49, we will build stack/tabs navigations and very complex nested navigations. Build professions apps using expo router v2.
Github repo: github.com/sye...
Expo Router Installation: docs.expo.dev/...
Test Deep-linking: reactnavigatio...
Add TailwindCSS in React Native: • Add Tailwind CSS In Yo...
Add Navigation in React Native: • Food Delivery App with...
If you appreciate my work and you would like to support my channel: www.buymeacoff...
🚨 more videos on react native:
Food Recipe App : • 🔴 Build Food Recipe Ap...
Movie App : • 🔴 Build Movie App Usin...
Onboarding UI with Lottie Animations: • 🔴 Onboarding UI with L...
AI Voice Assistant with ChatGPT & DALL-E : • 🔴 Build a React Native...
Travel App UI : • 🔴 Travel App UI | Reac...
Weather App : • 🔴 Build Weather App Us...
Coffee App UI : • 🔴 Coffee App UI - Reac...
Food Delivery App : • 🔴 Build Food Delivery ...
KZbin Clone App: • 🔴 KZbin Clone - Reac...
Login | SignUp UI : • 🔴 Login | SignUp UI - ...
Fast Food App : • 🔴 Fast Food App UI - R...
App Store UI : • 🔴 App Store UI - React...
Fruit Shop UI : • 🔴 Fruit Shop UI - Reac...
Firebase Authentication React Native: • React Native Firebase ...
Food Delivery App : • Food Delivery App with...
Learn React Native: • Build Expensify App Wi...
Learn Reactjs: • Modern React For Begin...
#expo #reactnative #tailwindcss #javascript #programming #typescript #speedcode #coding #design #appdevelopment #reactjs #ui #uiux #reactnavigation #reactnativetutorial #react #animation #reactjs #navigation #navigationbar #uidesign #mobiledevelopment #iosdeveloper #buildinpublic #opensource #reactnativeapp #reactjstutorial #typescript
react native animations
animations in react native
react native tutorial
react native app
react native tutorial for beginners
react native project
react native course
react native expo router
expo router v2
expo router sdk 49
expo router tabs
tab navigation
expo router nested navigation

[@MrRobots100]

One of the best videos I have ever seen. Perfect. Made my day.

[@saherraza7110]

your way of teaching is so smooth and efficient. loved it...!!!

[@Lior-n9b]

Great tutorial thank you! For your future tutorials what would be great is a at the end of small summary of how the concepts you've showed in the video works :)

[@haroldllames5709]

Wow. That's so informative and really great. I have been looking for this kind of tutorial. Please make more. Thank you!!!

[@codewithnomi]

Thank you! Will do!

[@priyanshudhawan5054]

you solve half of my problem that i suffering from 1 long day.

[@codewithtae6637]

Appreciate the video! You filled in some knowledge gaps I had!

[@mtpk0]

You are awesome! Excellent tutorial, clear and concise, learned a lot. Thank you for all the effort you applied in making it. :)

[@codewithnomi]

Thank you 🙏

[@anazi]

By far the best Expo Router tutorial. Now can you show us how we take care of the initial routing regarding Safe Authentication and preventing some lages to appear to unauthenticated users. No need to use a real authentication service to keep it simple just a boolean that triggeres isLoggedin = false. then settimeout => true after 1 second. To mimick a real life application and how can we implement it in Expo Router

[@codewithnomi]

You can implement auth in expo router, follow this guide 👇 docs.expo.dev/router/reference/authentication

[@HermesSoilder]

I don’t say this much but this is the best video on the topic. You provide a little bit more complex of an example that almost reflects a real life use case (mine especially). Everyone else is just barely scratching the surface, yk how when you read a medium article and come out feeling like you should have just read the docs. content quality in the RN space sucks.

[@codewithnomi]

@@HermesSoilder thank you

[@JahangirAmin]

@galaxies_dev deserves all the credits for this video. This dude didnt even bother to change the thimbnail.

[@tuansiraj]

This is Great !!! when navigating the stack inside the tabs , are there anyway can we hide tab bar ? what if link something on the outer stack in tabs will it return to the outer stack ?

[@macabro019]

Excellent video, how do you make the routes typed when using ? I just created a project with expo v50

[@Bkbois]

So can the tabs header background colour be changed, like that of the stack screen?

[@mahamathassan6153]

Thank you, you helped a lot.

[@refaldybagas]

thankyou. great tutorial ❤

[@magne6049]

do you need to use the native stack navigation swipe animation? Or is the stack navigation merely conceptual and you can choose the animation yourself?

[@perrythepalteypus2185]

Brilliant tutorial 🎉❤

[@themrsupermanto]

Amazin video. You saved me👌

[@withpaulex8645]

Nice video compare to others am seeing for expo router

[@ugo3648]

What a great tutorial! Thanks dude. Do you plan to make one on the SDK 50 and his new features ? Keep doing !

[@codewithnomi]

Sure, will do.

[@kral626]

Excellent! Thank you for this video. Say, if I want to make the Post Details page take up the full screen (even above the bottom tabs), how would I do that?

[@codewithnomi]

You will have to create the post details screen in another stack

[@kral626]

@@codewithnomi I see. Separate from the stack inside the (tabs) folder? Something like this? (tabs) index _layout posts post-details index _layout

[@codewithnomi]

@@kral626 yup

[@hellatalented]

Awesome vid bro helped alot!!!!!!

[@paysnug4470]

npm i react-native-modalize the modal is showing behing the tab the modal is showing behing

[@ibiyemisamuel6082]

Thank you😊🎉❤

[@Pan_Policjant]

presentation modal doesnt work, is it because im on android?

[@rcodev]

How incredible, wonderful this video is. How could we do this if we log in to the app? for the user to access the routes only after logging in, using expo router.

[@codewithnomi]

you can implement auth as well. here is the reference: docs.expo.dev/router/reference/authentication

[@MustaphaMuhamed-z4t]

perfect i will apreciate for this knowledes

[@olegtytov6134]

guys please,how can we change baground fon on top screen where written the name of the our components and how can we get away this inscription?

[@carlosmedrano8596]

hey a very good video, thanks

[@bestelectrocity]

Thanks, amazing 🎉

[@mahendranath2504]

Nice thank you so much for amazing content

[@ahmaat19]

You gained my subscription

[@Pan_Policjant]

how to test this deeplinking in android

[@erics1337]

Great tutorial. Please show how to make an animated drawer.

[@codewithnomi]

will do 😉

[@michealskup5730]

hi there ! does modal work on android ?????????????

[@ajinkyashinde6118]

Great learing with you sir. Nicely explain routing, waiting for more content.

Hi, I've been following your work and technically you're very good. but I would like to know how to rotate the cell phone screen next to vs code.......I don't know if you understood me

[@paysnug4470]

the background inside tab is not working

[@kevingrondin974]

Nice, and drawer navigation not change ?

[@codewithnomi]

I'll create a video on this someday 😉

[@Aflatoon947]

Good work 👌🏻

[@user-rdr1712]

Why tsx instead of js? Is it mandatory to follow .tsx file?

[@codewithnomi]

No, you can use js

[@lanskaba3668]

This is just like nextjs 13 app router

[@PorZa559]

Can I hide tab bar when go to postId page?

[@codewithnomi]

You will have to create a separate stack layout for postId page

[@PorZa559]

@@codewithnomi Thanks for replying. I already added stack layout to [id] folder, but tabbar is still shows.

[@hubesh716]

That is totally similar with Next js

[@codewithnomi]

yes

[@hubesh716]

Sir plz make video how to . make Animated bottom Tabs with animated Drawer with navigation plz make this one with React native Reanimated

[@codewithnomi]

Ok I will try

[@inamulhasans9461]

Great 🎉❤

[@wisdomelue]

🎉