michalosman / chat-app

Realtime Chat App created with MERN & PERN stack.

Chat App

Realtime Chat App created with MERN stack. There's also an alternative backend version using a SQL database.

Live Demo 👈

Features

Guest

• Sign up
• Sign in

User

• Create and manage private chats
• Create and manage group chats
• Send messages
• Report users

Moderator

• List users reports (able to warn reported user or close report)
• Warn reported user
• Close report

Admin

• List users warned 3 or more times
• Ban user warned 3 or more times
• List banned users
• Unban user

Technologies used

Frontend

• JavaScript
• React
• Redux
• Material UI

Backend

• JavaScript
• TypeScript
• Node.js
• Express
• Socket.io
• JWT

Database

• MongoDB & Mongoose
• PostgreSQL & TypeORM

Geting started

Clone repository

git clone https://github.com/michalosman/chat-app.git
cd chat-app

Client setup

Create a .env file in the client directory and set up the following environment variables

REACT_APP_SERVER_URL=<Address of the server, e.g. http://localhost:5000/>

Install packages and start client

cd client
npm install
npm start

Server setup

Create a .env file in the server directory and set up the following environment variables

PORT=<The port the server will run on, e.g. 5000>
CLIENT_URL=<Address of the client, e.g. http://localhost:3000/>
SECRET_KEY=<Passwords encryption secret key, e.g. somesecretkey123>
MONGO_URI=<Your MongoDB database URI>

Install packages and start server

cd server
npm install
npm start

SQL server setup (server-sql)

Create a .env file in the server directory and set up the following environment variables

PORT=<The port the server will run on, e.g. 5000>
CLIENT_URL=<Address of the client, e.g. http://localhost:3000/>
SECRET_KEY=<Passwords encryption secret key, e.g. somesecretkey123>
PG_HOST=<Postgres host, e.g. localhost >
PG_PORT=<Postgres port, e.g. 5432>
PG_USERNAME=<Postgres username>
PG_PASSWORD=<Postgres password>
PG_DATABASE=<Postgres database name, e.g. chatapp>

Install packages and start server

cd server
npm install
npm start

Migrations

• Generate

npm run migration:generate <name>

• Run

npm run migration:run

• Revert

npm run migration:revert