A real-time chat application built with React.js (Vite), TailwindCSS, TanStack Query, Redux Toolkit, and Redux Persist for the frontend. The backend is powered by Nest.js, MongoDB, Prisma, Cloudinary, and includes Swagger API documentation. The app supports group chats, public channels, private groups, message variations, and more.
- Group Chatting: Supports both public channels and private groups.
- Real-Time Communication: Utilizes Socket.io for live message updates.
- Push Notifications: Implemented with web push for notifying users even when the app is closed or in kill mode.
-
Clone the repository:
git clone https://github.com/shkwahab/chatappUi cd chatappUi
-
Install the dependency if you dont have pnpm package manage than follow this setup:
npm i -g pnpm pnpm i
Otherwsie:
pnpm i
-
Create an .env file in the root directory with the following content and replace the keys according to your requirements:
VITE_BASE_URL = "https://apichat.chickenkiller.com"
VITE_SOCKET_BASE_URL = "https://socketchat.chickenkiller.com"
VITE_SOCKET_MESSAGES_BASE_PATH = "/messages"
VITE_SOCKET_ROOMS_BASE_PATH = "/rooms"
- Start the application:
Dev Environment:
pnpm dev
Run the server visit: https://apichat.chickenkiller.com/api-docs Here is the Backend App Github Repo visit: Backend App
- Subscribe: Adds a new subscriber to the notification system.
- Send Notification: Sends a push notification to all subscribers.
- Public Channels: Channels where anyone can join and chat.
- Private Groups: Groups where only authorized members can join.