Group Chat App using GraphQL

A Simple Group Chat application made using MERN (MongoDB Express React Node) stack along with graphQL and JWT based login support.


View Demo · Report Bug · Request Feature

Table of Contents

1. About The Project
   • Built With
2. Getting Started
   • Prerequisites
   • Installation
3. Contributing
4. License
5. Contact

About The Project

This is a simple project to learn graphQL by building a group chat application where we build a node.js server to host the graphql API's and a React based client to connect to it

Major Features of this application:

• Registration / Login functionality with JWT based authentication
• MongoDB Schema using Mongoose library
• GraphQL schema generation using graphql-compose-mongoose
• React based client with Material-ui components.
• GraphQL subscriptions for real-time messaging

Built With

• Node.js
• React
• Apollo GraphQL
• MongoDB

Getting Started

This is an example of how you may give instructions on setting up your project locally. To get a local copy up and running follow these simple example steps.

Prerequisites

• npm

  npm install npm@latest -g

Installation

1. Creata a free cluster on MongoDB Atlas and get the connection URI
2. Clone the repo

   git clone https://github.com/shivamkataria2000/group-chat

3. Install NPM packages

   npm install

4. Create a .env file with the following

   NODE_ENV=development
   PORT=8000
   MONGODB_URI=***GET_FROM_MONGO_DB_ATLAS****
   HEALTH_ENDPOINT=up
   JWT_SECRET=***ChangeThis***
   

5. Update config.js

   export const HTTP_API_URL = "http://localhost:8080/graphql";
   export const WS_API_URL = "ws://localhost:8080/graphql";
   

6. Start the server

   npm run dev
   Open http://localhost:8000/ for graphQL playground

7. Start the client

   npm run client
   Open http://localhost:3000/
   

Contributing

Contributions are what make the open source community such an amazing place to be learn, inspire, and create. Any contributions you make are greatly appreciated.

1. Fork the Project
2. Create your Feature Branch (git checkout -b feature/AmazingFeature)
3. Commit your Changes (git commit -m 'Add some AmazingFeature')
4. Push to the Branch (git push origin feature/AmazingFeature)
5. Open a Pull Request

License

Distributed under the MIT License. See LICENSE for more information.

Contact

Shivam Kataria - @smartShivkat - [email protected]

Project Link: https://github.com/shivamkataria2000/group-chat

Deployments:

• UI is deployed with vercel

• Updated from node 14 to 16 (As of 9th Oct 2023)

• Sevice layer migrated from Heroku to Render as of 9th Oct 2023