Chatty 💬

Chatty is a chat application using Socket.IO server to establish a Web Socket connection between the server and clients, You can add friends, join rooms Create New rooms and start real-time chatting.

Table of contents

• Overview
  • Features
  • Screenshot
  • Links
  • Setup
• My process
  • Built with
    • Client
    • Server
• Author

Overview

Features

• View the optimal layout for the site depending on their device's screen size 💻/ 📱
• Save user details in database (Firebase) ✨
• Ability to Sign Up and Log In using your details or with Google ✨
• Create Rooms, Join Rooms, Add Friends and start chatting 🫡
• Landing page about the application ✨
• Dark and Light Theme 🎨
• Animation appears depending on the viewport 🎞️

Screenshot

Links

• Live Site URL: Here
• GitHub URL: Here

Setup

# Client
$ npm install
$ npm run dev

# Server 
$ npm install 
$ npm run start

My process

Built With

Client

• React - JS library
• Tailwind CSS - CSS framework
• Firebase -
• Framer Motion - Animation Library for React
• React Icons - React icons provides a huge collections of icons from different sources.
• React Router - Enables client side routing
• React Hook Form - Easy to use hooks to create forms
• React Hot Toast - React Notifications
• SocketIO Client - Bidirectional and low-latency communication for every platform

Server

• Express - Web Framework for NodeJS
• Socket.IO - enable real-time bidirectional communication between server and browser
• Nodemon - Helps with NodeJS by automatically restarting the server when any change happen.

Author

• Website - Mohanad Portfolio
• Twitter - @MohanadOO_
• LinkedIn - Mohanad Alrwaihy