Navigation | Custom Components | Setup and Application | Chat App Part 3 | React Native

This is the part 3 of our chat app.
We have shown how to add custom UI component and navigation using react-navigation.

Github https://github.com/Abhishek0706/AwesomeChatApp

Vector Icons : https://github.com/oblador/react-native-vector-icons
Ionicons : https://ionic.io/ionicons
Flatlist : https://reactnative.dev/docs/flatlist

Prettier Eslint Husky Setup : https://youtu.be/YOrndZLWpQg
react native environment setup : https://reactnative.dev/docs/environment-setup
react native firebase : https://rnfirebase.io/
eslint : https://eslint.org/
prettier: https://prettier.io/
eslint prettier : https://github.com/prettier/eslint-config-prettier

0:00 Introduction
1:00 Moment
2:24 React native device info
3:45 Changes in our message view
13:10 border view component
18:30 Card view component
22:55 Button Component
29:35 Login Screen
34:55 Dimension Api
37:20 Keyboard Avoiding View
39:40 React Navigation Installation
43:15 Stack Navigator
55:20 Screen Options for Headers
56:00 Dynamic Header Title
58:50 UI improvement
59:50 Outro


react navigation : https://reactnavigation.org/docs/getting-started/
stack navigation : https://reactnavigation.org/docs/hello-react-navigation
moment : https://github.com/moment/moment
react native device info : https://www.npmjs.com/package/react-native-device-info


#reactnative #navigation #reactnavigation #flatlist #icons #firebase #firestore #react #javascript #js #mobile #android#coding #dev #development #chat #chatapp #realtimedatabase #database #eslint #prettier #devtools #vectoricons #ionicons