I need Guide & Help for Chat App

I need help/guide/suggestions from everyone People.

I want to create a chat app for my college Community, Where Some features/limitations:

  1. Only App Register/login User can message in chat & without register/login user can only view/seen the message (suggest me for login system, like- firebase, google sheet, airtable etc.)
  2. In chat, Show the user - username or Gmail id, which one sent message
  3. Only limited number of messages send (ex- 50,100) in one day
  4. If user send Abusing languages, then it's verify before send message, if cause - warn user (max 5 times) if hit max time then block for send message in chat for given time (eg- 1 months)
  5. Only Branch specific user send message in their brach chat
  6. One general chat, where all users can chat
  7. One chat where, If user send message to direct admin as something demand for future features or help (only 2-5 message as a day)
  8. User send image (which is uploaded on free hosting/paid hosting/online image store databases)
  9. Pin message features in chat.
  10. Use online database which compatible (like- firebase, google sheet, borrow, airtable, cloud db, MySQL-php etc.)
  11. If admin send message on chat or personal reply on their messages then notify users

& Many more suggestions from your side.

I welcome all your response & time to guide me for building this.

  • Again Thank You Everyone :slightly_smiling_face: :pray:
    -Prem.Babu

Prem Babu you are thinking of many features, it will take huge efforts for you to develop such kind of app. All the very best from my side :+1:

1 Like

For real-time private / group / public chatting, I recommend to use MQTT with subscribe to different topics.

1 Like

@eAcademy thank you so much, can you guide free extension & posts which help to build this.

@Kevinkun i don't know about this, i hear first time.

There are a lot of tutorials for chat app, search the community, make your own version, then ask here if any questions.

I am trying to read various post related to build chat app and understand the pattern, how to build it.

  • Now i am one step ahead in my chat app project where i can show chat in app. for this i am using this ChatUI extension by @White_Tiger , in block use see ChatUIv5 which is basically this extension only i rebuild using fast-cli by @JEWEL , because it is open source so i can build own version (i only change seen tick pattern, all function/events/properties remain same.) so ChatUI & ChatUIv5 is same extension.

  • Further, for chat use online database to update real time chat, i am using firebase for now. i take this concept from this post aia by @Kevinkun .

  • Finally i show the chat but main problem is to adjust the chat in firebase (for now i am using Realtime database & i also want to learn firestore database from this extension post by @Jarlissonlira2 ).

  • i don't know, which is best for chat app ( Firebase Realtime database or Firestore database ) where may be thousands (1k+) of user use chat of their query & questions / answer.

  • The problem is at time to store data in firebase, i dont know how to set like the below screenshot & json (this firebase db structure is generated by ChatGPT) and ignore timestamp value because i convert it during sending to databse by block (like this 1729145800000 to 6:16:40 AM).

JSON Structure πŸ‘‡
{
  "chats": {
    "general": {
      "msg001": {
        "id": "msg001",
        "senderId": "uid100",
        "type": "text",
        "text": "Hello everyone!",
        "timestamp": 1729145600000
      },
      "msg002": {
        "id": "msg002",
        "senderId": "uidAdmin100",
        "type": "text",
        "text": "Admin message",
        "timestamp": 1729145800000
      }
    }
  },
  "users": {
    "uid100": {
      "avatarUrl": "https://png.pngtree.com/png-vector/20230308/ourmid/pngtree-cute-girl-avatar-illustration-vector-png-image_6639400.png",
      "branch": "CSE",
      "email": "alice@college.edu",
      "name": "Alice",
      "role": "user",
      "gender": "Female"
    },
    "uid101": {
      "avatarUrl": "https://png.pngtree.com/png-vector/20230308/ourmid/pngtree-cute-girl-avatar-illustration-vector-png-image_6639400.png",
      "branch": "CSE",
      "email": "alice@college.edu",
      "name": "Prem",
      "role": "user",
      "gender": "Male"
    },
    "uidAdmin100": {
      "avatarUrl": "https://img.freepik.com/premium-vector/cute-smiling-boy-avatar-flat-style-vector-illustration_710508-1241.jpg",
      "branch": "Admin",
      "email": "admin1@college.edu",
      "name": "Admin1",
      "role": "admin",
      "gender": "Male"
    }
  }
}
Firebase real-time Database Structure screenshot πŸ‘‡
  • the pink line is my value which is set by blocks ( so it is my blocks response to firebase but i want as shown in json & firebase db structure)
Blocks πŸ‘‡
AIA File πŸ‘‡

chatUI_ext_demo_ai2.aia (51.3 KB)

Preview in App during testingπŸ‘‡

when (in firebase value change block):

then:

[/details]

and when:

then:

Thanks all developer to achieve this step :pray:

Now, i need your guide for further steps, i have already discuss about my current situation...