kdhttps / mean-star

MEAN Stack application :fire: - Boilerplate :rocket: :dart: Docker :sunglasses: :fire:

MEAN-STAR

MEAN STAR is a starter application that helps you to easily start your project development with MEAN Stack technology. This project is mainly focused on the Security, integrated OpenID Connect OAuth 2.0 Authorization Code PKCE Flow and jwks jwt verification. It uses the AppAuth-JS which provides the very generic facility to integrate Authorization Code PKCE Flow with any Single-page Application(SPA) technology and with Any OpenID Connect Provider.

There are so many OpenID Connect Provider. For Example: auth0, okta, keyclock, google, onelogin, gluu, etc...

Currently I am using auth0.com. It is a good OpenID Connect provider. You can create free developer accound and test.

Live

https://mean-star.herokuapp.com.

Features

1. Integrated AppAuth-JS at front-end Application.
2. OpenID Connect OAuth 2.0 Authorization Code PKCE Flow for Client Front-end Application.
3. Protected API using jwks jwt verification
4. OpenID Connect OAuth 2.0 integration with any OP Providers.
5. User and token mapping and managing user sessions using lru-cache.
6. Production and development logger, helps to debug problems in production.
7. Dockerfile and docker-compose for easy development and deployment.
8. Covered Code Coverage

Versions

1. [M] Mongo DB >= 4.x
2. [E] Expressjs >= 4.x
3. [A] Angular >= 8.x.x
4. [N] Nodejs >= 10.x.x

Prerequisite

1. Node JS >= 10.x.x
2. Mongo DB >= 4.x
3. Angular CLI >= 8.3.x, Install it using npm install -g @angular/cli@8.3.20
4. OpenID Connect Provider and Client ID, Use your OpenID Provider to create new client.

Install Packages

Client

cd client
npm i

Server

cd server
npm i

Install npm i -g nodemon for developement.

Configurations

Client

Set your OP(OpenID Connect Provider) Client configuration the environments.ts.

export const environment = {
  production: false,
  apiURL: 'http://localhost:3000',
  // OP Server configuration
  clientId: '<your_client_id>',
  opServer: '<your_op_server_url>',
  opServerUserInfoEndpoint: '/userinfo',
  opServerExtraParamsInAuthRequest: {
    audience: '<your_op_server_url>/api/v2/'
  },
  redirectURI: 'http://localhost:4200/callback',
  logoutRedirectURI: 'http://localhost:4200',
  scope: 'openid email profile',
};

For auth0.com, you need to set extra params to get Access Token in JWT form. Please check here for solution. Every OpenID Connect provider has it's own configurations style so you may need to find out for JWT Access Token.

We need JWT Access Token so that we can use the JWKS Public key verification as Node JS Server side.

Use environments.prod.ts for production environment setup.

Server

Rename the from .env.sample to .env.

PORT=3000
DB_URL=mongodb://localhost:27017/mean
OP_SERVER_URL=<your_op_server_url>
USERINFO_ENDPOINT=<your_op_server_user_endpoint_path>
CORS_ORIGIN=http://localhost:4200

Set PRODUCTION=true for production.

Start Applications

Client

npm start

Server

npm start

For development,

npm run dev

Docker

For development

docker-compose build
docker-compose up

If you want to stop docker then press ctrl + c + c, docker-compose down.

Deploy

There are many ways to deploy the application.

Deploy using PM2

PM2 is a production process manager for Node.js applications with a built-in load balancer. It allows you to keep applications alive forever, to reload them without downtime and to facilitate common system admin tasks.

Follow the below steps for production:

1. Clone or move your code to server and install node_modules.

2. Install PM2

   npm i -g pm2

3. Make an angular production build.

   cd client
   ng build --prod

4. Move client/dist/client folder to server/ so that node application serve it.

   cp -R client/dist/client server/

5. Start PM2 service. which runs your application in the background.

   export PRODUCTION=true # or you can add this in .env
   pm2 start index.js

Deploy on NGINX

Angular is a front-end client application and deploy the client application on standard HTTP Server has several benefits. Please check here for more details.

Follow Below steps to deploy on Nginx:

1. Install NGINX Http Server
2. Clone or move your code on server and install node_modules.
3. Make an angular production build.

   cd client
   ng build --prod

4. Move /client/dist/client/* all files into /var/www/html
5. Start your node app using PM2. No need to set a production flag.
6. Added a Proxy Pass configuration for Node Application so that your front-end app can call it.

Deploy using docker

Docker makes our task very easy. You need to install docker and docker compose on server.

Follow below steps for deploy using docker

1. Install docker and docker compose.
2. Configure .env and environment.prod.ts.
3. Build the docker image

   docker-compose build

4. Run docker

   docker-compose up

Deploy on Heroku

First create a new App using Heroku dashboard and then follow the below step to build and deploy image on Heroku

heroku container:login
heroku container:push [image-name] -a [your-app-name]
heroku container:release [image-name] -a [your-app-name]

Liecnse

MIT