Skip to main content

[Make-A] Simple Chat Application using Cloud Firestore – Exercises and Thanks!

CONGRATULATIONS!!!ย ๐ŸŽ‰๐ŸŽ‰๐ŸŽ‰

Give yourself a pat on the back and be proud of yourself! You’re making progress to becoming an Android developer and you should be very happy.ย ๐Ÿ˜Š๐ŸŽ‰

You now have a foundation on building a chat application using Cloud Firestore. It’s now up to you to explore, add more features that you thought of while working on this tutorial, and get your hands even dirtier.

The only limit is your imagination.

I’d be super happy to share your work on my Facebook pageย where I share Android tutorials. By doing so, you will be able to inspire other people who saw what you made that they can do it too! Just message me a link to a demo of your app and I’ll happily share it to my page.

 

Where to go from here?

Below I’ve compiled a list of exercises that you can do that can further expand your skills and your app. These were the things that came up to my head while I was working through the tutorial. There were a lot of “Oh! We can do this! We can add this!” moments and I’ve compiled all of them below as exercises. I bet you had some of those moments too!

Exercises

Exercise #1

As a user,
When I open the app,
I want to see the recent message below the chat room name,
So that I will have an idea what the room is currently talking about

  • Display the recent message below the name of the chat room

Exercise #2

As a user,
When I open the app,
I want to see some indication that I have read the latest messages,
So that I will know which chat rooms I haven’t read yet

  • Bold the recent message if I haven’t read it yet in the chat room
  • Un-bold the recent message if I have already read it in the chat room

Exercise #3

Using the default colors is pretty bland.

I bet you already have the colors of your app in mind. Change the colors of the app that suits best with the idea that you have in mind. Check outย Material Design Color Palette to give you some insights on how to pick some colors.

Exercise #4

As a user,
When I enter the chat room
I want to know how many members are in the chat room

  • Display the total number of members in the chat room

Exercise #5

As a user,
When I enter the chat room
I want to know how many members are currently in the chat room

  • Display the total number of members that are CURRENTLY IN the chat room

Exercise #6

As a user,
I want to be able to enter a nickname,
So that others user know what name should they address me

  • At startup, if a nickname for the user is empty, ask for it and save it to Cloud Firestore.
    Just update the user document with a new property called “nickname”.

Exercise #7

As a user,
I want to see all the members in the chat room that I’m currently in

  • Display an icon that a user will click to show all the members of the chat room

Exercise #8

As a user,
In the rooms screen,
I want to be able to search for a chat room,
So that I won’t have to scroll to look for the chat room

  • Display a search indicator that the user will click to search for a chat room
  • Display all the chat rooms that CONTAINS the keyword that the user entered
  • Sort search results alphabetically

Exercise #9

Optimize the chat messages shown in the chat room by querying only the latest ~20 messages. Then query the latest ~20 again when a user scrolls half the height of the RecyclerView (or whatever list view that you are using web/iOS/Android).

Exercise #10

As a user,
I want to be able to upload an avatar

  • Together with entering a nickname field, display something that the user can press to upload an avatar
  • Take a look atย Firebase Cloud Storage

 

THANK YOU!!!ย ๐ŸŽ‰๐ŸŽ‰๐ŸŽ‰

Thank you so much for completing the tutorial. I hope that you’ve learned a lot and inspired you that YOU can MAKE an APP.

Complete the exercises above and I’m sure you’ll have a feature-rich app that you can upload to Play Store and add it your Resumรฉ/CV.

This is my first tutorial series and there’s a TON of things that I need to improve and I’ve learned a lot also. I promise to improve future Make-A Challenges from the things that I’ve learned while working on this first Make-A Challenge.

Once again,ย I’d be super happy to share your work on my Facebook page. Most of the followers are college students. Sharing your work will inspire them that THEY can make an app too. We never know, your work might inspire some of them to fully pursue a career in our field.

Share your work/demo by either:

As always,

Keep learning,
Keep coding,
And be a better developer today than yesterday

Arth Limchiu

 

Table of Contents

  1. Part 1 – Specs and Introduction
  2. Part 2 – Setting up Firebase Cloud Firestore
  3. Part 3 – Adding a Simple Authentication
  4. Part 4 – Adding a FloatingActionButton (FAB)
  5. Part 5 – Creating a Chat Room
  6. Part 6 – Entering The Chat Room
  7. Part 7 – Displaying The Chat Rooms
  8. Part 8 – Chat
  9. 10 Exercises and Thanks!