Gemverse is a real-time chat built using the MEVN stack. The app is based on rooms - organized channels that allow user to talk about programming, hobbies, games and more.
Try Gemverse by yourself:
| Technology | Description | Link |
|---|---|---|
| Sass | Preprocessor that helps write maintainable CSS | https://sass-lang.com/ |
| Vuetify | Vue UI Library helps to generate responsive and polished applications | https://vuetifyjs.com/ |
| Vue.js | Versatile Progressive Javascript Framework for building user interfaces | https://vuejs.org/ |
| Node.js | Asynchronous JavaScript runtime designed to build scalable network applications | https://nodejs.org/ |
| Express | Unopinionated, minimal and flexible Node.js framework | https://expressjs.com |
| Socket.IO | Web sockets implementation enables real-time event-based communication | https://socket.io/ |
| Passport | Authentication middleware for Node.js | https://www.passportjs.org |
| JWT | A package that generates tokens for secure authentication | https://github.com/auth0/node-jsonwebtoken/ |
| bcrypt.js | A library to help hash passwords stored in databases | https://github.com/dcodeIO/bcrypt.js/ |
| MongoDB | NoSQL document database that works well with Node.js | https://www.mongodb.com/ |
| Mongoose | MongoDB object modeling tool for Node.js | https://mongoosejs.com/ |
| Day.js | A library that parses, validates, manipulates, and displays dates and times | https://day.js.org/ |
| Jest | A comprehensive JavaScript testing solution | https://jestjs.io/ |
| Cypress | E2E Testing Framework that runs in a browser | https://www.cypress.io/ |
-
Register and authenticate users, secure passwords
-
Enable room based communication
-
Create public/secured room or join already made channels
-
Display new users and rooms in real-time
-
Generate unique SVG based avatars
-
Allow users to delete their own accounts and generate anonymous alias
To run the application install Node.js, MongoDB and Vue CLI. To do so follow instructions on official websites.
- Clone the repository
git clone [email protected]:Karol-Witkowski/Gemverse.git
cd Gemverse- Install dependencies
Run npm install for root, client and server directories to install required node modules.
- Install dependencies for the project root folder
npm install- Install dependencies for the client directory
cd client
npm install- Install dependencies for the server directory
cd server
npm install- Create a .env file in the server directory according to the configuration
Go to configuration section or check a .env.example file inside the repository.
- Set properly environment variables and database
Note: To run code locally variables must be set following the code below:
NODE_ENV='development'
HEROKU_DEPLOYMENT=false- Run the application
Be sure to run a script in the project root folder.
npm run devVisit application on: localhost:8080.
To run the application basic configuration is required. This step includes generating JWT, setting the database and adding environment variables.
The application use JWT-based authentication. To take advantage of this solution generate JWT secret and store it in a .env file.
The application uses the MongoDB database. Generate MongoDB URL and store it in a .env file. To do so follow MongoDB guide.
To start using the application create a .env file in the server directory and setup variables following the guide below.
Note: Never expose those variables. The wrong configuration will result in an error
DATABASE_URL=DATABASE_URL
TESTDB_URL=TESTDB_URL
SALT_WORK_FACTOR=SALT_WORK_FACTOR
# JWT secret
JWT_KEY=JWT_KEY
# JWT expire time
JWT_EXPIRE=JWT_EXPIRE
NODE_ENV='development'
HEROKU_DEPLOYMENT=false
PORT=PORTThe application contains both client and server tests. Thanks to the cross-env module user can skip seeding manually data for all tests or setting NODE_ENV to 'test' for all tests except E2E.
Be sure to run scripts in the right directory
Client directory unit tests written using Vue Test Utils with Jest. To run client tests open the terminal and run the code below:
cd client
npm run test:unitMostly API routes unit tests written in Jest. All of them use seeded data. To run server tests open the terminal and run the code below:
cd server
npm run test:watchE2E tests are written in Cypress. Those tests simulate the real user scenario and interact with dummy data. To run E2E tests open the terminal and run the code below:
Note: Set NODE_ENV to 'test' to run those tests
Open Cypress Test Runner:
cd client
npm run test:e2e-openRun all tests headlessly in the Electron browser:
cd client
npm run test:e2e-runScripts are divided into three parts: root folder, client and server scripts.
Run application in the development mode:
npm run devRun client development server with Hot-Module-Replacement:
npm run serveLint and fix client files:
npm run lintRun client tests with Jest:
npm run test:unitLaunch Cypress in interactive mode with a GUI:
npm run test:e2e-openRun client E2E tests in headless mode with Cypress:
npm run test:e2e-runInsert initial data into a database:
npm run db:seedInitialize Vue UI and project manager:
npm run uiProduce a client production-ready bundle in the dist/ directory:
npm run buildStart and reload the application automatically:
npm run dev:watchRun and reload server tests with Jest Start automatically:
npm run test:watchInsert initial data into a database:
npm run db:seed