Travel App UI in React Native with Expo Router | 2024 Beginners Tutorial

In this tutorial, you'll learn how to create a Travel App UI in React Native with Expo Router for navigating between different screens of the app. Along with the UI, also here I've shown you how to customize the tabbar navigator in expo router and how to implement a parallax scrolling effect and animation using react native reanimated package in your expo app. The best part of this tutorial is that it's completely beginner's friendly.

► Timestamps
0:00 Introduction
2:27 Create and Setup the Project
4:55 Create Custom Bottom TabBar Navigator using Expo Router
11:00 Create Travel App HomeScreen UI
19:35 Create Categories Buttons and Add Animation
31:23 Create Listings using FlatList
44:52 Create GroupListings
50:24 Create Details Screen UI of the Items
01:05:10 Add Parallax Scroll Effect and Animation using React Native Reanimated

[prasenjitbasu]

Thanks for this Lovely Content and knowledgeable video. But I want to suggest you one little that please make complete playlist for React Native from Beginner to Advance using react native cli for both Android and IOS as because there is no such content available in YouTube and I think freshers like me is searching for these type of Content. I think it will be very helpful for your channel growth. Thanks In advance for your Future content.

[uminhtetoo]

Thank you so much for sharing your experience and knowledge, Sir.

[WakgariBaja]

Very nicely compiled and executed through out .... thanks for sharing your experience Brother ! Love it 💙
any section will follow on this video ? like part two ?

[raymondmichael]

Loved this because TS is used 😊 time to level up

[nonsobarn]

where can i get the listings json data ?

[Mr_Dimension]

Thank you so much, First time I have made completed app . Video length to to good. wonderfull video, 10/10.
waiting for next upcoming video like ecommerce, hotel booking, health tracking.. etc (video max length 2 -2.5 hr).
Now i have Subscribe your channel for upcomming video.
Plz upload ASAP. Waiting...

On thing ( <Animated.ScrollView>, <Aninated.Image>, <Animated.View> ) not working in my case. Also on web it is not working in my case. I am using Android VDM.
plz solve it...?

[movieshub]

How did you create destination.json & groups.json file into data directory? Could you please give me a direction dude??

[shankardakolia]

Awesome video and I have created my first expo app using your earlier expo router navigation tutorial in my app i am using lottie json file it works on ios but not on android i have searched google but can’t get it working any suggestions sir

[zainn]

sir can you create a full stack production ready app having complete auth using supabase aur cler

[bashar]

The link component
not working for me

[usmanmarkaz]

can you please make full stack one because Just UI is not enough now

[devabhinavofficial]

Parallex and auto scroll not working on Android. How can i that.

[JadeWays]

Good content but you were a bit too fast