Skip to content

Latest commit

 

History

History
163 lines (122 loc) · 5.63 KB

README.MD

File metadata and controls

163 lines (122 loc) · 5.63 KB

Master Chat

This is a real-time chat web app that allows users to chat with any foreigner without knowing a foreign language.

Master Chat Demo

Ảnh chụp Màn hình 2022-09-26 lúc 01 26 54

Ảnh chụp Màn hình 2022-09-26 lúc 01 25 57

Ảnh chụp Màn hình 2022-09-28 lúc 13 04 37

Ảnh chụp Màn hình 2022-09-28 lúc 13 05 34

Ảnh chụp Màn hình 2022-09-28 lúc 13 05 45

Build With

Back-End

  • Typescript
  • Graphql-Yoga
  • Apollo
  • Graphql
  • Mysql
  • Prisma
  • WebSocket
  • Eslint
  • Git
  • Github

Front-End

  • Typescript
  • React
  • WebSocket
  • Apollo
  • Eslint
  • Git
  • Github

Installation

  1. Clone the repo
    git clone https://github.com/ngocban284/MasterChat.git
  1. Install depedencies packages
    cd server
    yarn i
    cd client
    yarn i
  1. Enter your Environment variables

Front-End Example

    HTTP_URI = http://localhost:4000/graphql
    WS_URI = ws://localhost:4000/graphql

Back-End Example

  PORT=4000
  DATABASE_URL= your mysql url

  [NAVER API]
  CLIENT_ID= your client id
  CLIENT_SECRET= your client secret
  PAPAGO_TRANSLTE_URL= https://openapi.naver.com/v1/papago/n2mt
  PAPAGO_DECT_URL= https://openapi.naver.com/v1/papago/detectLangs

  [JWT]
  JWT_SECRET_KEY= ricado
  1. Run
    cd client
    npm run dev
    cd server
    npm run dev

The Project

This is a web app where users can choose the right language for them to join chat rooms with other foreigners.

Users feature :

  • Change the light or dark mode.
  • Change random avatar that you like.
  • Enter a nickname to join the chat room.
  • Change your language.
  • Create a chat room.
  • Enter the code to join the chat room.
  • Voice text recognition.
  • Check the number of people in the chat room and the language they speak.
  • Exit chat room

Future feature:

  • Displays a list of chat rooms.
  • Create a public chat room.
  • Join random public chat room.

...

Project Architecture

Ảnh chụp Màn hình 2022-09-28 lúc 23 15 32

Pub/Sub Messaging system

Ảnh chụp Màn hình 2022-09-29 lúc 20 30 36

Ảnh chụp Màn hình 2022-09-29 lúc 20 30 47

Ảnh chụp Màn hình 2022-09-29 lúc 20 30 56