Course's logo Course
pro
React Native Firebase Chat with Expo Router
15 videos 1 hrs 55 mins 01 June 2023

Course Decription

Dive into the world of mobile app development with our comprehensive course, “React Native Firebase Chat with Expo Router.” Learn how to use Firebase as the backend for your React Native app, building a real-time chat with user authentication, Firestore collections, and image storage.

What will I learn?

  • 🔒 Build a dynamic chat application with user authentication, ensuring secure and personalized experiences.
  • 💪 Discover the power of the file-based Expo Router and protect your app’s internal pages.
  • 🔥 Harness Firebase’s Firestore for real-time data from collections, making your app more engaging and responsive.
  • 🎆 Master uploading images to Firebase’s Storage for media-rich, interactive chats.

Stay ahead of the curve in mobile app development. Enroll in “React Native Firebase Chat with Expo Router” now and start building interactive, real-time chat applications with Firebase and React Native today!

start course start course

💪 Getting Started

Course Intro

What are we building in this course, and what will you learn? Let's take a quick look at the course and all objectives!

2 min
view

Create the Expo and Firebase App

Time to dive into React Native and start our app with Expo!

10 min
view

🔐 Authentication

Register new Users

In this lesson we will learn how to register new users in our app and create users in Firebase.

16 min
view

Creating the Login

In this video we'll create the login screen and start our Firebase user session

4 min
view

Tab Bar with Expo Router

We will now add a tab bar to our app using the Expo Router and connect all pages.

4 min
view

Protecting the app with Auth Context

In this lesson, we'll add a context around our app to protect it from unauthorized users, and to automatically restore the Firebase user session on app start.

16 min
view

Adding Password Reset

To complete our authentication functinality we also add the reset password functionality, which works super easy with Firebase.

3 min
view

🔥 Firestore

Updating Firebase Documents

We start working with Firestore documents by updating the user document.

6 min
view

Adding Documents to a Collection

We dive into our chat functionality by creating a new collection and adding documents to it.

6 min
view

Displaying Realtime Collection Data

With data in our colelction we can now implement realtime updates to our UI based on the groups collection.

8 min
view

Routing to Groups Page

To implement our chat we quickly need to refactor our Expo routing to allow us to navigate to a chat group page.

5 min
view

Writing Chat Messages

We start our chat screen by setting up a basic layout and adding a text input inside a special view.

8 min
view

Display Chat Messages with FlatList

We can implement the last pieces of the chat and display the messages in a list component.

8 min
view

😎 Features

Upload Files to Firebase Storage

Learn how to upload files to Firebase Storage using Expo and Firebase.

12 min
view

Firebase Security Rules

Learn how to write Firebase Security Rules to protect your data.

7 min
view