iswilljr/message-app

Message App

Me - Chat App

Technologies used

• ✅ Frameworks: Nextjs 13, Apollo
• ✅ Auth: Next-Auth.js
• ✅ ORM: Prisma.
• ✅ Database: MongoDB Atlas.
• ✅ Styling: Mantine.
• ✅ Typescript Schema Validation: Zod.

Project structure

- client
  |- components
  |- env
  |- graphql
  |- pages
  |- utils
  |- types
- server
  |- schema
  |- utils
  |- types
- utils
  |- prisma

Getting Started

1. Install dependencies:

yarn install
# or
npm install

2. Create a .env file inside client and server folders:

The environment variables must match the following schemas: client schema and server schema

cp -r client/.env.template client/.env
cp -r server/.env.template server/.env

How to get environment variables

MongoDB Atlas database:

• Create an Atlas account
• Deploy a free cluster
• Add your connection IP address to your IP access list
• Create a database user for your cluster
• Connect to your cluster
• Copy the connection URI string and paste it into MONGODB_URI env.

Github OAuth:

• Click here to create new Github OAuth app
• Go to "Client secrets" and generate new client secret and and paste it into GITHUB_CLIENT_SECRET env
• Copy the Client ID and paste it into GITHUB_CLIENT_ID env

Google OAuth:

• Documentation
• Configuration
• Next Auth Google Configuration
• Copy the Client ID and paste it into GOOGLE_CLIENT_ID env
• Copy the Client Secret and paste it into GOOGLE_CLIENT_SECRET env

Next Auth:

• NEXTAUTH_SECRET: your_secret.
• NEXTAUTH_URL: http://localhost:3000/.

Public API URLS:

• NEXT_PUBLIC_WS_GRAPHQL_URI: ws://localhost:4000/graphql
• NEXT_PUBLIC_GRAPHQL_URI: http://localhost:4000/graphql

Others:

• CLIENT_ORIGIN: http://localhost:3000

Start developing

Now you can run:

yarn dev

License

This project is MIT Licensed.