Skip to content
← Back to Community
Working Social Media Chatting App!
Profile icon
Muhammad_SJC

Announcement

Latest new feature: the style of the app has been changed and a report button has been added.

Also, click here (https://repl.it/talk/share/Working-HTML-Calculator-for-my-upcoming-OS/60217) for a new calculator I made. I am currently working towards building an OS, so the next app is a browser!

P.S: Try deleting a message for a nice animation for all users seeing the message being deleted!

20201011_130317

I recently made this chat app (and you might have seen that I am stuck in a problem with it in the "ask" section) and it works really well. It is real-time messaging with personalized "you" label on your messages. Also, if you want to delete one of your messages, hover onto your message and a "Delete" button will elegantly appear. Hope you like it!

P.S. I'm currently working on chat rooms, but for that, I need at least 70 upvotes, so please upvote! Also, the chatting app is fully responsive.

PLEASE do not change the "firebaseconfig" variable as it handles the database, and if you use it in another program, you will be reported for plagiarism from Google Firebase (So you cannot fork this repl). So, in short words, just don't worry about anything that has "firebase" in it.

Also, it only works in the repl engine, so trying to run it fullscreen on the web is sort of useless. And when you run it on repl, resize the results area to capture as much screen as possible.

Also, you can click the "open" button in the repl widget that comes with this post.

(See additional messages in the chat app itself)

Thank you :)

Voters
Profile icon
SamuelGames1
Profile icon
TheDestroyer99
Profile icon
programmeruser
Profile icon
Corus
Profile icon
peternielsen112
Profile icon
TofuDaSoybean
Profile icon
MasterwuYT
Profile icon
dudeactualdev
Profile icon
7ih
Profile icon
ComputingSquid
Comments
hotnewtop
Profile icon
[deleted]

Hello! Could I please use your Chatting App for my arcade?
Here is the link to my arcade: https://repl.it/@dhruvkumarrajan/Utopia-Arcade-Forever#README.md
Thank You. ALL CREDITS WILL BE GIVEN.
Thanks once again,
Hope you will accept my offer.

Profile icon
Muhammad_SJC

@dhruvkumarrajan Sure! But it is in html css and js, and your code in in python, so idk how to integrate these. Also, could put the link of my chatting app in your post, because I worked really hard on it and I'm not getting any people to visit it. :(

Profile icon
Muhammad_SJC

@dhruvkumarrajan Also, contact me because the database is case-sensitive, so I'll help you set up a new one.

Profile icon
[deleted]

@Muhammad_SJC
Thank You So Much! I am also not sure aout how to set u a html program in python, ut I am trying to learn about 'Flask', which should help me do it. I really really liked your chat program. It was literally the best and neatest program i have ever seen on replit. Don't worry, I will make sure your chat program becomes popular. :)
Thanks!

Profile icon
Muhammad_SJC
Profile icon
[deleted]

@Muhammad_SJC
Do you want to build a website like 'Amazon' with me?

Profile icon
Muhammad_SJC

@dhruvkumarrajan Kinda hard but ok

Profile icon
[deleted]

@Muhammad_SJC
OK! I have invited you over to it!

Profile icon
[deleted]

@Muhammad_SJC
I have an idea - Let us implement this chatroom in the project!

Profile icon
[deleted]

@Muhammad_SJC
Hi, I have added this chat to the project. If you don't want it to be added, you can delete it as I have invited you to the project.
Thanks! :)

Profile icon
Muhammad_SJC

@dhruvkumarrajan Sorry I didn't see the messages until now. You can have the app in the project. Sure:)

Profile icon
[deleted]

@Muhammad_SJC
Hi! Could you please tell me how yourchat app was made? Also, how can we make an html form in replit so that when the user submits the form, it should send it to our email?
Thanks!

Profile icon
[deleted]

@Muhammad_SJC
Hi! Did you make the new edits in the 'Utopia' website?

Profile icon
Muhammad_SJC
Profile icon
Muhammad_SJC

@Muhammad_SJC If you don't like it I can remove it.

Profile icon
[deleted]

@Muhammad_SJC
No, the edit is great! Thanks! :)

Profile icon
[deleted]

@Muhammad_SJC
Hello! Could you please make a personal chatroom for the website
Like, they should only be able to talk with me.
Thanks!

Profile icon
Muhammad_SJC

@dhruvkumarrajan I'm working on that

Profile icon
[deleted]

@Muhammad_SJC
OK, Thanks! :)

Profile icon
[deleted]

@Muhammad_SJC
Hi! Have you finished the chat-room?
Thanks!

Profile icon
Muhammad_SJC

@dhruvkumarrajan can you give me the link to your post?

Profile icon
AgastyaSandhuja

nice css but chatbox needs to be cleared on send. Also, I can't enter it on a new tab only on the replit site
overall i really like it. Keep up this amazing work ur rlly good!

Profile icon
Muhammad_SJC

@AgastyaSandhuja I meant that open repl.it in a new tab, and then run it on both tabs ON repl.it

Profile icon
Muhammad_SJC

@AgastyaSandhuja And I wi make the text box clear after sending a text.

Profile icon
Muhammad_SJC

@AgastyaSandhuja All done! Now the text box clears after sending message!

Profile icon
Leroy01010

Epic!!

This is to cool!!

Profile icon
Muhammad_SJC

@Leroy01010 I will add a feature where you can mention people using @, thanks for the suggestion!

Profile icon
Leroy01010

np @Muhammad_SJC

Profile icon
ElliottDOrazio

hello

Profile icon
TofuDaSoybean

@Muhammad_SJC How can you make a separate private server or a server that's separate from the Public one for this?

Profile icon
SlappableFace

Could you please make a tutorial, I would like to use one of these so i can chat with my friends during school. My school has blocked all the sites we are allowed to use to chat.

Profile icon
Muhammad_SJC

@SlappableFace yeah sure! But the tutorial is going to be LONG, so I found this youtube video that shows the most basic form of my app. Here is the video: https://youtu.be/CK2XEyVGc6c

It shows a nice app at the start, in the demo app, but the tutorial he shows you is just the most basic form of the app. So you have to style the app for your self. But even this most basic form works like magic. You need to have Firebase realtime database connected. I don't know if he shows you how to cennect to firebase database, so watch other tutorials as well.

Don't forget to upvote!

Profile icon
SlappableFace

@Muhammad_SJC Thank you! This is perfect!

Profile icon
Muhammad_SJC

Hope you like the new font size update!

Profile icon
DynamicSquid

Wow! This is awesome! I really like the CSS!

Profile icon
Muhammad_SJC

@DynamicSquid Thanks for the upvote, it keeps me motivated!