Matching is the heart of our application. For this feature use the firebase-nest package to make complex queries against the database and get a list of matches. In this video, learn how to use firebase-nest and its querying to get data from the database.
- [Instructor] Previously, we tackled authentication.…Now let's take on the database through the match store.…To get started, we're going to create a new file under stores…called matchStore.js.…We'll start with an import of action from mobx.…Then we'll also import firebase from firebase,…and we'll import MobxFirebaseStore…from MobX-firebase-store.…
Let's make our class definition.…We'll export default class, and this will be called…MatchStore, and it extends MobxFirebaseStore.…Then our constructor we're going to need to call super…and pass firebase.database().ref() to initialize…our MobxFirebaseStore.…
After that, I'm going to set up an authentication handler,…so firebase.auth().onAuthStateChanged,…this would be an anonymous function that contains a user.…Inside here, we're just going to create a new member variable…user and set it equal to the new user.…We're not worried about if the user's null…or anything like that.…We're just collecting the user.…Outside of our constructor, we're going to overwrite…a method called resolveFirebaseQuery,…
- Setting up your project and Firebase account
- Creating the app container
- Setting up basic navigation
- Creating a splash screen
- Creating a login screen
- Creating a match feature
- Creating a post feature
Skill Level Intermediate
Building an App with React.js and MeteorJSwith Emmanuel Henri4h 20m Intermediate
Building a Web Interface with React.jswith Ray Villalobos1h 21m Intermediate
1. Getting Set Up
2. Building an App
3. Create a Login Screen
4. Create a Match Feature
5. Create a Post Feature
- Mark as unwatched
- Mark all as unwatched
Are you sure you want to mark all the videos in this course as unwatched?
Take notes with your new membership!
Type in the entry box, then click Enter to save your note.
1:30Press on any video thumbnail to jump immediately to the timecode shown.