Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/mihir-shinde-24/chit-chat

Chit-Chat App is a Modern Responsive Cross-Platform Messenger App developed using technologies such as React JS, React-Router, Firebase as Backend and SCSS.
https://github.com/mihir-shinde-24/chit-chat

firebase firebase-auth firebase-realtime-database javascript-library react react-context-api react-hooks react-router sass-mixins scss

Last synced: about 1 month ago
JSON representation

Chit-Chat App is a Modern Responsive Cross-Platform Messenger App developed using technologies such as React JS, React-Router, Firebase as Backend and SCSS.

Awesome Lists containing this project

README

        

# Chit Chat App 📧
**Chit Chat** 📧 is a **Modern Responsive Cross-Platform Messenger App** developed using technologies such as **React JS, React-Router, Firebase as Backend and SCSS.**

Chat_demo.jpg

## 🚀 Features of the Application

1. This App enables users to instantly Send a **`Text message`** , share **`Images`** and also any GIF which will be displayed as an **`Animated Sticker`**.

2. The user has to first Create an account on the **`Register page`**.

3. If the user already has an Account he can go to **`Login page`**.

4. At Login page, user has to authenticate himself by filling Email and Password. If user enters wrong credentials, an Error Message will be displayed.

5. This Email and Password will be Authenticated using **`Firebase Authentication`** and upon successful validation, user will be redirected to **`Chat Page`**.

6. At Register Page, for Creating an Account, the user has to fill just some basic details such as Name, Email, Password & Select an Avatar which will be set as his Profile Photo.

7. Upon successful filling up of the details, the user details will be stored in **`Firebase Firestore`** Database and also User Account will be created using 'Firebase Authentication' then the user will be redirected to the **`Chat Page`**.

8. At Chat Page, the user has to first search for other users by searching the name in **`Find a User`** input box & then select the user to add to Friends list.

9. Now both User1 & User2 will be added in each other's Friend's list.

10. To start a conversation the user has to simply select another user from the **`Friends List`** on sidebar.

11. After selecting main chats page will appear with selected user's name at top and past conversations in the middle.

12. All the Chat history will be stored in the **`Firebase Firestore`** database.

13. On the sidebar we can also see latest message send by other users!

14. The users can have fun by sending text messages, images or Animated GIFs as sticker.

15. So, What are you waiting for? **`Let's Chit-Chat!`**

## 🚀 Check out the website here! 👉 [Chit-Chat-App](https://lets-chit-chat-app.web.app/login)

Chat_demo.jpg

## 🚀 Screenshots of Chit-Chat App

### 1. Login Page

Login.jpg

### 2. Register Page

Register.jpg

### 3. Home Page

Home.jpg

### 4. Chat Demo

Chat_demo.jpg