Expo React Native Chat App | iOS and Android Chat App with React Native Gifted Chat and Firebase

ckmobile
ckmobile
34,196
0
Published 2021-04-06
In this video , we will walk through how to use the firebase to store and fetch the messages. With the help of the react native gifted chat, the chat app can easily be created.
source code:
www.udemy.com/course/react-native-expo-for-multipl…


Support us with Bitcoin:
1NTuEsXoXE89YiJRNoBDBBRBECE7P9mBik

Open Crypto Wallet
jp-ex.io/register?code=S6Gcvun6

🔥🔥🔥To get the latest Udemy coupon and news, subscribe our telegram channel🔥🔥🔥
t.me/ckmobi


article:
ckmobile.medium.com/a-simple-way-to-build-a-mobile…


00:00 introduction
00:47 create project and install packages
02:30 add stack navigator
04:38 create login screen
08:45 create register screen
12:44 add firebase to the project
14:56 create register function
18:47 onauthstatechange - check the state to display different screens
21:55 create signin function
22:05 create signout function
25:27 fix the navigation problems
28:35 implement the react native gifted chat
30:11 edit the giftedchat component and save the message to the firebase firestore
33:25 fetch the messages from the firebase firestore and test the chat app


▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬
🔥Complete Courses🔥
▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬
React native Expo for multiplatform mobile app development
www.udemy.com/course/react-native-expo-for-multipl…

Complete NodeJS course with express, socket io and MongoDB
www.udemy.com/course/create-nodejs-app-with-expres…
Complete Progress Web App BootCamp
www.udemy.com/course/complete-progressive-web-app-…

Complete Modern JavaScript BootCamp from the beginning
www.udemy.com/course/complete-modern-javascript-wi…

React - The Complete Guide with React Hook Redux 2020 in 4hr
www.udemy.com/course/complete-react-course-w-hooks…

Vue JS and Firebase:Build an iOS and Android chat app [2020]
www.udemy.com/course/vuejs-and-firebase-build-an-i…

New SAT Math Course
www.udemy.com/course/new-sat-math-complete-course/…

New SAT Math Practice Test Explain
www.udemy.com/course/new-sat-maths-explain/?referr…

Get A* in GCSE Maths (Quadratic equations and graph)
www.udemy.com/course/get-a-in-gcse-maths-quadratic…




▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬
💟Follow me
▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬
‣‣ Udemy ► www.udemy.com/user/cyruschan2/
‣‣ Twitter ► twitter.com/ckmobilejavasc1
‣‣ Facebook ► www.facebook.com/javascript.ck/
‣‣ Instagram ► www.instagram.com/ckmobile8050/

**Equipment that I use**

Macbook Pro

amzn.to/2CC41HV



Blue Yeti USB mic

amzn.to/3jf3gph



Camtasia

amzn.to/30aopbg

#javascript
#webdevelopement
All Comments (21)
  • @Bigdog5400
    I just need the chat portion of the app. I have authentication, sign in and sign up already enabled using AWS. Can I just take the chat app specific stuff from this video and integrate it into my app?
  • @SL-xo1mb
    try using
  • @arikmosfor4907
    great tutorial.can you make a screen that display all the chats?
  • @AnatuGreen
    Hi, does this work for dating apps whee one person has to send a message request to another, the other has to accept before they can chat?
  • @cerritosrules
    Do you have an idea on how to implement a join chat room feature?
  • @tharindurajapaksha9293
    In my case at the very beginning, "rnfe" doesn't give any suggestions for the react-native functional export component. why is it and how can I solve this. I installed all the packages also.can you please help me
  • @xenoxel
    I am not able to npm start my emulator, when I start with expo web or android emulator I get a blank screen. Does anybody know what i am doing wrong?
  • @trustgunn9860
    Please I do not understand where the second ID from the gifted chat came from
  • @namegener3038
    do u have the full app for download on your course?
  • @zarifhossain515
    it's for only one to one chat. not for more than two person chat