Installing the Front-end from Source

See: Creating an SSL Certificate

Installing the Requirements

Firstly, we’ll install the necessary dependencies.

workpath="/var/lib/interlock"
frontendPath="/var/lib/interlock/interlock_frontend"

apt-get update -y

# Install curl and fetch required script.
apt-get install git curl -y

curl -sL https://deb.nodesource.com/setup_16.x -o "$workpath/nodesource_setup.sh"

# Add nodesource repo
bash "$workpath/nodesource_setup.sh"

# Add yarnpkg key and repo respectively
curl -sS https://dl.yarnpkg.com/debian/pubkey.gpg | gpg --dearmor > /etc/apt/trusted.gpg.d/yarn.gpg
echo "deb https://dl.yarnpkg.com/debian/ stable main" | sudo tee /etc/apt/sources.list.d/yarn.list

# Install NodeJS and Yarn
apt-get update -y
apt-get install nodejs yarn -y

# ! Install NGINX if you'll compile for production
apt-get install nginx -y

# Create the install directory parent and the sslcerts directory
mkdir -p "$workpath/sslcerts"

Once you’ve installed all the requirements, you can pull the latest version of the repo.

git clone https://github.com/dblanque/interlock_frontend $frontendPath

Installing the required Node Modules

cd $frontendPath
yarn install

Once these modules and dependencies are installed you’ll need to change your backendUrl in src/providers/interlock_backend/local_settings.js.

Compiling or Serving the Front-end

Finally you’ll wish to either compile (for production) or activate the devserver.

You can do so with the following commands:

# Compile into a bundle
yarn build

# Activate devserver
yarn serve

Set up NGINX Site

If you’ve compiled the production build and wish to use it, NGINX is recommended.

For this you’ll need to create a site config file in /etc/nginx/sites-available (or another directory) and/or link it to /etc/nginx/sites-enabled.

echo \
"server {
        listen 80;
        server_name default_server;
        return 301 https://\$host\$request_uri;
}

server {
    listen 443 ssl http2;
    server_name default_server;
    ssl_certificate $workpath/sslcerts/fullchain.pem;
    ssl_certificate_key $workpath/sslcerts/privkey.pem;

    location / {
        root $frontendPath/dist;

        index index.html index.htm index.nginx-debian.html;
        try_files \$uri /index.html;

        # kill cache
        add_header Last-Modified \$date_gmt;
        # add_header Cache-Control 'no-store, no-cache';
        add_header Cache-Control 'max-age=900';
        if_modified_since off;
        expires off;
        etag off;
    }
}" > "$workpath/interlock.conf"

# Copy the file
ln -s "$workpath/interlock.conf" "/etc/nginx/sites-enabled/interlock"

# Test nginx config
nginx -t

# Restart and Enable nginx
systemctl enable nginx && systemctl restart nginx