CODEWITHSUNDEEP
djangoreactjsfirebasefrontendbackend
Mehran
Mehran

Reputation: 1304

Using Firebase to make a simple group chat app, alongside an already existing django-react app

I have a basic project which uses django as backend and reactJS as frontend. Basically, it just shows a home page when a user logs in, and that's it. The sign up of new users is handled through the django.admin panel.

Now, I want to create a group chat for my users who are currently logged in using firebase. Here's the problem since I can't really understand the workflow on how I should proceed. My basic idea is that,

  1. frontend gets the username and password from backend,
  2. frontend posts them to firebase
  3. firebase sends a unique id token to the frontend,
  4. now frontend is logged in with both django and firebase,
  5. users who are logged in joins in the group chat

Is there any guidelines on how I should proceed with this? I have read the docs but I can't really understand what I should be doing to go through with this.

Upvotes: 0

Views: 507

Answers (1)

rimraf
rimraf

Reputation: 4126

You want to look at the docs for firebase.database().ref().on(<event here>) where <event here> is one of the firebase database events such as on, child_added, value

basically what you'll be doing is rendering a database ref, say: firebase.database().ref('livechat').on('value', snap => {render the snapshot}) to every client (to view the chat). Then, a user posts to the 'livechat' ref. You can add as much additional info to the users posted data (like uid) so that you can later filter the 'livechat' node by uid (or the like). Make sense?

Where it gets a bit trickier is when you want to have 1 on 1 chats. You can accomplish this in much the same way - maybe use one of the users uid as the ref. Like: firebase.database().ref(`chat/${user.uid}`).push(message_here so that when you render the chat in the client you have individual conversations.

Upvotes: 0

Related Questions