Ecosyste.ms: Awesome

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

Awesome Lists | Featured Topics | Projects

https://github.com/mdtehseenkhan/chit-chat-pro

Last synced: about 1 month ago
JSON representation

Host: GitHub
URL: https://github.com/mdtehseenkhan/chit-chat-pro
Owner: MdTehseenKhan
Created: 2023-07-10T16:01:57.000Z (over 1 year ago)
Default Branch: main
Last Pushed: 2023-07-15T15:39:54.000Z (over 1 year ago)
Last Synced: 2023-07-15T16:40:16.681Z (over 1 year ago)
Language: TypeScript
Homepage: https://chit-chat-iota.vercel.app
Size: 233 KB
Stars: 1
Watchers: 1
Forks: 0
Open Issues: 0
Metadata Files:
- Readme: README.md

Awesome Lists containing this project

README

# Real-Time Chat Application: Next.js 13, React, Tailwind, Prisma, MongoDB, NextAuth, Pusher (2023)

This is a repository for a Real-Time Chat Application: Next.js 13, React, Tailwind, Prisma, MongoDB, NextAuth, Pusher.

Key Features:

- Real-time messaging using Pusher
- Message notifications and alerts
- shadcn/ui robust components
- Tailwind design for sleek UI
- Full responsiveness for all devices
- Credential authentication with NextAuth
- Google authentication integration
- Github authentication integration
- File and image upload using Cloudinary CDN
- Client form validation and handling using react-hook-form
- Server error handling with react-toast
- Message read receipts
- Online/offline user status
- Group chats and one-on-one messaging
- Message attachments and file sharing
- User profile customization and settings
- POST, GET, and DELETE routes in route handlers (app/api)
- Fetched data in React Server components by directly accessing the database (WITHOUT API! like Magic!)
- Handling relations between Server and Child components in a real-time environment
- Creating and managing chat rooms and channels

### Prerequisites

**Node version 14.x**

### Cloning the repository

```shell
git clone https://github.com/MdTehseenKhan/chit-chat-pro.git
```

### Install packages

```shell
npm install
```

### Setup .env file

```js
DATABASE_URL=
NEXTAUTH_SECRET=

NEXT_PUBLIC_PUSHER_APP_KEY=
PUSHER_APP_ID=
PUSHER_SECRET=

NEXT_PUBLIC_CLOUDINARY_CLOUD_NAME=

GITHUB_CLIENT_ID=
GITHUB_CLIENT_SECRET=

GOOGLE_CLIENT_ID=
GOOGLE_CLIENT_SECRET=
```

### Setup Prisma

```shell
npx prisma db push

```

### Start the app

```shell
npm run dev
```

## Available commands

Running commands with npm `npm run [command]`