So now that we're all done with authentication, our users can register,
they can log in,
they can log out.
We've got all the proper user interface setup for them.
It's time to actually move on to the chat screen and start saving the messages they type in the text
field here. So that the moment when they hit send that message goes right into our Firebase Cloud Fire
store over here and we should be able to see it inside our database.
Now as always, there's no shortage of documentation when it comes to Flutter and it's the same thing
with Firebase as well.
There's lots and lots of documentation on both the Flutter package pages,
so this is going to be Dart code that they're showing you here.
But also when you go on to a Firebase and you go over to their documentation, you'll be able to find
a large amount of documentation for all platforms,
iOS, Android, Web and I'm sure there will be Flutter specific documentation coming really soon.
I bet both of those teams are working hard on it. Now in order to start saving our data into our cloud
Firestore,
we're going to have to do a couple of bits of setup on the Firebase website first.
So we have to go into the database tab right here and then we're going to be able to click on Create
database to create our Cloud Firestore.
Now notice that there's also another type of database that Firebase offers which is the real time database.
Now this was their kind of the-one database I guess.
And it's very very fast but it's based off saving JSONs which is not as capable or as extensive as
their Firestore which is based on a NoSQL database. We're going to be using the latest and greatest
which is their Cloud Firestore.
So let's click on Create database and we're going to toggle over to start in test mode so that anybody
with the database reference can read and write to the database. A little bit later on once we're done
testing and we're ready to deploy our app onto the appstore, we'll change these rules to be a little bit
more secure.
But for now nobody knows about or cares about our app yet.
So let's go ahead and click on enable to create our Cloud Firestore.
Once the setup finishes you should see the database dashboard look something like this.
And here we have the ability of adding a collection.
So what are collections?
Well let's imagine that you're running a shop right? And you have to manage your inventory,
you have to manage your customers. So you might have an Excel spreadsheet for your customers.
You might have one for your products.
You might have one for your suppliers.
And these Excel spreadsheets are equivalent to our collections.
So we're going to need to create one called messages
and this is going to store all of our messages
and also the senders who sent those messages. And we're going to click next to be able to create some
fields.
So we're gonna create a sample data here to establish some fields.
So our first field is going to be called text
so this is going to be the message text.
It's going to be a string.
And let's give it some dummy value.
Let's just say something like hello.
And we're ready to add another field which is going to be our sender field.
Again another string and let's say that the first Sender was angela@email.com.
And now let's hit save and you'll see our first collection and our first piece of data appear inside
our database. So there it is.
It's all very easy to add data through the Firebase dashboard.
But what we need is to be able to add this data from our app based off what the user is typing. To do
that, we have to head over to our chat_screen.dart and we have to input the Cloud Firestore package.
And now we get to save the message that the user has typed into a variable maybe let's call it message
Text and we're going to set the value of the text field right here to that messageText variable.
So we'll set that equal to value.
And now we're ready to use the message text along with the loggedInUser.email to be able to send
that data over to our Cloud Firestore. And we're going to do that when the user presses on the send
button,
so right here inside that onPressed call back. We know that we have access to the messageText through
that property messageText and we also have access to the sender which is the loggedInUser.email.
And it's also really important to remind yourselves of what you called the collection and what you called
the fields, sender and text.
Just make sure that when you use them in your code that you've typed it out exactly the same including
the capitalizations, they need to match.
Now we're ready to create a new instance of our Cloud Firestore.
So just as what we did with auth, we're going to create a Firestore which is going to equal Firestore
.instance
and we can use our firestore right here in the onPressed and we can tap into a collection of our choosing.
Now the path is the string that we specified for the name of the collection.
So it has to be messages
in my case, so I'll just put that in here, messages.
Make sure that you've got it exactly the same as what you have in your Firebase console.
And now we're ready to add some data to it. And notice that the add method expects a map data type.
So it has to be a map that has a string as the key and the value can be any data type.
So let's create a map by adding in our curly braces and our keys have to match with what we specified
as the fields of the documents in our collection.
So we've got sender and we've got text.
So let's start with text as the first key and the value for that of course should be the messageText
that the user typed in to the text field.
And the second one is going to be the sender and the sender field is going to have the email address
of the logged in user.
This is the easiest way of identifying a user to see which messages they sent.
So now we're all ready to test it out.
So let's hit run and check out our app. Let's go ahead and log in as angela@email.com and put
in my password, click log in and now I'm going to type a message.
Let's just type 'Hello World' and hit send.
Now nothing's going to happen over here because we haven't handled that yet, but if we go into our console
and we hit refresh or click on the little button here, then once our console loads up, we should see that
our message's collection has now two pieces of data.
This is the original one and this is the one that we added just now via our app.
So we're actually now able to save data into our collection in our Cloud Firestore.
And now all we have to do is to retrieve the data.
So that's what we're gonna be doing in the coming lessons.