ReactChat

ReactChat is the master thesis project for my course in front end web developement. It is a full-stack chat application built with React and Firebase, where users can create an account and send text messages, audio and media files to each other.

Demo

https://react-chat-aad5f.web.app/

Features

• Sign in with email/password or with Google Auth
• Users can query the database to find other users by email or phone number
• Send and receive data in-real-time with zero delay thanks to Firebase's realtime database Cloud Firestore
• Users can record and send audio files
• Users can upload images from their devices
• Emoji support
• Custom hooks to handle auth, media uploads, etc.
• Responsive and cross platform
• 3D components build with react-three-fiber
• E2E testing with Cypress.io

Tech Stack

• ReactJS with Typescript as the application client
• Firebase as the auth provder, hosting service for the demo application, and database in the form of Cloud Firestore
• SCSS, styled-components, and Material UI for styling
• react-three-fiber & react-three/drei to render the globe component on the homepage
• framer-motion as the animations library
• lottie animations
• CypressJS as the E2E testing library

Installation

Clone the repository and install all dependencies

  git clone https://github.com/Dan7n/react-chat.git
  cd react-chat
  npm install 
  npm start

Feedback

If you have any feedback, please reach out to me at [email protected]