In this tutorial, you'll learn how to create a finance app UI in react native. I've used expo router v3 to create a custom bottom tab navigator and react native gifted charts package to implement the pie chart graph to display expenses interactively. Also, I've used a custom header component to create the app's header.

‍ Get the source code here https://bit.ly/3So91E6

Learn TypeScript for ReactJS for Beginner's Tutorial    • Learn ReactJS with TypeScript for Beg...  

Expo Router Tutorial Playlist    • Expo Router  

→ Travel App UI in React Native with Expo Router Tutorial    • Travel App UI in React Native with Ex...  
→ Social App with Firebase in React Native Playlist    • Social App with Firebase in React Native  
→ React navigation v6 tutorial playlist    • React Navigation 6 Tutorials  
→ Food Finder App in React Native Playlist    • Food Finder App in React Native  
→ Music App UI Tutorial    • Music App UI in React Native | Create...  

► Timestamps
0:00 Introduction
1:20 Setup the Project & Install the Packages
6:58 Create Custom Bottom TabBar Navigator using Expo Router
12:19 Create Custom Header
22:10 Start Creating Fiance App Home Screen UI
24:48 Pie Chart with ReactNativeGiftedCharts
28:58 Create Expense Section
40:57 Create Income Section
47:33 Create Spending Section

If you found my tutorials helpful, you can buy me a coffee from this link https://paypal.me/PDNTechnology

Follow me on Twitter   / itzpradip  
Follow me on GitHub https://github.com/itzpradip

Subscribe to my Channel http://bit.ly/2PaUqOk

For more tutorials on WordPress, React JS, React Native and Flutter visit: http://www.pradipdebnath.com/blog/