Flutter task 5 Chat App
Task Description:
- Create a chat app representing beautiful ui.
- Store/retrieve user data into firebase.
Following steps are required to connect our app to goggle Firestore.
Step1: Create a Firebase project.
Step 2: Register your app with firebase.
Step3: Add a firebase configuration file.
Step4: Add Flutter Fire plugins
For getting more information about steps visit the following website:
After adding your app to the firebase you have to provide some dependencies.
What is dependencies?
Dependencies are one of the core concepts of the pub package manager. A dependency is another package that your package needs in order to work. Dependencies are specified in your pubspec.yaml. You list only immediate dependencies — the software that your package uses directly. Pub handles transitive dependencies for you.
Your have to provide these dependencies to pubspec.yaml file. You can download these dependencies from pub.dev.
These dependencies are use to connect with the firebase. Hence you can use any facility provided by the goggle firestore like storage, database, authentication etc
1.firebase_core: ^0.5.0
2. cloud_firestore: ^0.14.0+2
3. firebase_storage: ^4.0.1
4. firebase_auth: ^0.18.0+1
5. modal_progress_hud: ^0.1.3
Here is the over view of the chat app that we are going to make now-
For creating the chat app I created my first screen which is the home screen from where user can login the app and second screen is chat screen from where user can chat.
Main.dart:
In my main.dart file first I have initialize the firebase then it loads the MyApp()class that extend the stateless widget. And MyApp() loads the my HomePage class. My HomePage returns the login screen of my app.
When the app is loaded the first screen appear that is the home screen of my app and the home screen is basically a registration screen here user have to give his user id and password.
After the successfull registration of the user all the details like email and password stores in the goggle firestore then the chat screen appears.
Now user can type the message and to others.
In the app bar of my app I used the cross icon when user click on this icon user logout from this app.
In this app I used the stream builder for the chat screen which is used to get the previous chats of the user.
What is stream Builder?
Stream Builder is a Widget that can convert a stream of user defined objects, to widgets. This takes two arguments
A stream
A builder, that can convert the elements of the stream to widgets
The Github link for the code:
THANK YOU
