Production deployment

Bare install on (Ubuntu) Linux

Requirements

• nodeJS > v14
• mariadb > v10.4
• pm2

Create the database

On the host machine, create the database with:

[mariadb]: CREATE USER 'apothiquizUser'@'localhost' IDENTIFIED BY '__YOUR_PASSWORD_HERE__';
[mariadb]: CREATE DATABASE apothiquizDb;
[mariadb]: GRANT ALL PRIVILEGES ON apothiquizDb.* TO 'apothiquizUser'@'localhost';

Configure the server

After cloning the repository into something like /var/www/, create the /server/.env configuration file. Customize all the values under "Server configuration".

git clone https://github.com/ValFraNath/apothiquiz.git
cd apothiquiz
sed -n -e '/# Server configuration/,$p' '.env.example' > './server/.env'
$EDITOR "./server/.env"

Install dependencies and compile the client

Run npm install (or npm i) in both server/ and client/ directories to install all dependencies with npm.

Then run npm run build in client/ to compile the React client.

Launch the app for the first time

In /server/, launch the app for the first time using pm2

$ pm2 start index.js --name apothiquiz

Serve the app

You can access to the app with HOST_MACHINE_IP:$PORT, or by setting up a proxy as nginx in front of the app. Here is an example of a nginx configuration, which serves the app without using the node server.

Add this config in /etc/nginx/sites-available/apothiquiz:

server {
    server_name www.example.tld;

    charset utf-8;
    client_max_body_size 50M;

    root /var/www/apothiquiz/client/build;

    location / {
        index index.html;
        try_files $uri /index.html =404;
        add_header Cache-Control "no-store, no-cache, must-revalidate";
    }

    location /static {
        expires 1y;
        add_header Cache-Control "public";
    }

    location /api {
        proxy_set_header Host $http_host;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_pass http://127.0.0.1:5035;
        proxy_http_version 1.1;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection "upgrade";
        proxy_next_upstream error timeout http_502 http_503 http_504;
    }
}

And then activate it:

ln -s /etc/nginx/sites-available/apothiquiz /etc/nginx/sites-enabled/
nginx -t # (checks the configuration)
systemctl reload nginx

You'll have to setup HTTPS/SSL to allow the PWA functionality, and to secure the credential exchanges and increase the app speed. You can do it with Cerbot. After installing it, you can just run:

certbot --nginx
systemctl reload nginx

It will update the nginx config and automatically redirect http to https!

Script to update and restart

This script may be called each time a new Github release is published.

#!/bin/bash

if [ "$#" -ne 1 ]; then
  echo "Tag not precised"
  exit 1
fi

# This is a version tag
if ! [ "${1:0:1}" = 'v' ]; then
  exit 0
fi

# Assuming tag is newer than current tag

echo "Beginning deployment for release \`$1\`"
cd /var/www/apothiquiz/ || exit 1

echo "Using Node v14"
export NVM_DIR="$HOME/.nvm"
[ -s "$NVM_DIR/nvm.sh" ] && \. "$NVM_DIR/nvm.sh" # This loads nvm
nvm use default || exit 1

echo "Fetching code from Github"
git fetch origin main || exit 1
git reset --hard origin/main || exit 1
git checkout main || exit 1

echo "Checkout to $1"
git checkout "$1"

echo "Building client"
cd client || exit 1
npm install --production || exit 1
npm run build || exit 1
cd .. || exit 1

echo "Updating server"
cd server || exit 1
npm install --production || exit 1

echo "Restarting production server"
pm2 restart apothiquiz || exit 1

exit 0