Here's What I Made: Chat Progressive Web Application

Written by aladinyo | Published 2021/05/05
Tech Story Tags: react | javascript | web-development | pwa | firebase | nodejs | web | frontend-backend

TLDR The app is a chat progressive web application with React, NodeJS and firebase. It comes with a lot of features like push notifications. It works offline you can use it offline and you can send text messages only when you come back online they will be automatically sent. The app may not run because free limits of firebase or hosting service has been exceeded!! It may not be able to run because of the free limits. It is very well explained in the GitHub repository. It is also possible to send an audio message or receive one in a conversation.via the TL;DR App

Hello everyone,
I made a chat progressive web application with React, NodeJS and firebase, it comes with a lot of features like push notifications.
Follow the link and search for my name "alaa" and chat with me.
The app is very well explained in the github repository.
Don't forget to ALLOW NOTIFICATIONS when you use the app.
Link: https://whatsappy-app.web.app/ ALLOW NOTIFICATIONS !!!
the app may not run because free limits of firebase or hosting service has been exceeded!!
GIVE ME A STAAR ⭐⭐⭐!!!
Let's discuss the app in the comments.

Features of the app

  • Messaging users in real time.
  • You can text messages.
  • You can send Images.
  • You can send an audio message.
  • You click on an image sent in a chat and it will smoothly animate to the center so you can see it.
  • You can see if the user is typing or recording.
  • You can record an audio and send it.
  • You can delete the conversation.
  • You can search for users.
  • You can see the online status of users.
  • You can see the unread messages.
  • You will have a seen at the bottom if the user saw your message.
  • You have an arrow button that allows you to scroll down the chat you also see the unread messages in it.
  • The audio slider is grey when you send an audio message and is green when you receive one and becomes blue if the receiver plays the audio.
  • The audio player allows you to see the full time of the audio and if you play it you will see the current time.
  • You can receive notifications if a user sent you a message.
  • A sound is played when you send a message or receive one in a conversation.
  • Another sound is played if you receive a message from another user.
  • The app works offline you can use it without internet and you can send text messages only when you come back online they will be automatically sent.
  • Finally you can click on the arrow down button at the home page and the web app is installed in your device.

Written by aladinyo | I'm a fullstack developer with react firebase and nodejs
Published by HackerNoon on 2021/05/05