(You might have to accept all third party cookies in the browser)

Come Explore Realtime Chat Rooms

· Report Bug · Request Feature

Realtime Group Messaging Web Application

✨ Features

• Connect meta mask wallet to add hexagon-shaped NFT profile pictures. (currently loads NFTs from mumbai testnet)( Coming Soon ...)
• Authentication with Auth0
• Infinte Lazy Loading of Messages in Rooms using Intersection Observer
• Create your own Chat Rooms
• Send Invitation to Other people to join Rooms
• Update your profile picture and username
• Accept or Reject Chat Room Invitation
• Send and Recieve Messages in Realtime using graphQL subscriptions
• Voice rooms & Listen music with friends ( Coming Soon ...)

Tech Stack & Tools

• React
• Typescript
• Apollo GraphQL Client
• TailwindCSS
• Hasura
• Auth0
• PostgresQL
• Backend Serverless functions on Glitch
• Moralis
• 100ms
• Formik and Yup
• Eslint and Prettier

🚀 Local Development

Step-1

clone this repo

https://github.com/Udit-takkar/Box-Chat-Hasura.git

Step-2

Install all dependencies

cd client
yarn install

Step-3

Create .env file in client

REACT_APP_X_HASURA_ADMIN_SECRET=
REACT_APP_DEVELOPMENT_ENV=development
REACT_APP_MORALIS_APPLICATION_ID=
REACT_APP_MORALIS_SERVER_URL=

Step-4

npm start

Contributing

Box Chat is an open source project. Feel free to contribute and suggest any improvements. All bugs and issues should be reported to the issues tab.

License

This project is open source and available under the MIT License.

Box-Chat-Hasura